Куда и как смотрят посетители сайта

Прочитав нескольких интересных статей на тему проектирования веб-интерфейсов, я решил рассказать о базовом принципе при создании любого сайта, нацеленного на коммерческое использование или рекламу чего-либо, кого-либо. Запись "приправлена" небольшим исследованием и советом по SEO.

Выше линии сгиба

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

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

Ищем "линию сгиба"

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

Здесь на помощь приходит статистика , которая утверждает что подавляющее большинство пользователей по состоянию на январь 2013 года имеют разрешение экрана более 1024x768, а это означает, что среднестатистическая "линия сгиба" будет находиться на уровне 600-800 пикселей. Таким образом, в вашем распоряжении около 800 пикселей свободного HTML пространства, на котором рекомендуется размещать самый важный контент и компоненты. Но пока не совсем понятно почему именно здесь?

Внимание пользователей

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

Здесь важно учитывать то, как пользователи "тратят" свое внимание при просмотре страницы сайта, а именно ее скроллинге. Посмотрите на график, данные для которого были найдены в зарубежном исследовании.

Гистограмма внимания веб-пользователей

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

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

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

Исключение из правила или важность контента

Несмотря на то, что именно область "выше линии сгиба" отнимает большую часть внимания веб-пользователей, существует масса популярных сайтов, для которых проводились A/B тесты с расположением ключевой информации и элементов, и во многих случаях их размещение "ниже линии сгиба" увеличивало процент конверсий в разы. И это несмотря на то, еще в 1997 году эксперт в области юзабилити Якоб Нильсен доказал всему миру, что только 20% пользователей читают текст "ниже линии сгиба", а остальные 80% посетителей обращают свое внимание лишь на контент "выше линии сгиба". Это же подтверждает и гистограмма, приведенная ранее. Тогда почему вышеупомянутые сайты собирают больше конверсий в "непопулярной области"?

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

Выводы

  1. Ключевую информацию и компоненты рекомендуется размещать на уровне 600-800 пикселей, чтобы посетитель мог их увидеть без использования вертикального скролла сразу после загрузки страницы.
  2. Необходимо писать хорошие заголовки и текст, делать грамотные и аргументированные предложения/офферы, чтобы заинтересовать пользователей.

Выводы получились в стиле Кэпа, но некоторые забывают об этом в угоду дизайну.