Внедрение статьи Wulin.com (www.vevb.com): 10 советов по использованию для веб -сайтов, которые каждый может использовать.
1. Добавьте альтернативный текст в свой логотип
Это имеет два преимущества: считыватель экрана может распознавать значение изображения логотипа, и когда изображение не загружено, он также может сообщить пользователям, не связанным с ослабленными нарушениями, где находится ваш логотип.
Несколько методов:
<img src = logo.png alt = веб -сайт обучения>
Или, если вы используете фоновое изображение для реализации логотипа, вы также можете добавить атрибут заголовка, чтобы реализовать его:
<span title = веб -сайт обучения веб -страницы> </span>
Конечно, ссылка + фоновое изображение - лучший способ, но лучше всего добавить атрибут заголовка:
<a title = веб -преподавательская сеть> сеть веб -преподавания </a>
2. Добавьте основные достопримечательности
ARIA Landmark - это набор правил использования веб -сайта, определяемых W3C. Добавление описательной ориентиры в различные модули веб -сайта - или непосредственно называемая роль, способствует программному обеспечению для чтения экрана, чтобы лучше понять ваши веб -страницы, чтобы пользователи с нарушениями зрения могли лучше использовать ваш сайт.
<nav olue = navigation>
<div id = maincontent olue = main>
<form action = search.php rol = search>
3. Повышение определения фокуса
На самом деле, многие веб -сайты будут пробовать все средства для удаления стиля фокуса браузера, особенно для браузера IE. На самом деле, имеет смысл иметь браузер с фокусом по умолчанию. Это может указать, где сосредоточена на мышевой фокусировке пользователя. Это особенно важно для потоковой передачи клавиатуры.
Поэтому, пожалуйста, не удаляйте: стиль фокуса. Даже если вы думаете, что стиль по умолчанию не очень красивый или бессодержащий (т.е. пунктирная коробка, Webkit-выделенная сплошная коробка, а сафари синий, хром-оранжевый), вы также можете определить цвет выделения самостоятельно:
A: Focus {
Схема: 1px твердый красный;
Фон: желтый;
}
Если ваш менеджер продукта или визуальный дизайнер настаивает на удалении состояния фокуса, просто заберите мышь на один день и скажите ему, что вы можете использовать только вкладку для переключения ссылок. Полем Полем
4. Определите необходимые элементы формы
Используйте атрибут, требуемый ARIA, чтобы определить требуемые элементы в форме - ну, в основном это сообщить программному обеспечению для чтения экрана:
<input type = text name = имя пользователя aria-required = true>
5. Добавьте H1 на вашу страницу
Причина проста, не только для SEO, но и для общего удобства использования и читаемости веб -сайта. Кроме того, у вас нет кодовой одержимости?
6. Определите заголовок таблицы
Обычно многие люди привыкли использовать теги TD для всех форм. На самом деле, таблицы имеют не только HD -теги, но и Th, Col, Scope и т. Д.
Так что просто поместите, измените заголовок на TH -тег:
<th Scope = col> дата </th>
7. Определите описание таблицы
Не просто добавляйте P перед/после стола. Таблица имеет выделенную метку подписи, как и картинка.
<Таблица>
<Подпись> Расписание классов </Подпись>
<tr>
...
8. Избегайте нажатия здесь
Хотя такое описание ссылки не имеет значения для обычных людей, это довольно плохо для программного обеспечения для чтения экрана. На самом деле это вмешательство в визуально -нарушенные пользователей.
Итак, просто используйте ссылку в нужном месте.
9. Удалите TabIndex
Однажды многие люди использовали табиндекс для улучшения пользовательского опыта, но этот атрибут нарушит обычный порядок чтения страницы, который катастрофист для пользователей с нарушениями зрения и может не быть дружелюбным для обычных пользователей.
Так что не злоупотребляйте атрибутом TabIndex.
10. Проверьте это онлайн
Что ж, когда я увидел это, я обнаружил, что это на самом деле реклама, но если проблема использования веб -сайта может быть обнаружена, это также хорошо. Веб -инструмент, разработанный Webaim, автоматически обнаружит его, введя URL. Протестировал это довольно хорошо.