Корпоративный веб-сайт на 100%. Требуйте от сайта большего!
Шрифт:
♦ Необходимо обеспечить полное соответствие сайта позиционированию бренда , соблюсти все стандарты фирменного стиля компании
♦ Желательно обеспечить уникальность, запоминаемость общего стиля оформления ресурса
♦ Необходимо соблюдать основные правила композиции (баланс масс, пропорциональность, «золотое сечение», наличие акцента и др.)
При использовании Ajax-технологий или skin\'ов («оболочек») часть принципов начинает «звучать» иначе. Например, появляется:
♦ Грамотное разбиение контента на «закладки», позволяющие очень удобно и экономно
♦ Требование учета динамики смены элементов , то есть фактически анимации
♦ Унификация (то есть использование сходных элементов и структур для решения разных задач)Не так страшен сайт, как его малюют
Оформление интерфейса
При разработке дизайна интерфейса мы рекомендуем обратить внимание на следующие моменты:
♦ Цвет шрифта и цвет фона должны быть достаточно контрастны
♦ Все функциональные и смысловые зоны следует визуально отделять друг от друга
♦ Должна присутствовать очевидная визуальная иерархия заголовков и информационных блоков
♦ Следует оставлять достаточно «белого пространства», «воздушности», «прозрачности» (чем больше – тем лучше)
♦ Логотип компании должен быть хорошо заметен и размещен вверху каждой страницы
♦ Навигация должна занимать не более 20 % площади экрана
♦ На странице должно быть не более десяти блоков, расположенных максимум в три колонки
♦ При выравнивании элементов следует соблюдать общий принцип (например, «все по левому краю»)
♦ Поля вокруг всех элементов следует делать равными со всех сторон
♦ При стандартном разрешении экрана (сейчас 1024 х 768 точек) горизонтальная прокрутка должна отсутствовать
Есть и более тонкие моменты, о которых знают профессионалы. К их числу относится уже упомянутый F-паттерн считывания информации с экрана и обнаруженный с помощью аппаратуры, отслеживающей движение глаз («eye-tracking»). Согласно нему, человек просматривает сайт по схеме: «по верху слева направо, потом вниз и посередине». Соответственно, вся наиболее важная информация должна располагаться на этих линиях.
Мода и тренды
Практически каждый год в сфере веб-дизайна формируются новые тренды. Часть из них являются следствиями более глубокого понимания специфики работы человека в интерактивной среде. Другая часть – это не более чем мода, активно стимулирующая владельцев сайтов к обновлению в угоду новым вкусовым пристрастиям и стереотипам.
Например, в 2008–2009 годах в качестве основных трендов стали называть использование эффекта прозрачности, «газетную» верстку, многоколоночность, внимание к шрифтам, активное внедрение видео и скринкастов, сложный фон, создание огромных иллюстраций. Интересно, что значительная часть этих «инноваций» ранее считалась морально устаревшей, так как активно применялась примерно 9-10 лет назад. Мода сделала круг.
Мы рекомендуем вам ориентироваться на более фундаментальные законы восприятия и удобства использования интерфейсов, а не на сиюминутные поветрия. Или, по крайней мере, не требовать от дизайнеров создания нефункциональных «красивостей», бизнес-задачи которых совершенно не очевидны.
27. Веб 2.0-интерфейс
Термин
«Веб 2.0» (Web 2.0) впервые появился в 2005 году и до сих пор не получил однозначного определения. С ним связывают:• идею генерации контента веб-сайта самими пользователями, социализацию, интерактивность;
• определенный стиль и набор принципов, используемых в дизайне интерфейсов .
Несмотря на то, что сам феномен Веб 2.0 является скорее маркетинговым ходом, чем реальной инновацией, рождение этого тренда обозначило новый этап в развитии веб-технологий и сообществ.
Благодаря удобству использования и прогрессивности внедренных подходов, проекты тренда Веб 2.0 активно «стягивают» трафик с корпоративных сайтов. Это явная угроза для них.
Сайты тренда Веб 2.0 – это сервисные интернет-проекты, в большинстве своем ориентированные на активный маркетинг и последующую продажу
Как использовать идеи Веб 2.0
Если вы приняли решение об использовании на корпоративном веб-сайте принципов Веб 2.0, то желательно обеспечить следующее:
♦ Простой, компактный интерфейс , содержащий только реально востребованные для пользователей функциональности и материалы
♦ Использование «новых» технологий и решений , таких как Ajax, Mash-up, RSS/Atom, вебсервисы и др.
♦ Обеспечение максимальной обратной связи с посетителями
♦ Открытый маркетинг , избегающий пафоса, «раздувания щек» и обмана (отточенные тексты)
♦ Активное вовлечение пользователей в работу с контентом, создание сообществ, общение, поддержку рейтингов и т. д.
♦ Обязательное наличие явной и хорошо обозначенной бизнес-идеи
Некоторые элементы Веб 2.0-функциональностей присутствуют на корпоративных сайтах достаточно давно. Например, это форумы, а в последнее время – блоги, RSS и «облака тегов».
Следование тенденциям Веб 2.0-стиля предполагает:
♦ Уместное использование различных «звездочек», «теней», «отражений» и т. д. (например, для привлечения внимания к спецпредложениям или визардам)
♦ Укрупненный логотип
♦ Наличие крупных кнопок с явным обозначением их функций
♦ Резкое цветовое отделение верхней секции сайта
♦ Использование увеличенных, часто цветных заголовков
Обратите внимание, что многие крупные транснациональные корпорации (например, Xerox или HP) видоизменили свой фирменный стиль под эти тенденции.
В качестве примеров посмотрите следующие сайты: www.flickr.com, www.digg.com, www.blogger.com, www.elance.com, www.plaxo.com, www.metadesign.com, www.linkedin.com, www.salesforce.com. В данном случае обращайте внимание только на приемы, используемые для оформления интерфейса.
Перспективы – Веб 3.0
Термин Веб 3.0 обычно связывают с созданием в веб-среде так называемой семантической паутины, а не с инновациями в пользовательском интерфейсе или методах генерации контента.