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

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

Наряду с фоновым изображением задайте простой цвет фона

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

Задав цвет фона, задайте цвет текста и наоборот
Чтобы читать документ было удобнее, необходимо продумать оптимальное сочетание цвета фона и текста для обеспечения должного уровня контрастности. Если вы зададите, скажем, только цвет фона, есть вероятность того, что он сольется с текстом, отображаемым в соответствии с настройками по умолчанию пользователя. Например, в настройках пользователя значится, что фон должен быть черным, а текст – белым, а вы задаете черный цвет текста. В этом случае текст просто-напросто исчезнет! Если вы хотите дать пользователю возможность самостоятельно определять настройки цвета, не следует задавать никаких цветов вообще, однако не так уж много веб-дизайнеров согласятся на такие условия!

Проверьте контрастность цвета
Убедитесь, что текст выглядит достаточно контрастно на выбранном фоне. Пользователям со слабым зрением будет крайне сложно прочитать текст, если уровень его контрастности по отношению к фону невелик. Кроме того, учтите, что пользователи, страдающие дальтонизмом, могут не различать определенные сочетания цвета фона и текста. По рекомендации консорциума W3C в документации «Критерии доступности веб-контента» (WCAG 2.0 Success Criterion 1.4.3) указано, что конт растность между текстом и изображениями должна поддерживаться в соотношении по меньшей мере 4,5:1. Для оценки уровня контрастности между выбранными вами цветами можно воспользоваться очень удобной программой Luminosity Contrast Ratio Analyser, написанной Джезом Лемоном (Jez Lemon).

Фоновые изображения следует использовать исключительно в декоративных целях
Добавлять фоновые изображения с помощью CSS настолько просто, что можно незаметно для себя приобрести пагубную привычку их повсеместного использования – и там, где надо, и там, где совсем не надо. Однако следует помнить, что пользователи, отключившие просмотр изображений и/или CSS, вообще не узнают о его существовании. В этом нет ничего страшного, если изображение выполняет только декоративную функцию, однако если оно несет информативную нагрузку, лучше сопроводить его описательным атрибутом alt. Тогда пользователи, не имеющие возможности его увидеть, смогут узнать, что оно существует, и прочитать его описание.

Используйте свойство line-height, чтобы текст было легче читать
Благодаря увеличению высоты строки с помощью свойства line-height воспринимать текст будет еще легче, однако избегайте слишком больших отступов межу строками, поскольку это может привести к обратному эффекту. Оптимальное значение данного свойства составляет от 1,2 до 1,6, причем если не указывать единицы, то высота строки будет изменяться пропорционально размеру шрифта.