сделать веб-сайты доступными для людей с нарушениями зрения?

Question

кто-нибудь может дать мне несколько советов или снабдить меня несколькими хорошими ссылками по этому поводу?

у меня возникли проблемы с поиском чего-то большего, чем "добавить альтернативный текст к изображениям", и я не уверен, насколько актуальна информация...

я понимаю всю суть семантической разметки, но, вероятно, не помешало бы дать немного больше указаний и по этому поводу.

также не уверен, как все будет работать в разных браузерах....

Спасибо!

Answer 1

1) Используйте теги заголовков HTML для каждого раздела контента на ваших страницах.Тегами заголовка являются:h1, h2, h3, h4, h5, h6

2) Убедитесь, что ранее упомянутые теги заголовков существуют в надлежащей иерархической последовательности.Например, теги h1 важны больше, чем теги h2.Программы чтения с экрана используют эти теги заголовков для навигации по содержимому страницы.Если они отсутствуют или неправильно упорядочены, пользователь с ослабленным зрением не сможет перемещаться по содержимому страницы.

3) Не используйте JavaScript для динамического изменения содержимого на экране без предварительного запроса пользователя о том, что текст изменится.Если JavaScript изменяет текст на экране до того, как программа чтения с экрана сможет прочитать содержимое, пользователь с ограниченным зрением никак не сможет узнать, что содержимое было изменено.

4) Не предоставляйте пользователю 1000 изображений.Если изображение не передает релевантный контент, сделайте его фоновым изображением CSS.

5) Будьте любезны с атрибутом title, особенно в тегах привязки.Это может подсказать пользователю, куда он собирается отправиться.

6) Не помещайте текст на изображение, которое не может быть передано в качестве альтернативного контента.Люди с ослабленным зрением не читают изображения.

7) Убедитесь, что все ваши метаданные релевантны.Если вы измените что-либо в своем контенте, обязательно не забудьте дополнительные фрагменты описательных данных.

8) AJAX побеждает доступность.Будьте добры при использовании AJAX.

9) Слабовидящим пользователям, а на самом деле почти всем пользователям-визуалам, все равно, насколько красивы ваши страницы.Они существуют для того, чтобы получать информацию, совершать покупки или с какой-либо другой конкретной целью.Сделайте ваши данные простыми для понимания и быстрого извлечения.Если пользователь не может войти, получить то, что он хотел, а затем выйти в рекордно короткие сроки, он никогда не вернется.

10) Не используйте какие-либо теги презентации или атрибуты презентации в вашем HTML.Используйте таблицу стилей.Если ваш HTML содержит соглашения о представлении, они, вероятно, недоступны.

11) Если ваш контент визуально существует в порядке, отличном от того, как он написан в HTML, сверху вниз, скорее всего, он не доступен.Поддерживайте порядок и последовательность в работе.Пользователи ожидают, что контент будет передаваться сверху вниз, а индексация вкладок будет следовать за потоком контента.

12) Проведите тестирование удобства использования с помощью программы чтения с экрана.Невозможно узнать, насколько доступна страница, просмотрев ее.

Answer 2

Я сам абсолютно слеп, и вы были бы поражены, узнав, как много материалов по-прежнему не имеют атрибутов alt после всех этих лет...Будьте осторожны, все еще существует множество мифов, таких как недопустимая графика (неправильно), тальбы плохие (неправильные) и рамки плохие (неправильные, хотя я понимаю, что рамки плохие по другим причинам). В идеале у вас должен быть кто-то, кто тестирует ваш сайт вслепую, если вам нужна дополнительная помощь в этом, не стесняйтесь, пишите мне по адресу westbchris@gmail.com.Еще одна вещь, попробуйте создать элементы управления, которые на самом деле выполняют функции кнопок и / или ссылок.Интерактивные разделы не очень хороши, потому что не очевидно, что они что-то делают, и в зависимости от того, какую вспомогательную технологию вы используете, вы можете даже не иметь возможности щелкнуть по ним.

Answer 3

Ознакомьтесь с этим объяснением в Alertbox:

Пользователи с ограниченными возможностями и Интернет (Статья датирована 1996 годом ... но проблемы все еще актуальны, если не более актуальны сегодня)

...затем перейдите по ссылке внизу на 148-страничный отчет с рекомендациями по оформлению (документ защищен авторским правом 2001 года, поэтому он, должно быть, обновлялся с момента создания оригинала).

Answer 4

Термин для этого - Доступность.Взгляните на Веб-сайт WAI от W3C.Я всегда находил Сочная Студия быть бесценным ресурсом для статей, обсуждающих доступность.

Answer 5

Существуют подробные определения, которые трудно освоить и внедрить.Примеры включают Рекомендации по обеспечению доступности веб-контента (WCAG) и Раздел 508.

Менее официальное предложение заключается в том, чтобы упростить навигацию по вашему сайту с помощью текстового браузера.Не полагайтесь на цвета или структуру для передачи контента.Не полагайтесь на виджеты для получения важной функциональности.

Редактировать:Подумал, что хотел бы добавить, что вам не следует утруждать себя тестированием своего сайта с помощью JAWS или другого средства чтения с экрана.Ваша неспособность перемещаться по сайту скорее связана с вашей неопытностью в программе чтения с экрана, чем с недоступностью сайта.Тем не менее, наличие выборки вашей целевой аудитории, тестирующей ваш сайт на предмет удобства использования, очень полезно.

ПРАВКА № 2: Как обсуждалось в комментариях, я намеревался донести, что вы не должны выносить суждения об удобстве использования сайта на основе вашего опыта работы с программой чтения с экрана.Тем не менее, я бы порекомендовал всем, кто занимается веб-разработкой, ознакомиться с браузерами / оборудованием, используемым для просмотра веб-сайтов, включая программы чтения с экрана.Это была плохая формулировка в первоначальной правке.

Answer 6

Что ж, похоже, никто не упоминал ВАЙ-АРИЯ который предназначен для доступных расширенных интернет-приложений.То есть делает доступными такие вещи, как gmail.И приличный поисковый запрос для поиска подобных вещей отдельная статья о wai-aria.Уже довольно сильно поддерживается.