Доступность веб- страниц имеет так много преимуществ, что я действительно удивляюсь, почему такое большое количество веб-сайтов имеет такую дьявольски плохую доступность. Одним из основных преимуществ является повышение юзабилити, которое, по словам гуру юзабилити, Якоба Нильсена, может увеличить продажи / коэффициент конверсии веб-сайта на 100%, а посещаемость — на 150%.
В этот момент вы наверняка спросите: «Итак, если я сделаю свой веб-сайт доступным, его юзабилити возрастет, и я заработаю на этом больше денег?» Ну, не совсем. Доступный веб-сайт не является автоматически более удобным для использования, но есть много областей, где оно частично совпадает Давайте посмотрим на них сейчас.
1. Описательный текст ссылки
Слабовидящие веб-пользователи могут сканировать веб-страницы, переходя от ссылки к ссылке и прослушивая содержимое текста ссылки. Таким образом, текст ссылки на доступном веб-сайте всегда должен описывать его назначение.
Точно так же регулярно зрячие веб-пользователи не читают веб-страницы дословно, а сканируют их в поисках информации, которую ищут. Прочитайте этот параграф:
Это какой-то текст, много-много прекрасного текста.
Теперь вот предложение со ссылкой: чтобы узнать больше о наших виджетах, нажмите здесь .
После этого, есть больше текста, много и много прекрасного текста.
И еще одно предложение, содержащее еще больше текста, чтобы проиллюстрировать этот момент.
Как вы думаете, это сравнивается с этим?
Это какой-то текст, много-много прекрасного текста.
Теперь вот предложение со ссылкой в нем.
Пожалуйста, прочитайте о наших виджетах, когда вы посещаете наш сайт.
После этого, есть больше текста, много и много прекрасного текста.
И еще одно предложение, содержащее еще больше текста, чтобы проиллюстрировать этот момент.
Первый абзац имеет плохую доступность и удобство использования, поскольку ни пользователи с плохим зрением, ни пользователи с нарушениями зрения, которые сканируют абзац, не получат никакого смысла от слов «нажмите здесь». Второй абзац с текстом ссылки, который эффективно описывает его назначение, гораздо проще отсканировать — пользователи могут понять назначение ссылки без необходимости читать окружающие слова.
2. Ярлыки описательной формы
Посмотрите на эти два флажка . Они могут показаться похожими, но первый из них недоступен, поскольку текст приглашения не назначен для поля. Чтобы сделать его доступным, мы можем использовать <label for>
<input type="checkbox" id="good" /><label for="good">This is good</label>
Делая его доступным таким способом, вы получаете одно очень большое преимущество в использовании: текст тоже становится кликабельным. В примере нажмите на слова «Это плохо». Ничего не происходит, верно? Теперь попробуйте нажать «Это хорошо». Его флажок становится выбранным. Флажки маленькие и привередливы даже для самых устойчивых рук. Увеличьте кликабельный регион и все выиграют!
3. Разделите большие куски информации
Для повышения удобства использования сайта для слабовидящих пользователей могут быть применены многочисленные методы. Пользователи со слабым зрением должны слушать информацию на каждой странице и пытаться запомнить ее. Путем структурирования информации в небольшие управляемые группы можно добиться более быстрого понимания и более легкого отзыва.
Методы для достижения этой цели включают в себя:
- Используйте подзаголовки, чтобы разбить содержание тела
- Группируйте элементы формы с помощью команды fieldset
- Используйте списки
Не нужно быть гением, чтобы понять, что эта тактика повышает удобство использования и для зрячих веб-пользователей!
4. Предоставьте карту сайта
Карты сайта могут быть полезными инструментами доступности для слабовидящих пользователей, поскольку они предоставляют простой список ссылок на главные страницы сайта без каких-либо проблем. Карты сайта, конечно, полезны для всех, поскольку они предоставляют средства для быстрого поиска страниц и помогают пользователям визуализировать структуру веб-сайта.
5. Простой, легкий язык
С точки зрения доступности, это важно для людей с нарушениями чтения и / или когнитивных функций, а также для посетителей сайта, чей родной язык не тот, на котором вы пишете. С точки зрения удобства использования он помогает всем.
Чтение с экранов компьютеров утомляет глаза и примерно на 25% медленнее, чем чтение с бумаги. Таким образом, чем проще стиль написания, тем легче посетителям сайта усвоить ваши слова мудрости. По возможности, сокращайте свои предложения. Например, используйте «применить» вместо «сделать приложение» или «использовать» вместо «использовать».
6. Последовательная навигация
Последовательная навигация по страницам также является важным способом максимизировать доступность сайта для людей с нарушениями чтения и / или когнитивных функций, но, опять же, все выигрывают. Каждый раз, когда вы посещаете новый веб-сайт, вам требуется несколько секунд, чтобы приспособиться к уникальному макету и пользовательскому интерфейсу этой страницы. Представьте, что вам приходилось делать это каждый раз, когда вы переходили по ссылке на новую страницу!
В действительности большинство сайтов имеют последовательную навигацию по большинству страниц. Основным виновником нарушения этого правила является домашняя страница, которая на некоторых веб-сайтах отличается от остальной части сайта. Имея согласованный интерфейс для всего веб-сайта, мы можем мгновенно найти содержимое страницы без необходимости искать его.
Как вы знаете, согласованность навигации является основным принципом веб-дизайна, который не более или менее важен для сайтов, ориентированных на доступность. Это важно, что лежит в основе веб-дизайна в целом.
Независимо от того, заинтересован ли ваш клиент в доступности или удобстве использования, эти принципы остаются в силе. Так что, если у вас есть сомнения, обратитесь к этим принципам! Они обычно достаточно ориентированы на доступность.
7. Нет необъявленных всплывающих окон
Для тех из нас, кто пользуется программами для чтения с экрана, всплывающие окна могут доставлять неудобства. Программы чтения с экрана считывают содержимое любого окна, расположенного в «верхней части» — над всеми остальными.
Всплывающие окна, которые отображаются поверх основного веб-сайта, всегда будут считываться первыми, а не до содержимого реального сайта. Для пользователей с нарушениями зрения это может быть неприятно — они могут не понимать, что то, что они слышат, не является «настоящим» Веб-сайтом.
Всплывающие окна плохи для доступности. Что касается удобства использования, я уверен, что вы так же ненавидите всплывающие окна, как и я! Многие панели инструментов, такие как панель инструментов Google , теперь поставляются в комплекте с блокировщиком всплывающих окон, позволяющим вам просматривать веб-страницы без раздражения появления новых окон.
8. Используйте CSS для макета
Сайты на основе CSS обычно имеют большее соотношение контента и HTML-кода, поэтому они более доступны для программ чтения с экрана и поисковых систем. Веб-сайты, использующие CSS для верстки, также можно сделать доступными для автомобильных браузеров, WebTV и КПК. Не стоит недооценивать важность этого! По оценкам, в 2008 году во всем мире будет продано 58 миллионов КПК .
Помимо улучшенной доступности, у веб-сайтов на базе CSS есть одно большое преимущество удобства использования: повышенная скорость загрузки. Широкополосная связь не так широко распространена, как вы думаете. В Великобритании, например, только один из четырех пользователей сети подключен к широкополосной связи . Повысьте скорость загрузки своих веб-страниц, и вы получите большое преимущество в использовании по сравнению с конкурентами.
9. Сделайте стенограммы доступными для аудио
Одна группа пользователей сети с особыми потребностями в доступе — это люди с нарушениями слуха. Этим пользователям нужны письменные эквиваленты для аудиоконтента. Предоставление стенограмм на самом деле очень выгодно для всех пользователей. Многим посетителям вашего сайта, вероятно, не стоит ждать загрузки вашего 3-мегабайтного аудиофайла и начала воспроизведения. Они могут предпочесть краткое описание того, что содержится в аудиоконтенте.
Предоставляя расшифровку стенограммы, разбитую по подзаголовкам, с выделением ключевых терминов, посетители сайта, не являющиеся инвалидами, могут быстро просмотреть общее представление о контенте. Затем они могут принять более обоснованное решение об ожидании загрузки этого аудиофайла.
10. Избегание мерцания экрана и движения
Некоторые пользователи эпилептического Интернета должны быть осторожны, чтобы избежать мерцания экрана в диапазоне от 2 до 55 Гц. Веб-пользователи с нарушениями чтения и / или когнитивных функций, а также пользователи, использующие экранные лупы, будут стараться не отставать от прокрутки текста (если у вас есть прокрутка текста, обязательно предоставьте механизм для его остановки).
В дополнение к плохой идее для доступности, ни мерцание, ни прокрутка текста не годятся для удобства использования. Первое может отвлекать, когда вы пытаетесь читать, и вы видите, что что-то вспыхивает краем глаза; последнее не идеально, так как вы должны ждать медленного появления контента.
Подумайте об этом: когда вы видите прокручиваемый текст, вы отбрасываете все, чтобы вы могли прочитать его, когда он постепенно материализуется? Или ты просто игнорируешь это?
Другим недостатком прокрутки или изменения текста является то, что вы можете увидеть что-то, на что вы хотите нажать, но прежде чем вы это узнаете, оно исчезло. Затем вам нужно подождать 30 секунд, чтобы он снова появился!
Вывод
Несмотря на то, что все это дублирует юзабилити и доступность веб-сайтов, нет оправдания тому, что на вашем веб-сайте не реализована базовая доступность. Помимо этических аргументов, есть много причин, чтобы сделать ваш сайт доступным, одна из главных из которых заключается в том, что его удобство и простота использования будут улучшены. Никто не может поспорить с этим!
Будьте на связи! Завтра во второй части этой серии раскрывается второе скрытое преимущество улучшенной доступности.