Последние учебники веб-разработки
 

веб-WAI


WAI определяет руководящие принципы для веб-разработчиков.


WAI - Инициатива Web Accessibility

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

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

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

Причины сделать свой сайт более доступным:

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

Помните, "Alt"

Атрибут Alt позволяет обеспечить альтернативный текст для изображения:

<img src="images/banana.jpg" alt="Banana">

Иногда веб-браузер не будет отображать изображения. Причиной этого может быть одним из многих:

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

Если вы используете атрибут "Alt", большинство браузеров, по крайней мере дисплей (или прочитать) на "Alt" текст.


Не используйте Мелкий шрифт

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

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

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

Выберите наиболее подходящий для Letter и интервалы между строками

Текст с дополнительным расстояние между буквами легко читать.

Текст с уменьшенным расстоянием между буквой трудно читать.

Текст с хорошим
межстрочный интервал
легко читается.

Текст с уменьшенным
межстрочный интервал
трудно читать.


Избегайте Необычные шрифты

Нормальные шрифты легко читаются.

Italic шрифты не так легко читать.

Serif шрифты более трудно читать.


Избегайте бедных цветовым контрастом

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

Серый текст на светлом фоне может дать плохой контраст:

Цвет текста #AAAAAA на белом фоне
Цвет текста # 666666 на белом фоне
Цвет текста # 333333 на белом фоне
Цвет текста # 000000 на белом фоне

Серый текст на темном фоне также может дать плохой контраст:

Цвет текста # 666666 на черном фоне
Цвет текста #AAAAAA на черном фоне
Цвет текста #CCCCCC на черном фоне
Цвет текста #FFFFFF на черном фоне

Некоторые комбинации - как черный и красный, черный и синий, желтый и зеленый - всегда напрягает глаз:

Черный текст на красном фоне
Черный текст на синем фоне
Желтый текст на зеленом фоне

И некоторые комбинации не так уж плохо:

Черный текст на сером фоне
Черный текст на светло-голубой
Черный текст на старинный белый
Белый текст на темно-синий

Всегда устанавливайте цвет фона

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

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

Если вы определяете цвета для ваших веб-элементов (например, заголовок и ссылки), вы должны также определить цвет фона.

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