Написать нам







Создаем сочные сайты!
+7 (499) 649-30-72
Написать нам
Создание сайтов






СОЗДАНИЕ САЙТОВ У НАС — ЭТО КАЧЕСТВО И РАЗУМНАЯ ЦЕНА. УБЕДИТЕСЬ САМИ!

ЗВОНИТЕ:
+7 (495) 974-15-75

Все статьи

Экран и страница воспринимаются по-разному

19.03.2008

(Цитируется по тексту: Якоб Нильсен. F-паттерн при чтении web-страниц.— Юзабилити Бюллетень. Выпуск №13)

Тепловые карты, полученные при исследованиях направлений движения взглядов пользователей, посещавших страницы трех web-сайтов. Те области, на которых взгляд задерживался дольше, изображены на рисунке красным цветом; желтый цвет означает меньшую продолжительность взгляда, и, наконец, на области, изображенные синим цветом, пользователи почти не смотрели, а на области, отмеченные серым, не смотрели вовсе. http://www.useit.com/alertbox/f_reading_pattern_eyetracking.jpg

Как движутся взгляды пользователей при просмотре веб-страниц? Оказывается, траектория движения взгляда по странице напоминает букву F.

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

F означает быстро (fast). Именно так большинство посетителей вашей страницы просматривает ваш драгоценный контент. За считанные секунды взгляд пробегает по вашему сайту. При этом большинство совсем не собирается неторопливо читать строчку за строчкой, как, возможно, поступил бы школьник, если бы ему на глаза попался учебник литературы.

В проведенном «Nielsen Norman Group» исследовании eye tracking приняло участие 232 пользователя, просмотревших несколько тысяч веб-страниц. В результате было выявлено, что манера пользователей пробегать страницы глазами не меняется, когда они переходят от одного сайта к другому, и выполняют разные задачи. Эта преобладающая закономерность перемещения взгляда по странице своей формой напоминает букву F; в ней обязательно присутствуют три составляющие:

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

Далее взгляд перемещается чуть ниже по странице и снова двигается в горизонтальном направлении — но теперь уже не так далеко, как в первый раз. Это короткая «палочка» — вторая горизонтальная черта в букве F.

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

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

Эти тепловые карты наглядно показывают нам, как пользователи обычно читают три различные вида веб-страниц:

— статью в разделе «О нас» на сайте компании (крайний рисунок слева)

— страницу с описанием продукта на сайте электронной коммерции (в центре)

— результат выполнения поискового запроса в браузере (SERP; крайний рисунок справа)

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

На сайтах, посвященных электронной коммерции (иллюстрация в центре), вторая «черточка» буквы F опускается ниже, потому что пользователи разглядывают размещенную внизу иллюстрацию. Также несколько целеустремленных взглядов пользователей время от времени были направлены на правый верхний угол, где находилась информация о цене продукта и была размещена кнопка «Добавить в корзину».

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

Объяснение полученных результатов

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

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

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

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

Более тонкие методики сканирования

Наблюдать за картиной, возникающей на тепловой карте при медленном перемещении взгляда пользователя по странице,— чрезвычайно интересное занятие. Для каждой из просмотренных страниц возникает особенный «узор», кроме ярко выраженного F, который обсуждался раньше. Например, просмотр страницы становится более четким, и пользователи меньше блуждают взглядом по странице, когда они смотрят на числа и цены; неожиданные события имитируют появление контекстной рекламы. Мы также много узнали о том как пользователи смотрят на графические элементы сайта.

Множество материалов и исследований на эту тему было представлено на семинарах «Writing for the Web», прошедших в Лас-Вегасе, и конференции «User Experience 2007» в Барселоне.

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

 


Источник: Юзабилити Бюллетень

Ещё рекомендуем прочитать:

Чтобы реклама — работала…
Общение по «аське» — от условностей к принципам
Игры в ассоциации
Попробуйте считать на русском
Особенности российской интернет-грамматики

Внимание!
Цитирование авторских материалов допускается только при условии прямой гиперссылки на «Introweb.ru»!


К списку статей



+7 (495) 974-15-75