ZView.ru — журнал для профессионалов веб-разработки: программистов, дизайнеров, специалистов по юзабилити.

Насколько лёгким для восприятия является ваш сайт?

8 инструментов для анализа доступности* вашего сайта.

[*Получив перевод этой статьи полез в Википедию, посмотреть удобоваримый русский аналог для Accessibility, а русской статьи на эту тему и нету.. Так что просто условимся, что здесь "доступность" обозначает возможность взаимодействия с вашим сайтом людей с ограничениями. (прим.ред.)]

Разработка успешного веб-сайта требует времени, умений и множества заморочек. Обычно, когда мы говорим о веб–дизайне и слышим слово тестирование, первое, что приходит на ум – это "юзабилити", и это хорошо, но когда в последний раз вы садились, чтобы проверить уровень доступности вашего сайта?

Тестирование других аспектов сайта, конечно, тоже очень важно, однако, многие из нас пренебрегают доступностью собственных сайтов. В конечном итоге это может привести к потере широкого круга пользователей.

[Вот задумайтесь, какая часть ваших посетителей носит очки, к примеру? Или вспомните, есть ли у вас знакомые не бывшие в армии из-за дальтонизма? Это ведь вполне распространённые вещи - прим.ред.]

Но не нужно расстраиваться, ниже мы составили список инструментов, которые вам помогут. Все они бесплатны, просты в использовании и позволяют получать результаты из которых можно сделать выводы.

Color Blindness Simulator

Color Blindness Simulator поможет вам оценить, насколько хорошо видны изображения и цвета глазами человека, страдающего дальтонизмом. Вы можете загрузить изображения JPEG размером до 1000х1000px и проанализировать, как можно улучшить ваши веб-страницы для их просмотра дальтониками.

Juicy Studios Image Analyzer

С помощью этого инструмента вы можете проанализировать параметры изображений, на вашем сайте, на предмет возможных проблем. Juicy Studios Image Analyzer изучит ширину, высоту и другие параметры, чтобы определить: с правильными ли значениями они установлены. Доступность сайта также зависит от того, насколько правильно изображения отображаются на дисплее (не искажены ли их размеры), проставлены ли для них текстовые описания (чтобы их могла использовать программа для звуковой навигации). Именно поэтому Image Analyzer представляет собой прекрасный инструмент.

Firefox Accessibility Extension

Если вы один из огромного количества дизайнеров, которые используют Firefox, то это расширение является для вас немаловажным. Firefox Accessibility Extension позволит вам активно проверить каждый элемент дизайна на ваших веб – страницах. Вы сможете быстро создавать списки для изображений и других элементов, и, если там будут какие-то проблемы, которые необходимо решить, то вы будете сразу проинформированы. Кроме того, есть еще одна приятная особенность – вы сможете управлять приложениями третьих сторон, например, W3C HTML Validator из панели инструментов.

Test and Improve Readability

Этот бесплатный сервис позволяет протестировать и оценить читаемость текстов на сайте. К примеру, он способен определить уровень образованности пользователей, необходимый для понимания текста (!). Правда, всё это только для текстов на английском языке. Может кто-нибудь захочет сделать русскую версию?

WAVE

WAVE – это интерактивный инструмент, который показывает уровень доступности на вашем сайте в трех разных режимах: «Ошибки, возможности и оповещения», «Структура/Порядок» и «Только текст». Все, что вам придется сделать, это ввести URL вашего сайта и выбрать режим просмотра результатов. Вы также получите мгновенную обратную связь о размещении и идентификации каждого элемента. Инструмент уведомляет о текущих ошибках JavaScript и HTML (например, наличие невидимого текста), неправильных навигационных структурах и многом другом.

AccessColor

AccessColor тестирует цветовой контраст и яркость цвета всех элементов в DOM, чтобы убедиться, что контраст достаточно высок для людей с визуальными нарушениями. Мы надеемся, что этот инструмент позволит веб-разработчикам создавать доступные веб-сайты путем визуальной маркировки разделов на странице с проблемными цветовыми сочетаниями. AccessColor найдет неприемлемые сочетания цветов в ваших HTML и CSS, и укажет где точно они расположены (строка в файле, имя класса) и что в них не так.

aDesigner

Программы-"скрин-ридеры" используются слабовидящими людьми для чтения вслух текст на веб-страницах. Однако, они эффективны не для всех видов контента. Веб-разработчики могут использовать aDesigner для тестирования доступности и удобства использования веб-страниц для людей с плохим зрением. Также можно проверить документы ODF и Flash.

Эксперты по теме в Twitter'е:

Шон Генри (Shawn Henry) продвигает инициативу W3C Web Accessibility Initiaive (Инициатива доступности интернета для людей с ограниченными возможностями). Шон фокусируется на объединении потребностей отдельных лиц и целей организаций-разработчиков интерфейсов «человек-компьютер».

Alan Colville (Алан Колвилл) – опытный дизайнер и один из основателей Analog. Проработав в интернете с 1996 года, его клиентами являются BlackBerry, Vodafone Visa и Telewest (сейчас Virgin Media). Алан живет в Bristol, England (Бристол, Англия).

Shay Howe (Шай Хоу) является профессиональным разработчиком, проживающим в Chicago, Illinois (Чикаго, Иллинойс).

Dr. Peter J. Meyers (Доктор Питер Дж. Мейерс) AKA «Dr. Pete», когнитивный психолог.

Theresa Neil (Тереза Нил) – опытный дизайнер из Austin, Texas (Остин, штат Техас) и один из авторов книги: «Разработка веб-интерфейсов: принципы и шаблоны для достижения взаимодействий» O’Reilly Media, 2009 год.

Оригинал статьи на spyrestudios.

Обсуждение

  • 15.09.2011

    Мне лично Wave понравился - можно быстро посмотреть как будет в "только тексте" выглядеть. Остальные - так себе штуки..


Реклама

© 2008–2011 AgWeb

Обратная связь