Доступность веб-сайтов — это не так просто, как кажется на первый взгляд.
Возможно, вы заметили некоторые незначительные, но важные изменения на сайте Boston.gov в последние недели.
Цифровая команда всегда отстаивает важность доступности в дизайне . Наша цель — соответствие стандарту AA , основанному на Руководстве по доступности веб-контента организации, устанавливающей веб-стандарты.
Хотя мы стремились достичь этого уровня — и думали, что достигли — электронное письмо, которое комиссия по делам инвалидов города получила от избирателя, предупредило нас о том, что мы не дотягивали до нужного уровня в использовании цветов. Благодаря некоторым незначительным изменениям в нашей библиотеке шаблонов мы смогли создать более удобный интерфейс для наших пользователей.
Реагирование на отзывы пользователей
Мы всегда опирались на отзывы пользователей наших цифровых инструментов, и этот случай не стал исключением. Подписчик информационного бюллетеня Комиссии по делам инвалидов сообщил о трудностях с чтением ссылок в нашей системе рассылки. Когда сотрудник Комиссии по делам инвалидов провел более тщательное расследование, выяснилось, что проблема кроется в наших цветах и оформлении. Они не соответствовали установленному соотношению цветового контраста для доступного текста.
К счастью, у нас есть библиотека шаблонов цифрового брендинга, которая определяет стиль и цвета для наших цифровых инструментов и Boston.gov. Поскольку наши спецификации дизайна размещены в этом централизованном месте, мы знали, что сможем легче просмотреть необходимые изменения и их последствия. Мы решили сделать шаг назад и пересмотреть все цвета, используемые в наших руководствах по брендингу, чтобы убедиться, что мы достигаем наших целей в области цифровой доступности.
Получение помощи от друзей.
Цифровой команде посчастливилось иметь такого замечательного партнера, как IDEO . Помимо разработки Boston.gov, они также всегда были рядом, когда нам нужно было обсудить идеи. Мы провели с ними импровизированный мозговой штурм, чтобы определить наилучший способ решения проблемы. Мы были рады привлечь к этому процессу отраслевых экспертов.
Глубокое погружение в детали
На некоторых цветовых фонах мы просто не достигали минимального стандарта соотношения цветовой контрастности. Мы обнаружили проблемы с двумя основными цветами на сайте:
- Freedom Trail Red (#FB4D42) и
- Оптимистичный синий (#288BE4).
Они создавали проблемы при использовании наших вторичных цветов для текста в определенных случаях. Например, если бы мы использовали оптимистичный синий цвет на бледном сером или на фоне синего цвета реки Чарльз, этого было бы недостаточно для обеспечения необходимого уровня контраста.
Благодаря предварительным исследованиям одного из наших инженеров-программистов, нам удалось создать базовую цветовую схему, которая почти соответствовала нашим исходным цветам и при этом соответствовала требованиям AA . Основная идея, которую мы разработали, заключалась в создании светлых и темных вариантов для всего. В зависимости от цвета фона мы переключались между светлой и темной версиями, чтобы сделать текст более читабельным.
Наши коллеги из IDEO помогли нам быстро составить палитру цветов. Они проанализировали все варианты цвета текста, исходя из наших цветов фона. Если вы посмотрите нашу палитру цветов , вы увидите, что допустимо.
Мы экспериментировали с нашими первоначальными новыми цветами, пока не получили варианты, которые вы видите выше. С новыми шестнадцатеричными кодами мы обновили нашу библиотеку шаблонов, чтобы внести изменения на Boston.gov. Сейчас мы занимаемся обновлением остальных наших цифровых инструментов, включая систему рассылки новостей, чтобы убедиться, что они также максимально доступны.
Что мы будем делать дальше?
Одно из изменений, которое вы скоро увидите на сайте Boston.gov, — это подчеркивание всех наших текстовых ссылок. Контраст важен, но подчеркивание добавляет еще один полезный фактор различия для тех, кто испытывает трудности с восприятием цвета. Мы хотим четко показать, на что можно, а на что нельзя кликать на сайте. Как всегда, мы будем продолжать уделять внимание обновлениям и рекомендациям W3C по веб-доступности. Если вас интересует веб-доступность, у Google есть отличные руководства по передовым практикам .
Мы знаем, что мы не идеальны. Всегда найдется что-то, что мы можем улучшить. Это относится как к дизайну, так и к контенту, и к технологиям. Важно то, что мы постоянно открыты для потенциальных возможностей для улучшения и изменений. Boston.gov и все наши цифровые инструменты — это непрерывный процесс. Поэтому ваши отзывы имеют решающее значение для нашей работы. Если вы видите что-то, что, по вашему мнению, не так, или у вас есть идея, как мы можем улучшить наши инструменты, пожалуйста, напишите нам по адресу feedback@boston.gov .