Примеры высококонтрастных таблиц стилей с плохим зрением?

Question

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

Есть ли хорошие практики, представленные в реальной жизни?

Answer 1

Для хороших практик вы должны прочитать:

• http://mashable.com/2009/08/10/twitter-usability/
• некоторые примеры здесь http://www.webdesignfromscratch.com/web-design/contrast/
• http://www.useit.com/ Jakon Nielsen expert для веб-сайтана юзабилити для слабовидящих

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

Answer 2

Хотя я не могу дать вам одну руку для слабовидящих, вот несколько полезных предметов:

• Вот пример сайта с альтернативными таблицами стилей .
• Вот отличное руководство по началу работы с чередующимися таблицами стилей
• При разработке сайта используйте 'em' при указании ширины и высоты.Это тем более, когда пользователи со слабым зрением используют функцию масштабирования своего браузера.Это поможет сохранить внешний вид сайта, вместо того чтобы использовать измерения «px», которые также не изменяются и не изменяют размер.
• Используйте атрибут «alt» для изображений, поскольку программы чтения с экрана будут читать их пользователям, так чтоони могут понять, что это за изображение.
• Назовите ваши ссылки соответственно.Текст гиперссылки «Нажмите здесь» не говорит кому-то, на что идет ссылка.Однако «дополнительная информация о процессах проектирования для слабовидящих» в виде текста с гиперссылкой.
• Контрастный текст.Темный текст на светлом или белом фоне лучше всего подходит для разборчивости.

В качестве альтернативы вы также можете использовать javascript. Вот сайт Joomla с плагином для настройки размеров шрифта .

Answer 3

Вот онлайн-инструмент, который поможет вам проверить, насколько любая цветовая комбинация подходит для слабовидящих:

http://gmazzocato.altervista.org/colorwheel/wheel.php

Он охватывает несколько «топий» и также соответствует WCAG.рекомендации.

Также хороший список других подобных инструментов:

http://www.456bereastreet.com/archive/200709/10_colour_contrast_checking_tools_to_improve_the_accessibility_of_your_design/