Начните с веб-доступности

Автор: Peter Berry
Дата создания: 18 Июль 2021
Дата обновления: 11 Май 2024
Anonim
Как сделать веб приложение? Создание веб игры на Unity за 25 минут!
Видео: Как сделать веб приложение? Создание веб игры на Unity за 25 минут!

Содержание

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

  • 10 шагов к увлекательному пользовательскому опыту

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

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

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

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


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

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

Визуальная доступность: упростите просмотр

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

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


Например, используйте ul> для неупорядоченного списка. Это не только облегчит посетителю понимание того, чем этот фрагмент контента отличается от обычного текста, но также позволит браузеру предоставлять дополнительные подсказки и поведение.

Когда мы используем ul> чтобы описать список, и li> для каждого элемента списка браузер может проинформировать пользователя о том, что есть список, сколько элементов в нем, и позволить пользователю легко переходить между элементами.

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

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


Доступность для слуха: сделайте так, чтобы вас было легко слышать

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

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

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

Доступность двигателя: упростите взаимодействие с

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

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

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

Дизайн для посетителей, склонных к припадкам и чувствительных к движению

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

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

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

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

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

Для начала вот несколько ресурсов по специальным возможностям:

  • Книга Лауры Калбаг "Доступность для всех"
  • Книга `` Шаблоны инклюзивного дизайна '' Хейдона Пикеринга
  • Книга Сары Хортон и Уитни Кузенбери "Сеть для всех"
  • Электронная книга "Рабочие процессы доступности цвета" от Джери Коади
  • Блог Tink от Леони Уотсон
  • Группа Paciello
  • Статьи Axess Lab
  • Руководства по специальным возможностям проекта A11y
  • Блог и подкаст Web Axe
  • Сайт доступности HTML5 - проверяет, какие новые функции HTML5 доступны в основных браузерах.
  • Рекомендации W3C по обеспечению доступности веб-контента
Рекомендуем
Photoshop, чтобы получить социальные функции
Читать далее

Photoshop, чтобы получить социальные функции

Мир дизайна был потрясен в декабре прошлого года, когда Adobe объявила о покупке Behance, услуги портфолио для дизайнеров. Одним из главных преимуществ Behance для софтверного гиганта было сильное соо...
Почему иллюстраторы должны заботиться об авторском праве
Читать далее

Почему иллюстраторы должны заботиться об авторском праве

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

Что работодатели хотят видеть в вашем портфолио

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