Рекомендации по доступности веб-контента и поисковая оптимизация

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

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

Сам ADA не устанавливает каких-либо конкретных критериев доступности Интернета и мобильных устройств. Вместо этого многие веб-разработчики и юристы обращаются к Руководству по обеспечению доступности веб-контента (WCAG), которое сегодня широко используется в качестве эталона цифровой доступности.

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

Какая связь между SEO и доступностью?

 Два белых пузыря на фиолетовом фоне, один с надписью

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

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

Рассмотрим следующий пример: поисковые системы стремятся продвигать страницы с ясным и правильно упорядоченным содержанием. Это означает, что вам нужно следовать рекомендациям WCAG по таким вещам, как заголовки. Если вы не включите ранги заголовков в правильном порядке, например, поместив текст с заголовком четвертого уровня (

) после заголовка второго уровня (

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

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

Это всего лишь пара примеров того, как улучшение доступности веб-сайтов может повысить SEO, но для получения дополнительной информации обязательно посмотрите новую серию «Пятничная доска» Купера Холлмайера о взаимосвязи между доступностью и поисковой оптимизацией.

Действительно, любые вложения, которые вы сделаете в цифровую доступность, также отразятся на вашем поисковом рейтинге. В заявлении о миссии Google говорится, что его цель — «упорядочить мировую информацию и сделать ее общедоступной и полезной». «Универсально доступный» — вот ключевая фраза. Он предполагает, что по мере того, как Google продолжает развивать свою поисковую систему и согласовывать ее с принципами доступного дизайна, веб-сайты с сильными функциями доступности будут подниматься все выше и выше в своем поисковом рейтинге.

Что такое WCAG и как добиться соответствия ?

 Белая коробка на фиолетовом фоне. Внутри коробки находится индикатор выполнения обновления, обозначенный

. WCAG предлагает набор правил для веб-разработчиков, которые хотят создавать доступные веб-сайты. Он был создан Консорциумом Всемирной паутины (W3C), глобальным сообществом общественных и членских организаций, которые стремятся сделать Интернет открытым для всех.

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

Если вы просмотрите недавние судебные иски о доступности цифровых технологий, вы увидите, что версия WCAG 2.0 является наиболее цитируемой версией. Однако следует учитывать, что эта версия уже устарела. WCAG 2.1 теперь доступен и предоставляет дополнительные инструкции по мобильному доступу — и WCAG 2.2 наступает ему на пятки.

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

Должен ли мой веб-сайт соответствовать стандартам WCAG?

Если вы находитесь в США, да, это так. Каждый веб-сайт, который используется гражданином США или принадлежит американской компании, должен по закону соответствовать требованиям ADA. А поскольку WCAG часто называют стандартом цифровой доступности во время судебных разбирательств, следование его указаниям может помочь вашей организации избежать дорогостоящих и разрушительных судебных процессов. Мнение о том, что любая компания освобождена от соблюдения требований ADA, также является мифом.

Как сделать мой веб-сайт совместимым с WCAG?

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

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

1. Воспринимаемый

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

2. Работоспособный

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

3. Понятный

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

4. Надежный

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

Как я могу начать свой путь к соблюдению требований?

 Три белых прямоугольника на фиолетовом фоне с надписью:

На бумаге четыре принципа доступности, изложенные в WCAG, кажутся достаточно простыми. Но как их применить? Чтобы помочь ответить на этот вопрос, WCAG предлагает более подробные рекомендации по каждой из четырех тем и разбивает каждую рекомендацию на набор критериев успеха. WCAG также описывает несколько «достаточных методов», которые предоставляют примеры того, как разработчики могут реализовать их на практике. Думайте об этом как о контрольном списке для соответствия.

Каждый критерий успеха также классифицируется по трем уровням: A, AA и AAA. A обозначает самый базовый уровень доступности, а AAA обозначает наиболее полный. В настоящее время суды интерпретируют средний уровень, AA, как эталон.

Хотя эта статья направлена ​​на то, чтобы дать вам лучшее понимание критериев WCAG, в ней не перечислены все рекомендации в полном объеме. Если вы хотите узнать больше о каждом критерии, ознакомьтесь с кратким справочным руководством «How to Meet WCAG» на веб-сайте W3C. Это предлагает исчерпывающее руководство по каждому аспекту WCAG с предложениями о том, как разработчики могут их удовлетворить.

1. A: Ваш веб-сайт доступен для некоторых пользователей

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

Раздел 1.4.1 Использование цвета является критерием успеха уровня А. Он объясняет, что веб-сайты не должны использовать цвет только как основной способ передачи информации, которая указывает на действие, побуждает к ответу или является отличительным визуальным элементом.

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

2. AA: Ваш веб-сайт доступен почти для всех пользователей

Чтобы соответствовать уровню AA, вы сначала должны соответствовать всем критериям успеха уровня A. Руководства уровня AA, естественно, основываются на критериях уровня A.

В Руководстве 1.4, например, критерий успеха уровня AA 1.4.3 Contrast (Minimum) дополняет руководство 1.4.1 Использование цвета . Он подчеркивает, что текст на любой странице должен иметь коэффициент цветовой контрастности 4,5: 1 или выше. Есть некоторые исключения, если текст большой, или если изображения текста являются полностью декоративными или являются частью бренда или логотипа.

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

Критерии успеха уровня AA также включают 1.4.4 Изменить размер текста который рекомендует пользователям иметь возможность увеличивать текст до 200 процентов от стандартного размера без использования вспомогательных технологий.

3. AAA: Ваш веб-сайт доступен для максимально возможного количества пользователей

Как и в случае с двумя предыдущими уровнями, соответствие уровню AAA требует, прежде всего, соответствия всем критериям успеха уровня A и уровня AA. Чтобы достичь уровня AAA, веб-сайты должны соответствовать еще более подробным стандартам. Например, в Руководстве 1.4 мы находим 1.4.6 Контраст (улучшенный) который поднимает требуемый коэффициент цветового контраста с 4,5: 1 до 7: 1.

Критерий 1.4.8 Визуальная презентация добавляет к 1.4.4 Изменение размера текста требуя, чтобы размер текста можно было изменять до 200 процентов, при этом пользователь все еще может читать каждую полную строку текста без необходимости прокручивать окно браузера по горизонтали. Этот критерий также содержит дополнительные предложения, такие как разрешение пользователям самостоятельно выбирать цвета переднего плана и фона, а также определение настроек для межстрочного интервала и выравнивания, которые упрощают чтение текста для людей с нарушениями зрения или когнитивных функций, такими как дислексия.

Начать улучшение доступность вашего веб-сайта

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

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

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

Комментарии запрещены.