Jake design studio -






   Jake Design    web-

Критерии оптимального веб дизайна (дизайн для пользователя)

Перевод статьи Criteria for optimal web design (designing for usability) by Michael L Bernard с сайта psychology.wichita.edu 

Как должна располагаться информация на типичном веб сайте

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

  • ясно написан (58%)
  • его легко можно просмотреть (47%)
  • написан с целью дать информацию, а не с целью промоушена (27%)

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

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

Пользователи привыкли смотреть на определенные области экрана, чтобы найти специфическую информацию (Bernard, 2001). Анализ ожиданий пользователей, того, где они ожидают специфические веб объекты на веб сайте, показал, что:

  • внутренние веб ссылки ожидались в верхней левой части окна браузера. (См. рис. 1)
  • внешние веб ссылки ожидались в правой части или в нижней левой части окна браузера (См. рис. 2)
  • ссылка  «назад, домой» ожидалась в верхнем левом углу и в нижней средней части окна браузера (См. рис. 3)
  • поиск по сайту ожидался в верхней средней части окна браузера (См. рис. 4)
  • рекламные баннеры ожидались сверху окна браузера (См. рис. 5)

В последующем исследовании (Bernard, 2002), в котором приняли участие веб пользователи, которые совершили хотя бы одну покупку он-лайн, выяснилось, что:

  • Кнопка логина/регистрации ожидалась в верхнем левом углу страницы (См. рис. 6)
  • Корзина покупателя ожидалась в верхнем правом углу веб страницы (См. рис. 7)
  • Кнопка «помощь» ожидалась в верхнем правом углу веб страницы (См. рис. 8)
  • Ссылки на специфические объекты покупки ожидались в левой верхне-средней области веб страницы (См. рис. 9)
  • Кнопка «Мой аккаунт/заказ» ожидалась в верхнем правом углу страницы (См. рис. 10)

Рисунки внизу показывают комбинированные ожидания расположения для десяти веб объектов.

Рис.1
Рис.2
 
Рис.3
Рис.4
Рис.5
Рис.6
Рис.7
Рис.8
Рис.9
Рис.10
 
Пользователи часто пропускают важную информацию просто потому, что она не видна. Это часто случается потому, что они забывают (или не желают) совершать прокрутку окна в определенном направлении (особенно горизонтально), и, таким образом, не видят информацию, которая расположена вне первичной зоны просмотра веб страницы. Чтобы уменьшить влияние этой проблемы в веб дизайне, важная информация на веб сайте, всегда должна умещаться внутри типичной области просмотра по горизонтали. Чтобы этому удовлетворять, правило, по-прежнему, таково, что необходимо делать веб дизайн для более низких разрешений экрана. В настоящий момент наиболее часто используется разрешение экрана 1024х768 (Согласно данным Spylog, в 2005 году разрешения экрана у пользователей было следующим:  1024x768 -  62% ; 1280x1024 - 19%; 800x600 - 12% . Примечание Jake Design).
 
 

Разрешение

Посетители

1024x768

62.0704%

1280x1024

18.8323%

800x600

12.3273%

Реальный размер для использования при дизайне веб сайта, чтобы избежать появления полос прокрутки, таким образом, 750х425 пискелей (безопасная ширина для печати при этом 700 пикселей). Большинство пользователей, при этом, имеют разрешение экрана 1024х768. Чтобы избежать скроллирования здесь, при дизайне веб сайта должен использоваться размер 970х620 пикселей. Компромиссным решением могло бы стать размещение наиболее важной информации в областях, которые видны и при более низком разрешении экрана, в то время как менее важная информация могла бы размещаться в областях, видимых при уже более высоких разрешениях.

Кроме этого, когда пользователи осуществляют прокрутку веб страницы, они могут не увидеть информацию, потому что она размещена в типичной низко-приоритетной с точки зрения информации области веб страницы. (Nielsen, 1999) или размещена в области, где обычно пользователи не ожидают ее увидеть.

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

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

Baker, Bernard и Riley (2002) не нашли статистически значимой разницы во времени, затраченной на поиск информации для ссылок с кратким содержанием, без него, и полнотекстовыми ссылками. Тем не менее, условия, когда при дизайне веб сайта ссылки содержат краткое содержание, воспринимались пользователями как визуально приятными, более понятными и вызывающими удовлетворение у пользователей сайта.

Представляя список ссылок при дизайне веб страницы лучше оформлять их в булет-списки. Например, как обсуждалось в Usability News, Spain сравнивал точность для трех условий ссылокв веб дизайне: булет-списки, расстояние между ссылками, без расстояния. Было обнаружено, что коэффициент точности следующий:

  • 100% для ссылок в виде булет-списков
  • 89% для ссылок с расстоянием
  • 67% для ссылок без расстояния

Все участники исследования предпочитали веб дизайн страниц, при котором ссылки были либо оформлены в булет-списки, либо имелись расстояния между ссылками, никто не предпочитал расположение ссылок без расстояния между ними (Spain, 1999). В поддержку этого факта, Parkinson, Sisson и Snowberry (1985) установили, что пункты меню с расстояниями находятся пользователями на 25% быстрее, чем меню без расстояний.

Software Usability Research Lab
Dept of Psychology
Wichita State University
Wichita, KS 67260-0034
 
 
Данный материал является переводом статьи Criteria for optimal web design (designing for usability) by Michael L Bernard с сайта Wichita State University's Psychology Homepage  

При любом использовании материалов сайта JAKE.RU, в том числе при публикации переводов статей, выполненных студией Jake Design, гиперссылка на JAKE.ru обязательна.



| | | | |
©2006. Jake Design