Компания
30,91
рейтинг
18 марта 2011 в 19:25

Разное → 20 наиболее необходимых инструментов для проверки отображения сайта перевод

Доступность контента и отображение информации на сайте чрезвычайно важна. Говоря простым языком, что хорошего может сделать то, что находится у вас на сайте, если определенные люди не смогут увидеть это? Конечно, этот новый модный дизайн с мелким шрифтом и малоконтрастными цветами для вас и ваших друзей выглядит классно, но вот что насчет тех, у кого слабое зрение, или тех, кто не различает некоторые цвета, или тех, у кого какие-либо другие проблемы со зрением — они ведь просто не смогут ничего найти, не говоря уже о том, чтобы прочитать хоть что-нибудь на вашем сайте. Вам надо, даже не «надо», а вы ДОЛЖНЫ сделать свой сайт доступным для как можно большего числа посетителей.

Только вот, что же делать, чтобы гарантировать доступность своего сайта? После прочтения данной статьи ваша задача значительно упростится. Ниже вы найдете 20 инструментов, помогающих сделать сайт более доступным.

Спонсор перевода: Студия Айкен

WAVE


wave
WAVE является бесплатным инструментом, который поможет в процессе оценки доступности сайта. Вместо того, чтобы выдать отчет, написанный сложным техническим языком, WAVE покажет оригинал вашей веб-страницы, встроив в неё иконки и индикаторы, которые показывают уровень её доступности.

IDI


idi
IDI Web Accessibility Checker (проверка доступности сайта) проверяет веб-страницы на соответствие стандартам доступности сайтов для того, чтобы убедиться, что все имеют доступ к содержимому тестируемого сайта.

Vischeck


vischeck
Vischeck покажет, как страницы сайта видят те, кто не различает некоторые цвета. Вы можете воспользоваться услугой Vischeck он-лайн, проверив графический файл, либо запустив её на проверку вашей веб-страницы. Также есть возможность загрузить Vischeck на свой компьютер и пользоваться ею без подключения к интернету.

Colour Contrast Check


contrast-checker
Colour Contrast Check позволяет выбрать основной и фоновый цвета и посмотреть, достаточно ли они контрастные, когда на них смотрит тот, кто страдает цветовой слепотой, а также насколько они контрастны на черно-белом экране.

mobiReady

mobi
mobiReady — механизм для оценки подготовленности сайта для просмотра на экранах мобильных устройств, который использует промышленную практику и стандарты. Он выдаст вам бесплатный отчет с оценкой (от 1 до 5) и подробным анализом веб-страниц для того, чтобы определить, насколько хорошо сайт подходит для просмотра на экранах мобильных устройств.

Stanford Web Accessibility Checker


stanford
Stanford Web Accessibility Checker — это программный инструмент, который анализирует ваши веб-страницы и проверяет их на наличие возможных препятствий для того, чтобы они соответствовали стандартам доступности. Вы можете указать ему адрес страницы, которую необходимо проверить, либо отправить рабочий файл на оценку. В результате проверки вы получите отчет со всеми возможными проблемами с доступностью по выбранным вами категориям.

Check My Colours


check-my-colours
Check My Colours является инструментом для проверки комбинаций основного и фонового цвета всех элементов Объектных Моделей Документов (DOM) и определения того, имеют ли они достаточный контраст для тех, кто не различает некоторые цвета.

Lynx Viewer


lynx
Lynx Viewer позволяет вам увидеть ваши страницы так, как они выглядят в текстовом браузере Lynx. Он также продемонстрирует Вам как поисковые системы видят ваш сайт. Вдобавок к этому, он поможет определить насколько Ваши страницы доступны для людей с проблемами зрения.

Quick Page Accessibility Tester


quick-page-tester
Quick Page Accessibility Tester является букмарклетом, кликнув на который в любое время вы сможете получить быстрый анализ ваших веб-страниц. Он выделит явные проблемные моменты на вашей странице, предупредит о возможных проблемах, а также выделит те области, доступность которых можно улучшить с помощью средств стандарта доступности активных Интернет-приложений (ARIA).

GrayBit


graybit
GrayBit — это инструмент он-лайн проверки доступности, который конвертирует ваши полноцветные веб-страницы в полутона серого для того, чтобы зрительно протестировать наблюдаемый на странице контраст.

Accessibility Color Wheel


color-wheel
Accessibility Color Wheel позволит вам увидеть какую доступность имеет та или иная цветовая пара. Выберите основной и фоновый цвет, указав мышкой цвет на шкале или на полосе серого цвета и кликнув на вашем выборе. Если в ответ вы получите «ОК», то это значит, что данная цветовая пара подходит с точки зрения доступности. В обратном случае, вы сможете изменять один или оба цвета пока не получите подходящий результат («ОК»).

HERA


hera
HERA является инструментом для проверки соответствия доступности ваших веб-страниц спецификациям «Рекомендаций по общедоступности веб-контента» (WCAG). HERA проводит серию проверок ваших веб-страниц, определяет любые, которые возможно обнаружить в автоматическом режиме, ошибки, или отдельные пункты, которым соответствуют страницы, а также показывает те пункты, которые требуют ручного подтверждения.

Accessibility Valet


valet
Accessibility Valet показывает разметку ваших веб-страниц в нормализованном виде. Он подчеркивает действующую, исключенную и фальшивую разметку, а также неправильно расположенные элементы. В создаваемом отчете показаны все предупреждения о проблемах с доступностью.

Cynthia Says


cynthia-says
Cynthia Says — это инструмент оценки доступности контента, который находит ошибки в вашем дизайне, имеющие отношение к Разделу 506 стандартов и Рекомендациям WCAG.

TAW


taw
TAW является инструментом для анализа ваших веб-страниц, который основывается на Рекомендациях по общедоступности веб-контента 1.0 от W3C. В дополнение к он-лайн инструменту, есть возможность загрузить отдельное ПО.

WebAnywhere


webanywhere
WebAnywhere («Веб повсюду») — это не визуальный интерфейс, который позволит вам обращаться к своим страницам так, как к ним обращаются такие программы для чтения экрана, как JAWS или Windows-Eyes.

Colour Contrast Analyser


colour-contrast-analyser
Colour Contrast Analyser — это расширение для браузера Firefox, которое составляет список комбинаций цвета, используемых на ваших веб-страницах. Он размещает цвета в таблице, которая суммирует основной цвет, цвет фона, степень яркости/контрастности, а также разницу между цветом и яркостью.

WAT


wat
WAT встраивается в качестве дополнительной панели инструментов в Internet Explorer и помогает Вам вручную проверить ваши веб-страницы на различные аспекты их доступности.

Firefox Accessibility Extension


firefox
Firefox Accessibility Extension является именно тем, о чём говорит его название — расширение для браузера Firefox, поддерживающее функциональную доступность веб-страниц, и которое вы сможете использовать для проверки структурной и стилевой разметки ваших веб-страниц. С его помощью вы облегчите просмотр и навигацию по Вашим веб-страницам людям с ограниченной дееспособностью.

Accessibility Favelets


accessibility-favelets
Accessibility Favelets — это сборник букмарклетов, который поможет вам с вопросом доступности в вашей работе над веб-страницами. Они представляют собой небольшие скрипты, которые вы сохраняете (например, в виде закладок в браузере), а потом можете использовать для проверки доступности на одной из ваших веб-страниц.

Какие полезные инструменты используешь ты?


Теперь обменяемся опытом: какие инструменты для работы с доступностью вашего сайта ты считаешь самыми необходимыми? У тебя есть какие-нибудь полезные советы относительно доступности? Может мы пропустили какого-либо явного кандидата в этот список? Не стесняйтесь и поделитесь полезными дополнениями в комментариях.
Автор: @Tsotsotka Oleg Mokhov
Айкен
рейтинг 30,91
Реклама помогает поддерживать и развивать наши сервисы

Подробнее
Реклама

Комментарии (11)

  • +2
    Прочитав заголовок, подумал, что будет обзор инструментов для слежения за аптаймом/онлайн-статусом (так и просится сказать «доступностью») сайтов.
    • +5
      Кстати, отличная идея для следующего поста. Спасибо! =)
    • +1
      Наверное, «для проверки отображения сайтов» будет лучше…
  • +1
    Большое спасибо! О некоторых из сервисов: не думал, то такое вообще существует.
  • 0
    По-любому в избранное!
  • +1
    Можно добавить аддон www.colorzilla.com/
  • 0
    Хорошая статья. Не думал, что много кто делает сайты с учетом доступности для дальтоников. В России этим похвастаться почти некому.
    • 0
      На самом деле это совершенно не сложно — нужно просто не завязывать различие элементов управления только на цвет, что полезно для всех пользователей.
  • +1
    Да, восприятие контента — это еще один из аспектов веб-разработки, который тоже необходимо учитывать. Спасибо за статью! Задумался…
  • 0
    А Вы свою статью проверяли на легкость восприятия?
    Статья интересная и полезная, но честное слово тяжело ее воспринимать если хочешь ухватить суть, мне не хватает содержания в самом начале типа:
    1. сайт такой-то — делает то-то
    2. сайт 2… умеет это и это
    3…
    4.

    кто хочет читает дальше, кто хочет идет по ссылкам.

    • 0
      Дело в том, что это перевод статьи (как это видно из заголовка). Оригинал находится здесь: speckyboy.com/2011/01/21/20-essential-tools-and-tips-to-an-accessible-website/

      И мне кажется, что все изложено как раз как вы описали: сайт такой-то, скрин, ссылка на сайт и краткое описание. Кому нужно — идет по ссылке сайта и вникает. Все лаконично и без лишних подробностей.

Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.

Самое читаемое Разное