Каковы лучшие практики для обеспечения доступности веб-сайтов?

Question

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

Answer 1

Существует множество ресурсов в зависимости от ваших целей.

Настоятельно рекомендуем начать с:

• Раздел 508 (законодательство США, хотя, очевидно, ориентировано на США)

• Инициатива W3C по обеспечению доступности веб-сайтов и Рекомендации по обеспечению доступности веб-контента

редактировать:

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

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

Удачи!

Answer 2

Вот краткий список, за которым я склонен следовать

• Убедитесь, что он использует чистую разметку XHTML в идеале в соответствии со стандартами AAA,
• Попробуйте по возможности разлить HTML, CSS, Javascript в соответствующие файлы,
• Создание различных таблиц стилей для печати, экрана и т. Д.,
• Убедитесь, что вы учитываете цвета и шрифты для слабовидящих и дальтоников,
• Старайтесь размещать основную навигацию только в верхней части кода, чтобы фактический контент отображался в верхней части кода, чтобы людям не приходилось прокручивать страницу далеко, чтобы увидеть контент, особенно если они используют экран читатель / низкое разрешение,
• Если у вас много навигации до контента, поместите ссылку вверху, позволяющую пользователям переходить к контенту,
• Убедитесь, что самая первая ссылка на странице относится к текстовой версии сайта с низким содержанием графики,
• Убедитесь, что ВСЕ страницы и все основные функции будут работать без включенного JavaScript,
• Существует множество плагинов для Firefox, которые могут помочь в разработке, включая:
  • Веб-разработчик
  • Без сценария
  • HTML-валидатор
  • Firebug
• Убедитесь, что страница отображается во всех браузерах, включая старые, даже если это означает, что она работает, хотя и не точно соответствует дизайну.
• Убедитесь, что HTML, CSS, JavaScript поддерживаются на минимальном размере файла, чтобы ускорить загрузку, например. Удалить пробелы и пустые строки,
• Всегда используйте ЭТИКЕТКИ в формах и alt, теги заголовков в ссылках и изображениях,
• Используйте таблицы только для табличных данных и убедитесь, что данные помечены соответствующим образом,
• Где возможно, не используйте JavaScript для записи содержимого на страницу, но используйте CSS, чтобы скрыть его, то есть JavaScript отключен или не работает должным образом, тогда контент все равно будет отображаться,
• Всегда гарантируйте, что вы используете onkeypress, а также события onclick в JavaScript, если пользователь не может / не использует мышь.

Наконец, если вам нужно использовать пустые изображения на странице для отслеживания и т. Д., Не давайте им Alt-теги. Это мой собственный взгляд, и он горячо обсуждается в Интернете, особенно когда для разнесения использовались изображения размером 1x1px. Однако, насколько я понимаю, если вы используете программу чтения с экрана, то вы не читаете глупые комментарии к изображениям, которые ей не нужны.

Answer 3

Попробуйте посмотреть статью в Википедии о Web Accessibility . Он содержит множество ссылок на различные источники информации для разных стран, что может быть полезно в зависимости от вашей целевой аудитории. W3C был одним из оригинальных стандартов, но его критиков много.

Answer 4

С другой стороны, см. Веб-руководство правительства Нидерландов .

Answer 5

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

Answer 6

Помимо всего прочего .. укажите атрибуты "alt" и "title" для каждого тега "img".

Answer 7

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

Но альтернативный подход - думать о вашей HTML-странице в общих терминах, а не о визуальном выводе, который вы видите в веб-браузере. Если бы вы написали часть программного обеспечения, которая интерпретировала сайт, что было бы полезно? Это обходной способ сказать, использовать хорошую семантику. Мои главные советы - использовать стандартный XHTML для контента и CSS для дизайна. Также ищите такие темы, как «прогрессивное улучшение» и «поведенческий Javascript».

Но для ресурсов:

• Инициатива W3C по обеспечению доступности веб-сайтов: www.w3.org/wai
• www.WebAIM.org
• www.Accessify.com
• www.CSSZenGarden.com для вдохновения о том, как семантическая разметка может выглядеть очень по-разному.

Answer 8

Несколько вещей, которые нужно иметь в виду:

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

• Визуально попытайтесь получить соответствующую презентацию, которую легко читать в обратном направлении S ... слева направо, вниз ... и т. Д.

• обеспечение того, чтобы все alt-теги и т. Д., Как указано в других ответах, имели жизненно важное значение.

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

• убедитесь, что все легко читать и находить. одно это сделает работу намного проще.

Answer 9

На сайте W3C найден хороший ресурс: Правила доступности веб-контента .

Answer 10

Правительство предоставляет стандарт под названием section 508 , в котором излагается, что делает сайт совместимым.