Спокойные объяснения о том, как устроены интерфейсы и почему доступность начинается с разметки, а не с плагина. Разбираем критерии выбора решений, подготовку к проверке и типичные ошибки.
Читать руководстваЧетыре этапа, через которые проходит почти любой интерфейс: от первичного выбора решений до отработанной практики. Материалы сайта собраны в той же логике.
Определяем, какие компоненты пишутся вручную, а какие берутся из библиотеки, и по каким критериям оценивать готовое решение: наличие семантики, поддержка клавиатуры, управляемость состояний.
Приводим разметку в порядок до того, как появятся стили: структура заголовков, ориентиры страницы, подписи полей, порядок фокуса и текстовые альтернативы для графики.
Разбираем повторяющиеся промахи: div вместо кнопки, скрытие через display без учёта фокуса, избыточные ARIA-атрибуты, недостаточный контраст и «ловушки» модальных окон.
Закрепляем привычки: проверка страницы только клавиатурой, чтение вслух скринридером, ручной аудит по критериям и включение проверок в обычный процесс разработки.
Если вы планируете купить дом недорого в Подмосковье, объявления и сами объекты лучше сравнивать по заранее заданным критериям, а не ориентироваться только на первое впечатление. Поэтому доступность проверяют по маршруту пользователя…
Сайт должен позволять выполнить с клавиатуры те же основные действия, что и мышью: перейти по меню, заполнить форму, открыть диалог и закрыть его. Главный критерий — не формальное наличие фокуса, а предсказуемый маршрут без ловушек…
Для работы с сайтом без мыши обычно достаточно клавиш Tab, Shift+Tab, Enter, пробела, стрелок и Escape. Главный ориентир — видимый фокус: рамка или подсветка показывает активную ссылку, кнопку либо поле. Если фокус исчезает, перескакивает…
Проверять контрастность нужно не по общему впечатлению, а для каждой значимой пары цветов: текста и фона, элемента управления и окружения, активного и обычного состояния. Главный критерий — информация остаётся различимой при разных…
Ориентиры, вокруг которых строятся материалы сайта: базовые требования и объём разбираемых тем.
Основные направления, о которых пишем: от разметки и стилей до проверки готового интерфейса.
Теги, ориентиры, структура заголовков и почему они важнее классов.
Порядок обхода, видимое кольцо фокуса, ловушки в модальных окнах.
Как считать соотношение яркости и не строить смысл на одном цвете.
Связка label и поля, сообщения об ошибках, подсказки и валидация.
Что озвучивается на самом деле и как проверить страницу на слух.
Ручной аудит, автоматические инструменты и порядок их применения.