Принципы эффективного веб-дизайна

Понятие «веб-дизайн» подразумевает собой юзабилити и практичность и определяет успех или неудачу сайта. Только хороший веб-дизайнер будет делать сайт таким, чтобы пользователь мог чувствовать себя комфортно.

Если сайт делается для конкретной целевой аудитории, а ее представители с большим трудом находят интересующую их информацию, о каком дизайне и юзабилити может вообще идти речь? Хороший сайт тот, который понятен посетителю и который способен выполнять свои функции.

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

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

Как думают пользователи?

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

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

Контент важнее дизайна

Если на сайте есть полезные материалы, то читатели простят владельцу веб-сайта плохой дизайн. Именно поэтому сайты, предоставляющие уникальный и качественный контент, но не обладающие должным оформлением, имеют стабильную высокую посещаемость. Например, Библиотека Максима Мошкова (//lib.ru/). Есть, конечно, много других примеров. Все это подтверждает, что контент сайта гораздо важнее для пользователя, чем дизайн. Дизайн должен способствовать восприятию контента.

Чтение по диагонали

Прежде чем читать статью, пользователи бегло просматривают текст, ориентируясь на заголовки, списки и выделенные слова. Потому заголовки должны быть информативны и привлекательны. Текст должен быть разбит на логические разделы, абзацы должны начинаться с отступов. Хорошо, когда в тексте присутствуют врезки с основными мыслями или цитатами. Это увеличит число входов в текст статьи. И посетитель будет быстрее вовлечен в чтение.

Пользователи нетерпеливы

Если сайт не может оправдать ожиданий пользователей из-за нечитабельного текста или трудного восприятия контента, — очень высок шанс, что пользователи покинут сайт.

Пользователи не принимают оптимальных решений

Пользователи не используют простых путей в процессе поиска необходимой им информации. Также они не просматривают веб-страницы сверху донизу – их взгляд бродит в хаотичном направлении. Как только они увидят ссылку, которая, по их мнению, способна предоставить искомую ими информацию, они незамедлительно кликают по ней.

Пользователи следуют своей интуиции

В большинстве случаев пользователи с грехом пополам выполняют различные действия, не читая инструкций, размещаемых на сайте. Согласно Стиву Кругу: «Если мы находим что-то, что работает, мы используем это. Абсолютно неважно, как это работает, нам важен сам факт этого!»

Пользователи хотят владеть ситуацией

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

Не заставляйте пользователей думать

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

Если же навигация по сайту и его структура запутаны и неочевидны, то количество вопросов у пользователя только возрастет и он не сможет понять, как работать с сайтом, как переместиться из точки А в точку Б…

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

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

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

Не испытывайте терпение пользователей

В процессе реализации новых проектов не забывайте о минимальных требованиях, предъявляемых к пользователям. Чем меньше действий требуется от пользователя, тем охотнее он будет пользоваться тем или иным сервисом.

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

Ужасную ошибку совершают те, кто не пускают пользователя на сайт без указания последними их e-mail’ов.

Пользователи охотно бы дали Вам свой адрес эл. почты после того, как увидели Ваш сервис в действии и смогли понять и оценить, что они получат взамен на свой e-mail.

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

Самым лучшим вариантом будет убрать все барьеры, будь то требование зарегистрироваться или подписаться на что-либо перед тем, как получить доступ к сервису.

Управляйте вниманием пользователей

Поскольку веб-сайты представляют одновременно и статический и динамический контент, некоторые элементы пользовательского интерфейса лучше привлекают внимание пользователей. Например, изображения сразу же привлекают к себе взор пользователей и являются более замечаемыми элементами сайта, чем контент.

Человеческий взгляд далеко не прямолинейный и способен мгновенно фокусироваться на границах, узорах и движущихся элементах. Именно по этой причине видео-реклама так сильно раздражает пользователей. Однако с маркетинговой точки зрения – такой вид рекламы самый заметный.

Фокусировка пользовательского внимания на определенных участках сайта позволяет помочь им попасть из точки А в точку Б без каких-либо умственных усилий с их стороны.

Чем меньше у пользователей возникает вопросов относительно пользования Вашим сайтом, тем с большим доверием они будут к Вам относиться!

Все функции Вашего сайта должны быть видны пользователям

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

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

Подобные пользовательские интерфейсы очень просты, очевидны и юзабильны.

Все функции сайта должны быть видны пользователям даже при его беглом просмотре. Это фундаментальный принцип успешного пользовательского интерфейса. Пользователи должны получать удовольствие от взаимодействия с вашим сайтом.

Пишите эффективные и понятные тексты

Правила написания текстов для печатных изданий и для Web различаются. Для Web необходимо писать кратко, четко и понятно, разбивать текст на короткие абзацы, делать цепляющие заголовки, создавать различные списки и т.д.

Избегайте использования заумных и профессиональных выражений – Ваш текст должен быть понятен любому рядовому пользователю.

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

Хорошо следовать этому правилу, тогда пользователь не встретит на сайте никаких заумных и непонятных слов.

Стремитесь к простоте

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

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

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

Именно поэтому версия для печати так востребована пользователями интернета.

Не бойтесь свободного пространства

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

Первым, что делает пользователь при заходе на сайт, это сканирует веб-страницу, деля ее на блоки.

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

Иерархия в разы снижает сложность (Закон Саймона): чем качественнее вы превратите весь контент сайта в иерархию, тем легче он будет восприниматься пользователями.

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

Взаимодействуйте с пользователями посредством «языка дизайна»

В своих трудах по эффективной коммуникации Аарон Маркус освещает 3 фундаментальных принципа «языка дизайна» — всего того, что пользователь видит на экране.

• Организация. Обеспечьте свой сайт ясной и прозрачной структурой для удобства пользователей. Последовательность расположения элементов, простота и ясность навигации сайта – основные понятия организации. Эти же правила должны быть применены ко всем элементам сайта.
• Экономия. Сделайте больше с минимальным набором визуальных элементов. В своей работе нужно использовать следующие 4 основных принципа: простота, ясность, уникальность и выразительность. Простота включает в себя только самые важные элементы для коммуникации. Ясность: каждый элемент сайта должен быть понятен и не вызывать вопросов. Уникальность: все основные элементы и их свойства должны быть уникальными. Выразительность: все самые важные элементы должны быть легко воспринимаемы.
• Коммуникация. Сделайте сайт, соответствующим ожиданиям пользователей. В грамотном пользовательском интерфейсе в балансе находятся четкость, читабельность, типографика, символика, цвета или текстуры. Оптимально будет использовать 3 гарнитуры шрифта максимум 3-ех размеров – по 18 слов или 50-80 символов на строке.

Общепринятые соглашения – наши друзья

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

Только представьте, что бы было, если каждый веб-дизайнер размещал на своем сайте свой вариант иконки RSS, а не просто преобразовывал общепринятый.

То же касается и базовых принципов, как то структурировать файлы по папкам.

Изучайте пользователей, их поведение и ожидания. Ваш сайт должен им соответствовать и оправдывать. Больше информации по этой теме можно найти, почитав экспертов по юзабилити Якоба Нильсена или Дмитрия Сатина.

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

Постоянно тестируйте

Юзабилити-тестирования должны проводиться на регулярной основе, т.к. только при таком раскладе Вы можете всегда быть в курсе потребностей и желаний Ваших посетителей.

Что нужно знать о тестировании:

1. Согласно Стиву Кругу, тестировать 1 пользователя на 100% эффективнее, чем ни одного. Также тестировать 1 пользователя в начале реализации проекта гораздо лучше, чем тестировать 50 ближе к его запуску. Согласно первому закону Боэма, основная масса ошибок встречается на этапе проектирования. В дальнейшем же избавление от неисправленных ошибок обходится очень дорого.
2. Тестирование – постоянный процесс. Суть этого заключения состоит в том, что Вы должны тестировать каждый новый элемент сайта с целью его совершенствования.
3. Результатом юзабилити-тестирований являются практические рекомендации. В ходе тестирований выявляются неполадки и недоработки, которые Вам необходимо исправить по горячим следам.
4. Согласно закону Уайнберга, разработчик не в состоянии тестировать свой собственный код. После долгих работ над одним проектом, ваш глаз «замыливается» и вы не можете оценить результаты своих усилий свежим взглядом. Вы знаете, как и что работает. Поэтому в этой ситуации нужен человек со стороны, незнакомый с разрабатываемым вами проектом.

Заключение

Если вы стремитесь сделать действительно хороший сайт, вы должны регулярно подвергать его всевозможным тестированиям.