1)Lable полей форм лучше располагать над полями форм

Исследования проводили UX Matters.
Согласно их результатам, lable лучше располагать над полями форм. Чаще всего используют макет в 2 столбца (lable слева, поля форм справа) вроде бы выглядит хорошо, но не является самым простым макетом. Но этот макет являеться самым популярным.


В таких формах расстояние между label и полем ввода иногда становиться очень большим (разделяет lable от полей ввода), что требует больше времени для визуального взаимодействия с формой.

Другой вариант, выравнивание lable по правому краю. Если сравнивать с первым вариантом форма более приятна на вид.

Но в этом варианте минус – текст больше «скачет», и явно определяется дискомфорт для глаз: имеется в виду переход от заполненного поля к следующему lable (позиция которого всегда зависит от количества символов текста) визуально не удобна.

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


2)Большинство пользователей не «прокручивают»

Согласно исследованиям Jakoba Nielsena, только 23% пользователей прокручивают страницу (Определение приоритетов в юзабилити сайтов) при своем первом посещении сайта.
Это значит, что 77% пользователей не будут прокручивать страницу, они просто просмотрят контент до надобности прокрутки. Более того, процент пользователей, которые будут прокручивать уменьшится при последующих визитах сайта до 16%. Эти данные свидетельствуют о том, насколько важно показать важную информацию в видном месте, особенно на целевых страницах.
Но это не означает, что всю важную и необходимую информацию нужно всунуть в шапку сайта. Чрезмерное количество информации в шапке сайта просто сделает содержимое недоступным, когда пользователь видит слишком много информации, он не будет знать где именно начать просмотр всего этого. Это самое главное для домашней страницы, на которой все новые пользователи окажутся в первую очередь.

Так предоставьте в этой части сайта основные данные:
1.Имя сайта,
2.Предложение значимости (то есть, какие выгоды они получат от его использования),
3.Навигация по основным частям сайта, которые важны для пользователя.

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

Делайте сайт удобным, не только для себя)
Приведу парочку примеров:AnyWayAnyDay
или fineandchic.com

3)Качество дизайна является показателем доверия

Были проведены некоторые исследования:
1. 1) Исследование доверия к веб-сайтам Станфорда-Маковски, 2002: Что делает сайт заслуживающим доверия
2. 2) Что делает сайт доверенным. Доклад по большому количественному исследованию
3. 3) Элементы компьютерного доверия

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

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

или


4)Пользователи концентрируются на лицах

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

Тепловая карта отслеживания взора при просмотре изображения с ребенком, который смотрит прямо на нас. Исследование сделано Usable World

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

5) Лучший цвет для ссылок это синий

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

Google всегда делает свои ссылки синими и на то есть причина: цвет знаком многим пользователем, из за чего ссылки легко обнаружить.

Какой цвет должны иметь ссылки? Первое соображение это контраст: ссылки должны быть достаточно темными (или светлыми) чтобы контрастировать с цветом фона. Следующее, они должны отличаться от остального текста на странице, так что не надо делать черные ссылки, когда сам текст на странице черный. И наконец, исследование показало (Van Schaik и Ling), что если вы ставите приоритет на юзабилити, то ссылки лучше делать синими. Цвет ссылок браузера по умолчанию это синий, так что люди ожидают увидеть именно этот цвет. Выбор другого цвета это не проблема, но пользователям потребуется больше времени на нахождение таких ссылок.

6) Свободное пространство улучшает понимание

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

Обратите внимание на широкую границу содержимого и разделение параграфов на сайте Psdtuts. Все это пространство делает содержимое простым и комфортным для чтения.
Свободное пространство тоже делает содержимое более читабельным. Исследование показало, что использование свободного пространства между параграфами и в левой и правой колонках повышает понимание на 20%. Макет веб-страницы (включая пробелы, заголовки и отступы) не может заметно повлиять на производительность, однако будет влиять на степень удовлетворенности пользователя.

7) Идеальное поле ввода поискового запроса должно быть 27 символов в ширину

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

Исследование показало, что в среднем поля ввода поискового запроса имеют ширину в 18 символов. Судя по данным, 27% поисковых запросов были слишком длинными и не поместились в них.
Расширение поля ввода поискового запроса до 27 символов в длину позволит поместить в нем 90% поисковых запросов. Помните, что вы можете ставить ширину не только в пикселях и пунктах, но также и в “em” (относительная единица длины, равная размеру текущего шрифта). Таким образом используйте эту величину для установки ширины поля ввода поискового запроса в 27 символов.

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

8) Информационные страницы о продукте помогут вам выделиться

Если ваш сайт имеет страницы продуктов, люди, которые будут покупать эти продукты, несомненно, просмотрят их. Но много страниц продуктов содержат недостаточно информации, даже если пользователи их лишь бегло просмотрят. Это серьезная проблема, потому что информация о продукте поможет людям принять решение о покупке. Исследование показало, что 8% проблем с удобством связано с недостаточной информацией о продуктах, что также вызывает 10% потерь клиентов (то есть пользователь просто покидает сайт).

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

9) Большинство пользователей не видит рекламу

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

Я на этот сайт захожу только ради уроков по photoshop (ищу что-то конкретное), и на рекламу не обращаю внимания вообще.

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

10) Пользовательское тестирование не должно быть обширным

Исследование Jakoba Nielsena на тему идеального числа тестирующих юзабилити сайта показало, что всего 5 тестирующих пользователей выявят почти 85% всех проблем на вашем сайте, в то время как 15 тестирующих выявят почти все проблемы.

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

З.Ы. Информация может показаться не новой, но она актуальная!