Как посетители просматривают страницы сайтов? Исследование команды Нильсена
Этот материал – отчет Якоба Нильсена и его команды «юзабилистов» об исследовании паттернов (моделей) просмотра сайтов посетителями. Исследование проводилось в 2006 году, но нам материал показался актуальным и в современных условиях. Во-первых, ссылки на него присутствуют в статьях, написанных и опубликованных совсем недавно, во-вторых, объектом исследования является человек, а он, в отличие от (веб) технологий, никак не может радикально измениться в течение каких-то шести лет.
Во время просмотра веб-страниц глаза пользователей «рисуют» букву F: сначала – верхнюю горизонтальную линию, затем – среднюю, короткую, потом – длинную вертикальную. F – первая буква английского слова fast, «быстро». Следуя такому паттерну, посетитель в течение нескольких секунд получает максимум информации о контенте страницы.
В исследовании приняли участие 232 пользователя. Они посетили тысячи сайтов. Модель просмотра контента, первого знакомства с ним, была принципиально единой для всех веб-страниц: глаза пользователей следовали линиям буквы F. Верхняя линия – чтение заголовков, просмотр верхней части блока с контентом. Средняя, менее длинная линия – дальнейшее знакомство (при сканировании страницы этой ее части уделяется меньше внимания, чем верхнему элементу, поэтому линия короче). Вертикальная линия – знакомство с левой частью, здесь пользователь может либо задержаться подольше, либо, наоборот, быстро просканировать контент.
Конечно, ознакомление со страницей не всегда проходит в три этапа. Иногда паттерн напоминает букву E – посетитель также просматривает нижнюю часть контентного блока. Другой вариант – просмотр по букве Г, быстрое сканирование верхней и левой частей. Но в общем и целом, лидирующим паттерном является F, хотя расстояние между верхней и средней линиями может быть различным.
Тепловые карты, движения глаз пользователей при просмотре трех различных страниц. Красные области привлекли больше всего внимания, желтые – немного меньше, синие были обделены им почти полностью. Серые области не вызвали регистрируемого интереса.
Тепловые карты составлены для трех типов страниц:
- страница «О компании» (слева)
- страница товара в интернет-магазине (посередине)
- страница с поисковой выдачей (справа)
Если прищуриться и сфокусироваться на красных пятнах, они сложатся в букву F. Конечно, некоторая разница в паттернах есть, но в общем и целом, очертания буквы F угадываются легко.
На странице товара из интернет-магазина, средняя линия паттерна F расположена ниже обычного, так как контентный блок содержит в себе фотографию, «прерывающую» текстовый поток. Кроме того, значительное внимание пользователей привлек правый верхний угол, где расположены цена и кнопка «В корзину».
На странице с поисковой выдачей средняя линия F длиннее, чем верхняя, так как заголовок в средней части блока длиннее, чем в верхней. Здесь пользователи проявили равнозначный интерес как к верхнему, так и к нижнему заголовкам, хотя обычно верхняя часть блока вызывает больше внимания.
О чем говорят нам результаты этого исследования?
- Пользователи не читают абсолютно все, что вы пишете на страницах своего сайта. Полное прочтение – редкий случай, особенно если речь идет о выборе товара в сети. Кто-то, конечно, проявит максимум внимания, но большинство – нет.
- Первые два абзаца должны содержать самую важную информацию. Есть надежда, что некоторые пользователи действительно прочтут их от и до, хотя больше внимания все равно будет уделено первому абзацу.
- Важную информацию выделяйте списками, подзаголовками. В ходе вертикального сканирования – вертикальная линия F – эти элементы привлекут внимание, спровоцируют более детальное изучение. Самые нагруженные смыслом и сутью всего пассажа слова ставьте на первое, второе места. Чем дальше в строчке стоит слово тем меньше у него шансов попасть в поле зрения посетителя.