#cross-browser #accessibility #browser-detection
#кроссбраузерность #Специальные возможности #обнаружение браузера
Вопрос:
Я хотел бы включить разметку, которая упростит пользователям текстовых браузеров (links, elinks, lynx) использование моего сайта. Я смогу обслуживать эту специальную версию сайта на основе useragent, однако с какими функциями разметки текстовые браузеры справляются особенно хорошо?
Комментарии:
1. Возможно, вы захотите ознакомиться с общими рекомендациями по доступности: w3.org/TR/WCAG20
Ответ №1:
Лучше всего просто интенсивно использовать CSS для всего форматирования. Маловероятно, что текстовые агенты будут поддерживать все, поэтому, если вы удалите всю информацию о стиле во внешней таблице стилей (в основном для простоты обслуживания) и просто используете class
атрибуты там, где это необходимо, тогда вы, вероятно, обнаружите, что сайт изящно деградирует. Большинство (все?) браузеров поставляются с той или иной формой панели инструментов разработчика, поэтому вы можете отключить стили, скажем, в Firefox, IE, Chrome [что угодно] по запросу, и вы получите представление о том, как это, вероятно, будет отображаться в текстовых браузерах.
Единственное, с чем следует быть осторожным, это с таблицами — lynx их не поддерживает, но другие текстовые браузеры поддерживают (в большей или меньшей степени). Опять же, просто убедитесь, что страница деградирует изящно, насколько это возможно.
В конечном итоге использование CSS для всего вашего макета и части вашего форматирования должно означать, что большинство проблем, связанных с текстовым интерфейсом, должны быть решены.
Ответ №2:
Я не знаю никакой специальной разметки, которая вам понадобилась бы для этого. Возможно, просто меньше разметки, чем обычно. Используйте JS как можно реже, поскольку они имеют лишь ограниченную поддержку. Любая разметка, которая предназначена для придания сайту «красивого» вида в современных браузерах при использовании CSS и необычного выравнивания, скорее всего, там бесполезна и может быть помехой. В зависимости от содержимого вы можете захотеть использовать простой текст. Или страницы старого стиля (довольно много страниц GNU, подобных этому). Пример из онлайн-версии «Искусство программирования Unix» (http://www.faqs.org/docs/artu/index.html ), очень простой дизайн, который легко читать и отображать в любом месте. Никакого причудливого или какого-либо подразумеваемого дизайна, просто введите несколько ссылок и вы. Хотя это может подходить не для всех типов контента. В принципе, делайте это как можно проще и старайтесь избегать причудливых макетов или каких-либо макетов вообще, поскольку некоторые из этих браузеров просто отображают блочные элементы один за другим, а меню, которые были бы слева или справа, оказываются внизу или занимают весь первый экран без отображения содержимого до прокрутки вниз. На мой взгляд, горизонтальные верхние меню работают лучше всего. И, конечно, посмотрите, как это выглядит для вас, самостоятельно протестировав и немного пройдясь по нему.
Ответ №3:
Вы можете проверить наличие строки пользовательского агента. Вот полный список. Вы могли бы проверить наличие lynx, links, elinks и w3m. Однако лучше вообще не проверять строку агента и сохранять HTML чистым и простым. Некоторые браузеры с текстовым режимом, такие как elinks, имеют некоторую поддержку javascript. Поддержка CSS варьируется, но базовый html все равно будет работать.
Некоторые браузеры с текстовым режимом, такие как ссылки, имеют графический режим, в котором также могут отображаться изображения.
Если вы придерживаетесь <html>
, <body>
<h1>
<p>
<a href="...">
и используете alt="..."
для любых изображений, вы не ошибетесь.
Ответ №4:
Для лучших серверных текстовых браузеров убедитесь, что вы используете простую семантическую разметку. Помните о мантре «Главное — контент» при создании своего сайта и создавайте структуру вокруг контента, а не вокруг визуального шаблона.
Когда ваш контент имеет приоритет, ваша страница не будет загромождена дополнительной разметкой и визуальными элементами, которые могут сбить с толку текстовые браузеры.