Адаптация интерфейса
Согласно международному стандарту WAI-WCAG, для адаптации интерфейса и контента под особенности работы лиц с ограниченными возможностями необходимо сделать следующее:
♦ Все изображения на сайте должны быть снабжены Alt-текстами (всплывающими комментариями, которые может прочитать синтезатор речи)
♦ Функциональность сайта должна сохраниться при выключенных скриптах, апплетах и других программных элементах
♦ Страница должна быть читабельна при существенном увеличении размера шрифта самим пользователем
♦ Страница должна читаться на монохромном экране
♦ Аудиосодержимое должно иметь текстовый эквивалент
♦ Страница должна читаться при отключенных каскадных таблицах стилей (CSS)
♦ Необходимо использовать клиентские активные карты (image map), а не серверные во всех случаях, когда карту можно задать геометрическими границами областей
♦ Должна быть предусмотрена возможность использования навигации по сайту без мыши (например, с помощью клавиши «Tab»)
Для многих пользователей с ограниченными возможностями Интернет может являться фактически единственным средством коммуникации с внешним миром.
Он дает им множество инструментов для общения, работы и совершения покупок (через интернет-магазины со службой доставки).
...
Подробную информацию о стандарте WAI-WCAG смотрите на www.w3.org/WAI
Очевидно также, что в будущем, в Интернете будут учитываться все большие потребности лиц с ограниченными возможностями. Технологические возможности даже сегодня выглядят фантастическими. Например, уже есть устройства, позволяющие передавать информацию с видеокамер непосредственно в мозг человека, позволяя слепому формировать у себя в голове «картинку» окружающего пространства. Правда, пока только в черно-белом варианте.
26. Художественное оформление веб-сайта
...
Идеальный интерфейс должен быть простым, удобным, понятным и красивым. Именно дизайн интерфейса формирует в сознании пользователя первое и самое общее впечатление о сайте. Оно (впечатление) иногда становится единственным и решающим
Важно научиться воспринимать создание стилевого макета сайта как проектирование пользовательского интерфейса, а не сотворение «красивости». На такую позицию часто бывает очень сложно перестроиться дизайнерам, работавшим ранее в других сферах (например, в полиграфии) и, тем более, заказчикам сайтов, которые полагают, что «красивость» сильно волнует их посетителей.
...
Дизайнерское решение, используемое на сайте, часто является одним из наиболее критичных и дискуссионных аспектов разработки
Как сделать хороший дизайн
♦ Следует обеспечить единство и сбалансированность визуальной концепции сайта , избавиться от «выпадающих» по стилистике элементов
♦ Следует максимально сократить «визуальный шум», отказаться от всех «неработающих» элементов, но при этом провести грамотную и тщательную нюансировку, проработать все мелкие детали
♦ Важно выдержать основные отраслевые стандарты
♦ Необходимо учесть множество особенностей восприятия , характерных для веб-среды (психологию цвета, национальные и/или интернациональные особенности, F-паттерн считывания информации с экрана, гештальты и др.)
♦ Следует предусмотреть возможность масштабирования интерфейса и контента (учесть разные размеры экрана, возможность расширения навигации, рост объемов контента и т. д.)
♦ Необходимо обеспечить полное соответствие сайта позиционированию бренда , соблюсти все стандарты фирменного стиля компании
♦ Желательно обеспечить уникальность, запоминаемость общего стиля оформления ресурса
♦ Необходимо соблюдать основные правила композиции (баланс масс, пропорциональность, «золотое сечение», наличие акцента и др.)
При использовании Ajax-технологий или skin'ов («оболочек») часть принципов начинает «звучать» иначе. Например, появляется:
♦ Грамотное разбиение контента на «закладки», позволяющие очень удобно и экономно располагать текст на экране
♦ Требование учета динамики смены элементов , то есть фактически анимации
♦
Унификация (то есть использование сходных элементов и структур для решения разных задач)...
Не так страшен сайт, как его малюют
Оформление интерфейса
При разработке дизайна интерфейса мы рекомендуем обратить внимание на следующие моменты:
♦ Цвет шрифта и цвет фона должны быть достаточно контрастны
♦ Все функциональные и смысловые зоны следует визуально отделять друг от друга
♦ Должна присутствовать очевидная визуальная иерархия заголовков и информационных блоков
♦ Следует оставлять достаточно «белого пространства», «воздушности», «прозрачности» (чем больше – тем лучше)
♦ Логотип компании должен быть хорошо заметен и размещен вверху каждой страницы
♦ Навигация должна занимать не более 20 % площади экрана
♦ На странице должно быть не более десяти блоков, расположенных максимум в три колонки
♦ При выравнивании элементов следует соблюдать общий принцип (например, «все по левому краю»)
♦ Поля вокруг всех элементов следует делать равными со всех сторон
♦ При стандартном разрешении экрана (сейчас 1024 х 768 точек) горизонтальная прокрутка должна отсутствовать
Есть и более тонкие моменты, о которых знают профессионалы. К их числу относится уже упомянутый F-паттерн считывания информации с экрана и обнаруженный с помощью аппаратуры, отслеживающей движение глаз («eye-tracking»). Согласно нему, человек просматривает сайт по схеме: «по верху слева направо, потом вниз и посередине». Соответственно, вся наиболее важная информация должна располагаться на этих линиях.
Мода и тренды
Практически каждый год в сфере веб-дизайна формируются новые тренды. Часть из них являются следствиями более глубокого понимания специфики работы человека в интерактивной среде. Другая часть – это не более чем мода, активно стимулирующая владельцев сайтов к обновлению в угоду новым вкусовым пристрастиям и стереотипам.
Например, в 2008–2009 годах в качестве основных трендов стали называть использование эффекта прозрачности, «газетную» верстку, многоколоночность, внимание к шрифтам, активное внедрение видео и скринкастов, сложный фон, создание огромных иллюстраций. Интересно, что значительная часть этих «инноваций» ранее считалась морально устаревшей, так как активно применялась примерно 9-10 лет назад. Мода сделала круг.
