Тестирование веб-сайта на доступность может оказаться трудоемким и трудоемким процессом. Тем не менее, бесплатная панель инструментов веб-доступности может выполнить большую часть тяжелой работы за вас и является незаменимым инструментом для всех, кто интересуется доступностью.
Панель инструментов не является инструментом автоматического тестирования, поэтому требует от вас ручной работы. Таким образом, можно избежать многих проблем, связанных с автоматическими инструментами тестирования доступности. Это не требует каких-либо технических знаний, поэтому даже самый большой технофоб может проверить доступность своего веб-сайта!
Установка панели инструментов веб-доступности
Вы можете бесплатно загрузить панель инструментов с http://www.nils.org.au/ais/web/resources/toolbar, и после установки она появится в области панели инструментов Internet Explorer. Общий размер файла составляет всего 550 КБ, поэтому загрузка не займет много времени.
Панель инструментов работает только в Internet Explorer в Windows, поэтому, если Internet Explorer не является вашим основным браузером, вам придется переключать браузеры при его использовании. (В качестве альтернативы вы можете загрузить панель инструментов веб-разработчика для Firefox, которая предлагает аналогичные, но не идентичные функции.)
Использование панели инструментов веб-доступности
Теперь вы загрузили и установили панель инструментов веб-доступности, и вы можете начать ее использовать! Всего на панели инструментов 12 кнопок, каждая со стрелкой вниз справа от текста. Если вы нажмете стрелку вниз для любой из этих кнопок, появится раскрывающееся меню со всеми доступными опциями (в качестве альтернативы вы можете использовать сочетания клавиш, назначенные для каждой кнопки).
Проверка структуры документа
Одна из самых полезных кнопок — седьмая, «Структура». Очень важно, чтобы структура HTML-кода точно отражала визуальную структуру страницы. Это сделано для того, чтобы пользователи с нарушениями зрения, использующие программы чтения с экрана, могли понять структуру страницы.
Некоторые из наиболее полезных элементов в раскрывающемся меню «Структура» включают в себя:
Заголовки. Показывает, какие элементы на странице помечены как заголовки в HTML-коде. Заголовок главной страницы должен быть заголовком первого уровня, а остальные заголовки — заголовком второго уровня. Любой подзаголовок заголовка второго уровня должен быть заголовком третьего уровня, затем заголовком четвертого уровня и так далее. Номера заголовков всегда должны быть последовательными — заголовок четвертого уровня не должен следовать за заголовком второго уровня, если нет заголовка третьего уровня. Заголовки особенно полезны для пользователей программ чтения с экрана, поскольку они могут вызвать список заголовков и сразу перейти к разделу, который их больше всего интересует.
Элементы списка. Показывает, какие элементы на странице помечены как списки в HTML-коде, отображая < li > рядом с любым элементом списка. Списки могут быть горизонтальными или вертикальными, и вся навигация должна быть помечена как элемент списка. Списки очень полезны для пользователей программ чтения с экрана, поскольку программа чтения с экрана объявляет количество элементов в списке перед чтением элементов списка.
Набор полей/метка — показывает, какие элементы на странице называются метками в HTML-коде. После выбора набора полей/метки текст рядом с каждой формой должен содержать слово «метка» рядом с ней — в противном случае этот текст не называется меткой в коде.
Граница таблицы — размещает рамку вокруг каждой таблицы. Вложенные таблицы внутри таблиц могут вызвать огромные трудности у пользователей программ чтения с экрана. После выбора этого пункта первая таблица будет иметь черную рамку, вторая – синюю, затем зеленую, желтую, оранжевую, красную и фиолетовую. Если вы видите какой-либо из этих последних четырех цветов, пришло время внимательно взглянуть на код страницы.
Порядок ячеек таблицы — показывает порядок, в котором страница считывается пользователями программы чтения с экрана (если для макета используется таблица). Будем надеяться, что порядок будет достаточно логичным.
Проверка сайта работает при любых обстоятельствах
Важно, чтобы ваш веб-сайт не зависел от какой-либо одной технологии, иначе пользователи, чьи браузеры не поддерживают эту технологию, могут не получить доступ к вашему сайту. Вы можете проверить, зависит ли ваш сайт от какой-либо одной технологии:
Изображения > Переключить изображение/Alt — одна из наиболее полезных функций на панели инструментов, заменяет изображения их ALT или альтернативным текстом. Замещающий текст зачитывается пользователям программ чтения с экрана или отображается веб-пользователям с отключенными изображениями вместо самого изображения (например, пользователи модемов коммутируемого доступа могут отключать изображения, чтобы ускорить загрузку страниц). Очень важно, чтобы текст ALT содержал адекватное описание изображения.
Параметры IE > Переключить JavaScript — отключает JavaScript. Выбрав этот вариант, просмотрите страницы своего веб-сайта: доступен ли вам весь сайт?
Параметры IE > Переключить ActiveX — отключает элементы управления ActiveX. Опять же, выбрав этот вариант, просмотрите свой веб-сайт и проверьте, доступен ли вам весь сайт.
Параметры IE > Переключить CSS — отключает CSS. Страницы по-прежнему читаемы? Если для макета используется CSS, вы увидите содержимое страницы в том порядке, в котором оно считывается пользователями программ чтения с экрана. (Если после этого вы переключите image/alt, у вас будет полное визуальное представление того, что услышат пользователи программ чтения с экрана.)
Другие полезные проверки доступности
На панели инструментов веб-доступности доступно огромное количество функций, но некоторые из других наиболее важных проверок доступности, которые вы можете выполнить с помощью панели инструментов, включают:
Проверить > Валидатор HTML W3C > Проверить HTML — проверяет, основана ли страница на допустимом HTML или нет. Если страница недействительна, вам сообщат, почему.
CSS > Устаревший HTML > Устаревшие элементы и атрибуты — проверяет код, который не следует использовать и который постепенно выводится из употребления. Откроется новое окно с HTML-кодом — все, что выделено красным, устарело и должно быть удалено.
Информация о документе > Отчет о скорости страницы. Проверяются все файлы, используемые для отображения веб-страницы, и подготавливается отчет о средней скорости загрузки этой страницы для различных подключений к Интернету.
Информация о документе > Список ссылок — отображает список всех ссылок на странице. Пользователи программ чтения с экрана могут вызвать список ссылок и сразу перейти на страницу, которая их больше всего интересует, поэтому очень важно, чтобы текст ссылки имел смысл вне контекста. Текста ссылки, такого как «нажмите здесь», следует избегать любой ценой!
Цвет > Оттенки серого — отображает страницу в оттенках серого. Отлично подходит для проверки цветового контраста.
Другая функциональность
Другая функциональность
Панель инструментов веб-доступности предлагает еще несколько интересных функций:
Изменение размера. Посмотрите, как ваш веб-сайт выглядит для пользователей при разрешении экрана 640 x 480 пикселей, 800 x 600 пикселей и 1024 x 768 пикселей.
Инструменты > Симуляторы. Поставьте себя на место пользователей с особыми потребностями с помощью этих увлекательных симуляций.
Заключение
Панель инструментов веб-доступности предлагает огромный функционал. Загрузите его бесплатно с http://www.nils.org.au/ais/web/resources/toolbar и начните использовать. Не имея каких-либо технических знаний, вы можете провести мини-аудит доступности любого сайта всего за пару минут.
Тестирование веб-сайта на доступность может оказаться трудоемким и трудоемким процессом. Однако бесплатная панель инструментов веб-доступности может значительно упростить эту задачу и является незаменимым инструментом для всех, кто заинтересован в обеспечении доступности своего веб-сайта для всех пользователей.
В отличие от инструментов автоматического тестирования доступности, панель инструментов веб-доступности не является инструментом автоматического тестирования. Он требует от пользователя ручной работы, что позволяет ему избежать многих проблем, связанных с автоматизированными инструментами. Кроме того, панель инструментов не требует каких-либо технических знаний, что делает ее доступной даже для наименее технически подкованных людей, которые хотят проверить свой веб-сайт на доступность.
Установка панели инструментов веб-доступности
Для начала вы можете бесплатно загрузить панель инструментов со следующего веб-сайта: http://www.nils.org.au/ais/web/resources/toolbar. ↗ После загрузки вы можете установить его, и он появится на панели инструментов Internet Explorer. Общий размер файла составляет всего 550 КБ, поэтому загрузка должна быть относительно быстрой.
Важно отметить, что панель инструментов работает только с Internet Explorer в Windows. Если Internet Explorer не является вашим предпочтительным браузером, вам может потребоваться временно переключиться на Internet Explorer при использовании панели инструментов. Кроме того, вы можете изучить возможность загрузки панели инструментов веб-разработчика для Firefox, которая предлагает аналогичные, но не идентичные функции.
После того как вы загрузили и установили панель инструментов веб-доступности, вы можете начать использовать ее для оценки доступности вашего веб-сайта. Панель инструментов состоит из 12 кнопок, каждая из которых сопровождается стрелкой вниз с правой стороны, указывающей на дополнительные параметры. При нажатии на стрелку вниз появляется раскрывающееся меню, в котором представлены все доступные параметры. Кроме того, для быстрого доступа вы можете использовать сочетания клавиш, назначенные каждой кнопке.
Проверка структуры документа
Одна из самых полезных кнопок на панели инструментов — седьмая, с надписью «Структура». Крайне важно, чтобы структура HTML-кода точно отражала визуальную структуру страницы. Это гарантирует, что веб-пользователи с ослабленным зрением, использующие программы чтения с экрана, смогут эффективно понять структуру страницы.
Раскрывающееся меню «Структура» предлагает несколько ценных элементов, в том числе:
-
Заголовки: этот параметр выделяет на странице элементы, помеченные как заголовки в HTML-коде. Правильно структурированные заголовки имеют важное значение: заголовок главной страницы использует заголовок первого уровня (H1), а последующие заголовки используют заголовок второго уровня (H2), заголовок третьего уровня (H3) и так далее. Последовательная нумерация заголовков имеет решающее значение, поскольку она позволяет пользователям программ чтения с экрана эффективно перемещаться по странице, получая доступ к списку заголовков.
-
Элементы списка: этот элемент идентифицирует элементы на странице, которые помечены как списки в HTML-коде. Рядом с каждым элементом списка отображается символ. Списки могут быть горизонтальными или вертикальными, и все элементы навигации должны быть помечены как элементы списка. Пользователи программ чтения с экрана получают большую выгоду от списков, поскольку программа чтения с экрана объявляет количество элементов в списке перед чтением отдельных элементов списка.
-
Набор полей/метка: этот параметр отображает элементы на странице, которые идентифицируются как метки в HTML-коде. После выбора набора полей/метки текст рядом с каждым элементом формы должен быть связан с соответствующей меткой. Если текст не помечен соответствующим образом в коде, это указывает на потенциальную проблему доступности.
-
Граница таблицы: включение этой опции создает рамку вокруг каждой таблицы на странице. Таблицы, вложенные в другие таблицы, могут вызвать трудности у пользователей программ чтения с экрана. Проверяя границы таблицы, вы можете выявить потенциальные проблемы в структуре таблицы и соответствующим образом скорректировать код.
-
Порядок ячеек таблицы: этот параметр визуализирует порядок, в котором содержимое страницы считывается пользователям программ чтения с экрана, когда таблицы используются для макетирования. Порядок чтения в идеале должен следовать логической последовательности. Проверка порядка ячеек таблицы гарантирует, что содержимое представлено в осмысленной последовательности.
Проверка сайта при различных обстоятельствах
Очень важно убедиться, что ваш веб-сайт остается доступным при различных обстоятельствах и не зависит от какой-то одной технологии, которую браузеры некоторых пользователей могут не поддерживать. Панель инструментов веб-доступности предоставляет варианты, подтверждающие это:
-
Изображения > Переключить изображение/Alt: эта функция заменяет изображения их альтернативным текстом (ALT-текстом). Текст ALT считывается программами чтения с экрана или отображается пользователям с отключенными изображениями. Крайне важно предоставить описательный и содержательный текст ALT, чтобы пользователи с нарушениями зрения получали адекватную информацию об изображениях.
-
Параметры IE > Переключить JavaScript: отключение JavaScript позволяет вам проверить, остается ли ваш веб-сайт полностью доступным, не полагаясь на функции JavaScript. Просматривая свой веб-сайт с отключенным JavaScript, вы можете выявить любые потенциальные проблемы с доступностью, которые могут возникнуть у пользователей, у которых отключен или не поддерживается JavaScript.
-
Параметры IE > Переключить ActiveX: этот параметр отключает элементы управления ActiveX, позволяя вам оценить, остается ли ваш веб-сайт доступным, не полагаясь на эту технологию. Изучив функциональность сайта после отключения элементов управления ActiveX, вы можете выявить любые проблемы с доступностью, которые могут возникнуть у пользователей, чьи браузеры не поддерживают эту функцию.
-
Параметры IE > Переключить CSS: отключение CSS отключает стиль, примененный к веб-странице. Этот тест помогает определить, остается ли ваш контент разборчивым и понятным, не полагаясь на визуальные подсказки, предоставляемые CSS. Это гарантирует, что пользователи, которые, возможно, настроили стили своего браузера или используют вспомогательные технологии, не поддерживающие CSS, по-прежнему смогут эффективно получать доступ к вашему веб-сайту и перемещаться по нему.
Дополнительные возможности
В дополнение к кнопке «Структура» и параметрам, упомянутым выше, панель инструментов веб-доступности предлагает несколько других функций, помогающих оценить доступность:
-
Проверка: кнопка «Проверка» позволяет проверить HTML-код текущей страницы на соответствие различным стандартам доступности, таким как WCAG (Руководство по обеспечению доступности веб-контента). Это помогает выявить потенциальные ошибки кодирования, которые могут повлиять на доступность.
-
Цветовой контраст: кнопка «Цветовой контраст» позволяет проверить, соответствует ли цветовой контраст между текстом переднего плана и цветами фона стандартам доступности. Это помогает гарантировать, что пользователи с нарушениями зрения смогут комфортно читать контент.
-
Изменение размера текста: кнопка «Изменение размера текста» позволяет увеличить или уменьшить размер шрифта содержимого страницы. Эта функция позволяет вам проверить, остается ли ваш веб-сайт читаемым и пригодным для использования, когда пользователи настраивают размер шрифта в соответствии со своими индивидуальными потребностями.
-
Сокращения: кнопка «Акронимы» сканирует страницу на предмет сокращений и сокращений и позволяет развернуть их до полного текста. Эта функция помогает гарантировать, что пользователи программ чтения с экрана смогут понять значение сокращений и акронимов, используемых на веб-сайте.
-
Ориентиры: кнопка «Ориентиры» идентифицирует ориентиры на странице, такие как верхние и нижние колонтитулы, навигацию и области основного контента. Это помогает пользователям программ чтения с экрана более эффективно перемещаться по странице и быстро находить нужный контент.
Помните, что панель инструментов веб-доступности — это инструмент ручного тестирования, который помогает выявить потенциальные проблемы доступности. Это не заменяет комплексный аудит доступности, проводимый экспертами, или автоматизированные инструменты тестирования доступности. Тем не менее, это ценный ресурс для всех, кто заинтересован в том, чтобы сделать свой сайт более доступным.
Имейте в виду, что панель инструментов веб-доступности последний раз обновлялась в 2016 году, поэтому она может не включать последние стандарты или рекомендации по обеспечению специальных возможностей. Всегда желательно быть в курсе текущих передовых методов обеспечения доступности и обращаться к актуальным ресурсам и рекомендациям, таким как Рекомендации по обеспечению доступности веб-контента (WCAG) 2.1 или WCAG 3.0, при оценке и улучшении доступности вашего веб-сайта.
-
Рабата Чернильный Картридж
19 Oct, 24 -
Rfid, Его Последствия И Как Победит?
19 Oct, 24 -
Желание Скачат?
19 Oct, 24
