Все, что вам нужно знать о специальных возможностях, можно найти в статье Веб-доступность - все, что вам нужно знать о Programming Duck.
Отказ от ответственности: я не юрист. Эта статья отражает только мое личное мнение и текущее понимание. Это не юридическая консультация. Проконсультируйтесь с юристом для получения информации о юридических аспектах доступности.
Итак, вы решили изучить специальные возможности в Интернете? Эта статья покажет вам, как научиться этому от новичка до продвинутого.
Предварительные требования - семантический HTML
Самое важное, что вы можете сделать для веб-доступности, - это использовать семантический HTML. Элементы HTML уже имеют встроенную семантику доступности. Пока вы используете правильные элементы и атрибуты, вы уже делаете 80% того, что вам нужно для обеспечения доступности.
Если вы работаете над внешним интерфейсом, вы уже должны знать, как это сделать. Однако всегда полезно освежить свои знания.
Если вам нужно что-то напомнить, прочтите Справочник по HTML-элементам на MDN. Это страница, которую можно отсканировать за несколько минут или полностью прочитать примерно за 20 минут. В нем перечислены все элементы HTML и их назначение.
Если вам нужна дополнительная информация о конкретном элементе, вы можете посетить справочную страницу для этого элемента. Например, вот справочная страница MDN для элемента <body>.
В противном случае, если вы начинающий разработчик и еще не знаете семантического HTML, я рекомендую вместо этого начать с некоторых ресурсов для начинающих веб-разработки. После этого вы можете продолжить изучение специальных возможностей.
Тестирование и практика
При изучении чего-либо важна практика.
Что касается доступности, вы практикуете использование веб-сайта, как человек с ограниченными возможностями. Например:
- Использование только клавиатуры для навигации
- Использование только программы чтения с экрана для просмотра содержимого веб-страницы (без использования зрения)
- Использование инструментов моделирования дефицита зрения на вашем веб-сайте
Невозможно превзойти личный опыт, так что делать эти вещи действительно полезно. Необязательно делать их все каждый раз, но чем больше вы практикуетесь, тем лучше.
Кроме того, как и в любом другом деле, вам нужно проверить свою работу. Это те вещи, которые вы будете тестировать, когда будете профессионально заниматься специальными возможностями. Поэтому хорошо к этому привыкнуть пораньше.
Если вы не знаете, как это сделать, вам помогут следующие учебные ресурсы.
Ресурсы для изучения веб-доступности
После семантического HTML, что очень важно, вам нужно действительно узнать о доступности. Для этого есть много хороших ресурсов. Вот некоторые из них, которые я лично пробовал и рекомендую.
Вводные видеокурсы
Я лично посмотрел два вводных видеокурса, которые очень рекомендую:
Я полагаю, что в дополнение к этим курсам существует много других неплохих курсов по обеспечению доступности. Если вы найдете другой курс, который хотите посмотреть, то обязательно сделайте это.
Это вводные курсы. Однако они охватывают многое. Я подозреваю, что если вы просто посмотрите эти два курса, вы узнаете о доступности больше, чем большинство разработчиков интерфейсов. Тогда, пока вы в процессе работы будете обращаться к нескольким важным ресурсам, вы, вероятно, сможете выполнить большую часть, если не всю, необходимую работу по обеспечению доступности.
Однако, если вы остановитесь на этом, вы не получите такого глубокого понимания доступности, как если бы вы изучали некоторые из более подробных источников.
Если вы хотите посмотреть только одно из них, я бы посоветовал Доступность сайта от Джона Купермана. Это оба отличные курсы, но этот курс охватывает основы немного шире. Другой - немного более продвинутый и больше подходит для приложений JavaScript.
MDN и web.dev
Вот Страница MDN о доступности.
Вот страница web.dev о доступности.
Эти веб-сайты являются основным продуктом для разработчиков внешнего интерфейса.
В частности, MDN очень тщательно предоставляет информацию о доступности. Если вы, как фронтенд-разработчик, хотите достаточно хорошо изучить специальные возможности, я настоятельно рекомендую прочитать ресурсы MDN. Они охватывают:
- Семантический HTML
- Различные виды инвалидности и вспомогательные технологии
- Создание собственных виджетов
- WAI-ARIA
- И более
Информация о web.dev тоже отличная, но менее полная. Я считаю это вводным уровнем, но, возможно, чуть более основательным, чем упомянутые ранее видеокурсы.
Статьи о WebAIM
Статьи WebAIM даже более подробны, чем MDN.
Они отлично подходят для:
- Понимание мотивации доступности.
- Понимание различных видов инвалидности и того, как люди с такими ограниченными возможностями используют веб-сайты.
- Доступность обучения очень тщательно.
- Предоставление рекомендаций по конкретным темам, касающимся доступности. Например, у них есть подробная статья конкретно об альтернативном тексте для изображений. Я не видел ничего подобного в другом месте.
Единственный потенциальный недостаток - в статьях о WebAIM не так много примеров кода. Если вы предпочитаете примеры кода, вам больше подойдет MDN. Однако, если вы хорошо разбираетесь в HTML и JavaScript, возможно, вы сможете реализовать изученные концепции без примеров кода. В этом случае статьи WebAIM должны быть в порядке.
Альтернативные учебные ресурсы
Некоторые люди предпочитают учиться по книгам. Если это вы, то можете использовать книгу. К сожалению, я не могу порекомендовать ни одного, так как я не читал ни одной книги по этой теме. Если кто-то из комментариев хотел бы предложить какие-либо предложения, сделайте это.
Кроме того, не стесняйтесь использовать любой другой хороший ресурс, не упомянутый здесь.
Дополнительное рекомендованное обучение
Есть некоторые дополнительные вещи, которые нужно изучить, которые могут быть недостаточно освещены в других ресурсах.
Заявления о доступности
В некоторых странах (например, в Великобритании) требуются заявления о доступности. Даже если они этого не делают, WCAG упоминает, что есть много веских причин для его наличия.
Пожалуйста, посетите страницу WCAG с заявлениями о доступности, чтобы узнать о них.
WAI-ARIA
Еще одна вещь, которую следует выучить как следует, - это WAI-ARIA.
WAI-ARIA имеет много документов. Тот, который вам нужен, - это Документ по авторским методикам WAI-ARIA. В нем приведены объяснения и рекомендации по правильному применению ARIA. Кроме того, он предназначен для разработчиков, поэтому читать его не так уж сложно.
Кроме того, вы можете в первую очередь использовать его как справочник. Это означает, что вам не нужно читать его от начала до конца. Вы можете просто прочитать некоторые из них, чтобы знать, что в них содержится. Затем вы можете обратиться к нему, если в вашей работе появится что-то актуальное.
В целом, вероятно, достаточно:
- Прочтите вводный раздел.
- Прочтите о некоторых шаблонах проектирования и виджетах. Подойдут всего несколько. Это даст вам представление о том, что вы должны будете делать, если в будущем будете создавать собственные виджеты.
- Просмотрите остальные.
Затем при необходимости обратитесь к нему в будущем.
Дальнейшее обучение
Если вам нужно еще больше знаний, вот несколько вещей, которые вы можете сделать.
Следите за специалистами по доступности в Интернете
Эксперты по доступности Интернета проводят новейшие исследования и постоянно улучшают область доступности Интернета.
Следуя за ними (подписавшись на них в Твиттере, читая их блоги и т. Д.), Вы сможете узнать от них то, чего еще нет в официальной спецификации.
Кроме того, они могут рекомендовать полезные методы, которые никогда не будут включены в спецификацию.
Посмотрите документы WCAG
Документы WCAG включают официальную спецификацию, большой список методов обеспечения доступности и документ Общие сведения о WCAG.
Найдите дополнительную информацию по конкретным темам
Если вас интересует конкретная тема, самый быстрый способ узнать о ней больше, вероятно, - выполнить поиск по этой теме с помощью поисковой системы.
План обучения
Это много ресурсов. Что вам на самом деле следует делать и из каких ресурсов следует учиться? Это зависит от того, сколько вы хотите узнать, сколько у вас есть времени и от вашего предпочтительного способа обучения.
Если вам нужно хорошее введение в тему, я рекомендую посмотреть один (или оба) видеокурса. На этом можно остановиться. К этому моменту вы будете знать о специальных возможностях гораздо больше, чем большинство разработчиков. Этот шаг также можно пропустить, если вас не интересуют вводные курсы.
Если вы хотите узнать о доступности еще лучше, просмотрите ресурсы MDN. Они очень тщательные. Опять же, вы можете пропустить этот шаг, если не хотите этого делать.
Если вам нужно что-то еще более подробное, прочтите все статьи о WebAIM.
Лично я изучил все эти ресурсы в указанном порядке и нашел их очень полезными. Однако в вашем случае вы можете выбрать те, которые вам нравятся.
Кроме того, можно просмотреть некоторые ресурсы, прекратить и возобновить обучение в будущем.
Как вариант, вы можете использовать совершенно другой план и другие ресурсы. Это все зависит от вас.
Наконец, потратьте некоторое время на то, чтобы узнать о заявлениях о доступности и конкретно о WAI-ARIA.
Заключительные примечания
Это все для этой статьи.
Если у вас есть отзывы или даже контраргументы, дайте мне знать в комментариях.
Далее, если вы хотите узнать больше о специальных возможностях, а также о том, как их применять во время работы, см. Статью Веб-доступность - все, что вам нужно знать.
Первоначально опубликовано на https://programmingduck.com 6 декабря 2020 г.
