Каждый согласится, что юзабилити является важным аспектом веб-дизайна.

Если you’ работаем на портфель веб-сайта, интернет-магазина или веб-приложения, что делает ваш страниц легким и приятным для посетителей, чтобы использовать является ключевым.Многие исследования были проведены на протяжении многих лет на различных аспектах и ​​веб-дизайна интерфейса, а выводы являются ценными, чтобы помочь нам улучшить нашу работу.Вот 10 полезных выводов удобство и guidelines которые могут помочь вам улучшить пользовательский опыт на websites.

1.Форма этикетки лучше всего работают над Field

Исследование UX Matters обнаружила, что идеальное положение для меток в формах над полями.На многих формах, этикетках ставятся слева от поля, создавая двумя колонками, в то время как это выглядит хорошо, it’ с не самым простым в использовании схема.Почему это происходит?Поскольку формы, как правило, вертикально ориентированные, т.е. пользователей заполнить форму сверху bottom.Пользователи сканировать форму вниз, как они идут вместе.И после метки в поле ниже проще, чем найти поле справа от label.

Tumblr имеет простой и элегантной форме регистрации, которая придерживается UX Matter’ S recommendation.

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

2.Пользователям сконцентрироваться на Faces

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

Глаз слежения тепловую карту ребенка смотрит прямо на нас, от UsableWorld study.

А теперь ребенок смотрит на содержание.Обратите внимание на увеличениелюди, глядя на заголовок и text.

Here’ S глаз слежения study, который демонстрирует это.We’ Re инстинктивно обращается на лицах, но , если это лицо смотрит куда-то другие, чем у нас, we’ будем также искать в том, что direction.Воспользуйтесь этим явлением, привлекая ваше users’ внимание на наиболее важные части страницы или ad.

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

Различные исследования были проведены, чтобы выяснить, что влияет на people’ с восприятием website’ доверия с:

• Stanford-Makovsy Web Доверие Исследование 2002 года: Исследование Что делает веб-сайты Достоверные Today
• Что делает веб-сайта Достоверные?Отчет о большой количественный Study
• Элементы компьютерной Credibility
• Элементов, которые влияют Web Достоверность: первые результаты от самооценка исследования (Труды ACM CHI Конференции 2000 года по человеческому фактору в вычислительных системах, т.2, Нью-Йорк: ACM Press)

Мы don’ знаю, если Fever Приложение любой хороший, но гладкий интерфейс пользователя и веб-сайт произвести хорошее первое impression.

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

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

4.Большинство пользователей Not Scroll

Якоб Nielsen’ кабинете от того, сколько пользователей прокручивают (в Приоритет Web Usability) показало, что только 23% посетителей прокрутки на их первом посещении веб-сайта.Это означает, что 77% посетителей won’ T scroll; they’ будет просто просмотреть содержимое выше fold (т.е. область страницы, которая видна на экране без прокрутки вниз).What’ Более того, процент пользователей, которые прокрутки уменьшается с последующими визитами, и только 16% прокрутки на их второй визит.Эти данные подчеркивает, насколько важно, чтобы разместить ключевые контента на видном месте, особенно на посадку pages.

Это doesn’ означает, что вы должнызапихать все, что в верхней части страницы, просто, что вы должны сделать лучшее использование этой области.Давка его содержание будет просто сделать содержание недоступным, когда пользователь видит слишком много информации, они don’ знаю, с чего начать looking.

Basecamp делает большие использование пространства.Над раза (768 пикселей в высоту), он показывает большой скриншот, слоган, ценностное предложение, призыв к действию, список клиентов, видео и краткий список функций с images.

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

1. Название сайта,
2. Цена предложения на сайте (то есть, какую пользу они получат от его использования),
3. Навигация по основным разделам сайта, которые имеют отношение к user.

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

Для получения дополнительной информации, пожалуйста, посмотрите на статьи Развернув fold (ClickTale), Paging VS Scrolling (Wichita университет — SURL), Взрывные Миф о Fold (Коробки и стрелы).( Спасибо, Фред Leuck).

5.Синий лучший цвет для Links

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

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

Какого цвета должны быть ваши ссылки?Первым фактором является контраст: ссылки должны быть темными (или света) достаточно, чтобы контрастировать с цветом фона.Во-вторых, они должны выделяться по цвету от остального текста, так что, никаких черных связей с черным текстом.И, наконец, исследования показывают (ван Шейк и Линг), что если юзабилити, если ваш приоритет, придерживаясь синим ссылкам, тем лучше.Browser’ по умолчанию ссылкой цвет синий, так что люди ожидают его.Выбор другого цвета отнюдь не проблема, но это может повлиять на скорость, с которой пользователи считают it.

6.Идеально Box поиска 27-персонажи Wide

What’ с идеальной ширины окна поиска?Есть ли такая вещь?Jakob Nielsen провела исследование юзабилити на длину поисковых запросов на веб-сайте окна поиска (Приоритет Юзабилити Web).Оказывается, что большинство из today’ коробки с поиска слишком короткая.Проблема с короткой коробки является то, что, хотя вы можете ввести длинную запроса, только часть текста будет видно одновременно, что делает его трудно проверить или изменить то, что you’ ве typed.

Исследование показало, что среднее окно поиска 18-символы wide.Данные показали, что 27% запросов были слишком длинное и не помещается в нее. Расширение поле до 27 символов бы разместиться 90% queries.Помните, что вы можете установить ширину использованием EMS, а не только пиксели и точки.Один ЭМ ширина и высота одного “ m” характера (используя любой размер шрифта сайте установлен).Таким образом, использовать эту меру, чтобы масштабировать ширину поля ввода текста в 27-символы wide.

Google ‘ с окном поиска достаточно широким, чтобы разместить длинный sentences.

Apple ‘ с окном поиска является слишком коротким, отрезав запрос, “ Microsoft Office 2008.”

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

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров