Пишем доступный контент

Мы всегда стараемся делать контент удобным и доступным максимально широкой аудитории. (Словосочетание accessible content — доступный контент — в английском языке имеет значение “контент, доступный людям с ограниченными возможностями” — прим. перев.)

Написание доступного контента — это не просто представление всех элементов страницы в форме текста. Доступность зависит от того, как организован контент на странице и какой путь изучения информации мы продумали для читателя. Существуют разные законы и требования по доступности контента — это зависит от вашей аудитории и страны. Но наличие доступной версии сайта — это необходимый минимум. Доступность предполагает, что сайтом может пользоваться человек в любом психическом и физическом состоянии: будь то временное (сломанные очки!) или постоянное ограничение возможностей.

Азы

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

При написании текстов, обратите внимание на следующие моменты:

• Понятен ли ваш язык тем, кто не работает в компании?
• Есть ли возможность быстро просканировать текст и понять суть?
• Если человек не может различать цвета или видеть картинки/видео, поймет ли он вашу идею?
• Документ чисто оформлен и структурирован?
• Мобильные устройства с настройками универсального доступа становятся основным элементом коммуникации для людей с ограниченными возможностями. Насколько хорошо работает ваш контент на этих устройствах?

Многие рекомендации по написанию доступного контента перекликаются с советами по написанию технического контента, но определенную сложность создают требования к разметке, синтаксису и структуре.

Рекомендации

Не указывайте направление:

Постарайтесь избегать формулировок, которые подразумевают, что пользователь видит интерфейс и компоновку. Есть множество причин не указывать направление: в том числе смену компоновки на мобильных устройствах.

• Да: “Выберите одну из этих опций:” (после заголовка перечисляются опции)
• Нет: “Выберите одну из опций меню справа”.

Пользуйтесь заголовками

В заголовках должна быть вложенность и последовательность. Никогда не пропускайте заголовок следующего уровня из соображений дизайна и стиля. Чтобы секции были правильно сгруппированы, главный заголовок должен быть H1, заголовки разделов — H2, структурные блоки внутри разделов — H3 и так далее. Постарайтесь не закладывать слишком много уровней заголовков.

Проработайте иерархию

Разместите самую важную информацию вначале. Расположите похожие темы в пределах одного параграфа и разделите их заголовками.

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

Оформляйте списки технически правильно — не стоит создавать список путем простых переносов.

Используйте подписи в формах

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

Сделайте гиперссылки описательными

Ссылка должна нести в себе информацию о связанном с ней действии или ресурсе. Избегайте ссылок вроде “нажмите сюда” или “узнать больше”.

Говорите на общедоступном языке

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

Используйте alt text

Тег alt — это базовый способ описания картинки, и его нужно включать во все изображения. Язык описания будет зависеть от назначения картинки:

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

Каждый браузер по-разному обрабатывает alt теги. Лучше все-таки добавить к каждой картинке небольшую подпись.

Убедитесь, что доступны субтитры

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

Продумайте визуальные элементы

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

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

Ресурсы

• Accessibility evaluation for web writers (Оценка доступности для писателей в веб)
• Accessibility cheatsheet (Шпаргалка по доступности)
• 18F Accessibility Guide (Руководство по доступности от агентства 18F)
• Designing for Screen Reader Compatibility (Проектируем сайты, совместимые с устройствами чтения с экрана)
• Accessible color combinations (Комбинации цветов, обеспечивающие доступность)
• WAVE Web Accessibility Evaluation Tool (Инструмент оценки достуности в веб от WAVE)

Читать далее: Пишем для перевода на другие языки >>