Создайте сеть, которая расширяет возможности всех

Один миллиард человек во всем мире живут с инвалидностью

В США 26% населения, или каждый четвертый человек, живут с каким-либо видом инвалидности. Очевидно, что не каждая инвалидность напрямую мешает человеку ориентироваться в Интернете, но многие из них делают это.

По данным Всемирного банка:

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

Люди с ограниченными возможностями сталкиваются с огромным количеством препятствий в борьбе за включение. У разработчиков есть уникальная возможность сломать некоторые из этих барьеров и предотвратить создание новых барьеров. Давайте рассмотрим несколько простых способов расставить приоритеты в доступности Интернета в новом году.

Во-первых, познакомьтесь со вспомогательными технологиями

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

Программы чтения с экрана

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

ПО для распознавания речи

Это программное обеспечение позволяет компьютерам обрабатывать голосовые команды человека. Siri от Apple или Alexa от Amazon, вероятно, являются наиболее известными реализациями этого программного обеспечения. Но хотя эти технологии часто считаются излишними, это программное обеспечение является абсолютной необходимостью для многих людей с ограниченными возможностями.

Альтернативные клавиатуры

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

Что могут сделать разработчики?

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

Предоставьте альтернативный текст для изображений

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

Альтернативный текст также должен быть предоставлен, если изображение работает как кнопка или ссылка. Атрибуты alt необходимы в каждом конкретном случае, но в качестве общего теста вы можете спросить себя, была бы моя веб-страница понятна без этого изображения? и идти оттуда. Если изображение чисто декоративное, вы можете предоставить альтернативу пустому тексту, например alt=””.

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

Напишите содержательный HTML

Написание правильного семантического HTML может иметь большое значение для повышения доступности вашего веб-приложения. Обычный старый семантический HTML (POSH) просто предполагает использование каждого элемента HTML в том виде, в каком он был разработан для использования. Для заголовка верхнего уровня следует использовать тег <h1>. <p> должен обозначать наличие абзаца.

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

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

Формы

Аналогичный принцип следует применять к формам. Формы играют важную роль в интерактивности в Интернете. Помимо четкой визуальной маркировки, поля формы и элементы управления должны быть правильно размечены, начиная с элемента <label>.

Доступ к правильно размеченным ярлыкам можно получить с помощью клавиатуры, голосового ввода, программ чтения с экрана и голосового ввода. Пользователям также должны быть предоставлены четкие инструкции для разъяснения использования и заполнения форм.

Правильно структурируйте свой контент

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

Программа чтения с экрана также считывает элементы HTML вслух, когда пользователь работает с контентом, задавая заголовки, абзацы, упорядоченные / неупорядоченные списки и т. Д. Вот пример хорошо структурированного контента из MDN:

<h1>My heading</h1>

<p>This is the first section of my document.</p>

<ol>
  <li>Here is</li>
  <li>a list for</li>
  <li>you to read</li>
</ol>

<h2>My subheading</h2>

<p>This is the first subsection of my document. I'd love people to be able to find this content!</p>

<h2>My 2nd subheading</h2>

<p>This is the second subsection of my content. I think is more interesting than the last one.</p>

Предоставьте аудиозаписи

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

Текстовые расшифровки или скрытые субтитры должны быть:

  • Синхронизировано - текст должен отображаться рядом с сопровождающим звуком.
  • Эквивалентно - подписи и текст должны быть эквивалентны произнесенному слову.
  • Доступный - текст должен быть доступным и доступным для тех, кто в нем нуждается.

Почему вас это должно волновать?

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

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

Я надеюсь, что вы присоединитесь ко мне в определении приоритетов доступности Интернета в этом новом году. Пожалуйста, не стесняйтесь делиться своими собственными предложениями по доступности в комментариях; Я бы хотел их услышать! Доступ в Интернет должен быть правом, а не привилегией. И мы все можем сыграть свою роль в том, чтобы сделать этот доступ реальностью, по одной строчке кода за раз.