Самое важное, что нужно помнить, это то, что небольшие изменения имеют большое значение, и устойчивый прогресс гораздо важнее, чем совершенство.
Это легко начать, но вот несколько общих ошибок, на которые можно обратить внимание.
Распространенные ошибки, чтобы избежать
Давайте посмотрим на некоторые распространенные ловушки, чтобы не допустить, чтобы ваш сайт был более доступным, чтобы вы могли сохранять гибкие, простые и удобные для всех!
Неряшливый
Метки должны быть ясны и связаны с правильными полями. Смутные формы могут привести к плохому пользовательскому опыту, поэтому убедитесь, что они могут быть заполнены как можно более просто. Немного ясности проходит долгий путь.
Пропустить мобильную доступность
Мобильный дизайн — это не только установка всего на меньшем экране. Проверьте такие вещи, как размер кнопки и читаемость текста, чтобы гарантировать доступность на всех устройствах. Ваши мобильные пользователи будут вам благодарны.
Несовместимая навигация по клавиатуре
Пользователи должны иметь возможность перемещаться по вашему сайту без проблем с вкладкой. Если некоторые части работают, а другие нет, это может быть очень расстраивает для пользователей. Последовательность является ключом.
Забывая четкие индикаторы фокуса
Индикаторы фокусировки необходимы при навигации с клавиатурой. Без них это похоже на то, как вы пытаетесь найти вас в темноте. Убедитесь, что они видны и легко следуют, чтобы пользователи всегда знали, где они находятся.
Полагаться только на цвет
Если вы используете только цвет, чтобы сигнализировать о таких вещах, как ошибки (красный) или успех (зеленый), помните, что не все видят окраски одинаково. Для пользователей Color -Blind добавьте дополнительный контекст со значками или текстом, чтобы ваше сообщение было громким и ясным.
Пропустить альтернативы для видео и аудио
Если у вас есть видео или аудиоконтент, не забывайте тех, кто не слышит или не видит его. Всегда записывайте подписи или стенограммы. Это не только делает ваш контент более доступным, но также увеличивает ваш SEO — победа повсюду!
Разрушить структуру головы
Муфты помогают пользователям и поисковым системам через ваш контент. Если ваши H1S, H2S и H3S не в порядке, это так, как будто вы даете кому -то карту без инструкций. Чистая структура головы — это простой способ направить всех, куда они должны идти.
Html -example для голов:
What is accessibility?
Accessibility for different disabilities
Расплывчатые или трудно найти сообщения об ошибках
Мы все были там — вы бросили заглушку и получили смутное сообщение «что -то не так». Супер разочаровывает, верно? Убедитесь, что ваши сообщения об ошибках являются конкретными, полезными и простыми в поиске. Предоставляя четкое руководство, пользователи могут быстро вернуться на правильный путь.
Не тестирование на доступность
Легко предположить, что все в порядке, но тестирование является обязательным! Убедитесь, что вы регулярно проверяете свой сайт с помощью считывателей экрана, навигации по клавиатуре и другими технологиями поддержки, чтобы получить проблемы. Только потому, что что -то выглядит хорошо, не означает, что оно полностью доступно — поэтому потратьте время, чтобы проверить, тестировать и тестировать снова.
Вы не уверены, какие инструменты вам нужно использовать для тестирования вашего сайта? Не волнуйся, ты у меня есть!
Лучшие средства, чтобы привлечь вас к вашему пути
Когда вы будете готовы погрузиться в тестирование доступности вашего сайта, существует множество инструментов, которые позволяют легко получить вещи на правильном пути. Вот некоторые из лучших вариантов, чтобы помочь вам:
Webaim: Webaim полно инструментов доступности и руководящих принципов, которые позволят вам. Их инструмент оценки доступности волн отлично подходит для оценки отдельных страниц и обнаружения проблем с доступностью.
ГОЛЬФ: Этот пользовательский инструмент доступен и как расширение браузера, так и инструмент на основе веб -сайтов. Это позволяет вам видеть проблемы с доступностью на вашей странице, от отсутствующего текста Alt до низкого контраста и сложных конструкций головы. Это идеально подходит для быстрой проверки.
Топор: Разработчики любят Bijl! Это удобное расширение браузера, которое поможет вам выкопать код вашего сайта, чтобы найти такие проблемы, как отсутствующие атрибуты ARIA или неправильные головы. Он легко интегрируется в ваш процесс разработки.
Маяк: Если вы ищете полный сайт -Audit, Lighthouse встроен в Chrome Devtools и дает вам тщательный обзор доступности, а также производительность и SEO Insights. Это универсальный магазин для полезных улучшений.
