Eyetrack III: Как выглядят новостные сайты глазами читателей

Архив

Новостные веб-сайты существуют уже около десяти лет, и редакторы и дизайнеры до сих пор задаются многими вопросами без ответов: эффективен ли макет домашней страницы? … Какое влияние оказывают рекламные объявления на главной странице по сравнению с заголовками? … Когда уместны мультимедиа? … Размещается ли реклама там, где ее увидит аудитория?

Исследование Eyetrack III, опубликованное Институт Пойнтера , Центр журналистики и новых медиа Эстлоу , а также Инструменты для глаз может помочь ответить на эти и другие вопросы. Подобные исследования с отслеживанием движения глаз не дадут ответа на эти вопросы. Но в сочетании с другими метриками сайта, уже используемыми менеджерами новостных сайтов — тестированием удобства использования, фокус-группами, анализом журналов — результаты Eyetrack III могут дать некоторое направление для улучшения новостных сайтов.

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

Кроме того, краткий комментарий о том, чем является это исследование, а чем не является: является предварительное исследование 46 человек, проведенное в Сан-Франциско. это нет исчерпывающее исследование, которое мы можем экстраполировать на большую популяцию. Это смесь «выводов», основанных на контролируемых переменных, и «наблюдений», когда тестирование не контролировалось так жестко. Исследователи пошли «широко», а не «глубоко», охватив множество вопросов с точки зрения дизайна веб-сайта и мультимедийных факторов. Мы надеемся, что Eyetrack III будет рассматриваться не как самоцель, а скорее как начало разговора, который пойдет на пользу новостной индустрии.

В основе: макет главной страницы

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

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

Теперь рассмотрим еще одно наблюдение Eyetrack: доминирующие заголовки чаще всего первыми привлекают внимание при входе на страницу — особенно когда они находятся в верхнем левом углу и чаще всего (но не всегда) в верхнем правом. Фотографии, вопреки тому, что вы могли бы ожидать (и вопреки выводам исследования Poynter 1990 года по отслеживанию движения глаз в печатных газетах), обычно не являются точкой входа на домашнюю страницу. Правила текста на экране ПК — как по порядку просмотра, так и по общему времени просмотра.

Краткий обзор 25 крупных новостных сайтов — вот их список — показывает, что 20 из них размещают доминирующее изображение главной страницы в левом верхнем углу. (Большинство новостных сайтов имеют одинаковый дизайн страниц изо дня в день; они не часто меняют макет, как печатная газета.)

Мы заметили, что на домашних страницах новостей читатели инстинктивно сначала смотрят на флаг/логотип и верхние заголовки в левом верхнем углу. На приведенном ниже рисунке показаны важные зоны, которые мы сформулировали на основе данных Eyetrack. Хотя каждый сайт уникален, вы можете посмотреть на свой собственный сайт и посмотреть, какой контент у вас есть в каких зонах.

[ Узнайте больше о том, что Eyetrack III говорит о макете домашней страницы здесь . ]

Хотите, чтобы люди читали, а не сканировали? Рассмотрим мелкий шрифт

Исследователи Eyetrack III обнаружили кое-что важное при тестировании размера заголовка и шрифта на домашних страницах: меньший шрифт способствует целенаправленному просмотру (то есть чтению слов), а более крупный шрифт способствует сканированию. В целом наше тестирование показало, что люди тратили больше времени на мелкий шрифт, чем на крупный. Более крупный шрифт привел к большему сканированию страницы — в целом было зациклено меньше слов — поскольку люди искали слова или фразы, которые привлекли их внимание.

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

(Примечание: мы не призываем вас исчерпать и уменьшить размер вашего шрифта по всем направлениям. Вы должны убедиться, что люди могут прочитать размер шрифта, который вы используете.)

Особенно интересно было поведение людей, когда на главных страницах использовались заголовки и аннотации. Участники теста Eyetrack III, как правило, просматривали и заголовок, и аннотацию, когда заголовок был выделен жирным шрифтом и имел тот же размер, что и текст аннотации, и находился непосредственно перед аннотацией в той же строке.

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

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

Подчеркнутые заголовки отговаривали тестировщиков от просмотра рекламных объявлений на главной странице:

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

Когда мы смотрим на новостные веб-сайты, мы обнаруживаем, что подавляющее большинство из них (22 из 25) используют аннотации к заголовкам на своих домашних страницах. Редкие из них используют только заголовки: CNN.com , NYPost.com , а также ProJo.com . Что касается размера заголовков, мы наблюдали примерно равное разделение между использованием более крупного размера шрифта для заголовков и более мелкого шрифта.

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

[ Узнайте больше о том, что Eyetrack III говорит о шрифте и аннотациях здесь а также здесь . ]

Частичный просмотр заголовков, аннотаций оказался обычным явлением

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

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

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

Для заголовков — особенно длинных — может показаться, что первые несколько слов должны действительно привлекать внимание, если вы хотите привлечь внимание.

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

На 25 новостных веб-сайтах, которые мы рассмотрели, рекламные объявления весьма разнообразны. Средняя длина аннотации варьируется от 10 слов до 25, при этом на большинстве сайтов она составляет около 17 слов.

[ Узнайте больше о том, что Eyetrack III говорит о рекламе здесь . ]

Что создает «горячие точки»?

В Eyetrack III мы протестировали несколько дизайнов домашних страниц, наблюдая за тем, куда на странице смотрели люди. Как и следовало ожидать, нижние части страницы — особенно области, которые нужно прокручивать для просмотра, — просматриваются скромно. Но это не значит, что вы не можете заставить людей смотреть на контент внизу прокручиваемой страницы.

На нескольких наших тестовых домашних страницах мы обнаружили «горячие точки» для некоторых историй. Возможно, из-за того, что наше тестирование проходило в Сан-Франциско, испытуемых привлекла одна история о сайте «Список Крейга» (местное онлайн-сообщество, популярное с момента его создания в 1995 году). Заголовок для этой истории имел чрезмерное количество фиксаций глаз по сравнению с окружающим содержанием, даже несмотря на то, что он был ниже первого видимого экрана страницы. Мы наблюдали такое же большое количество фиксаций взгляда на заголовке о производителе одежды FCUK, который был размещен далеко внизу страницы с длинным списком заголовков и аннотаций.

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

[ Узнайте больше о том, что Eyetrack III говорит о дизайне домашней страницы здесь а также здесь . ]

Где твоя навигация?

При тестировании нескольких дизайнов домашних страниц мы варьировали размещение элемента навигации: вверху (под флагом или логотипом), в левой и правой колонке.

Навигация, размещенная в верхней части главной страницы, работала лучше всего — то есть ее видел самый высокий процент испытуемых и она просматривалась дольше всего. Изучив 25 самых популярных новостных сайтов, мы обнаружили, что 11 из них используют навигацию по верхним позициям. Остальные 14 использовали левую навигацию. Семь из 25 использовали левые и верхние элементы навигации. Ни один из 25 исследованных нами сайтов не использовал правостороннюю навигацию. Редко, но вы можете найти правильную навигацию в мире новостных сайтов.

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

[ Узнайте больше о том, что Eyetrack III говорит о навигации здесь . ]

Как насчет макета статьи, стиля письма?

Результаты Eyetrack III показывают, что различные характеристики написания и макета статьи могут влиять на поведение читателя при просмотре.

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

Более короткие абзацы показали лучшие результаты в исследовании Eyetrack III, чем более длинные. Наши данные показали, что истории с короткими абзацами привлекают в два раза больше внимания, чем истории с более длинными абзацами. Более длинный формат абзаца, кажется, препятствует просмотру.

На большинстве страниц статей новостных веб-сайтов истории представлены в одной текстовой колонке, но на некоторых сайтах, таких как iht.com а также TheHerald.co.uk — имитировать макет газеты и представлять статьи в двух или трех столбцах рядом друг с другом. Является ли он таким же удобочитаемым, как традиционный (для Интернета) формат статьи в одну колонку?

Результаты Eyetrack III показали, что стандартный формат с одной колонкой работает лучше с точки зрения количества фиксаций глаз — другими словами, люди просматривают больше. Однако имейте в виду, что привычка могла повлиять на этот результат. Поскольку большинство людей привыкли к веб-статьям в одну колонку, удивление при виде трехколоночного текста могло повлиять на поведение их глаз.

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

Наконец, есть использование сводных описаний (расширенных заголовков длиной в абзац), ведущих к статьям. Они пользовались популярностью у наших участников. Когда наши тестировщики столкнулись со статьей, вступительный абзац которой выделен жирным шрифтом, 95 % из них просмотрели ее полностью или частично.

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

Чуть более 20 процентов ведущих новостных веб-сайтов регулярно используют краткие абзацы со статьями.

[ Узнайте больше о том, что Eyetrack III говорит о макете статьи здесь . ]

Первое, что мы заметили, это то, что люди часто игнорируют рекламу, но место размещения имеет значение. Когда они смотрят на рекламу, обычно это занимает от 0,5 до 1,5 секунд. Хорошее размещение и правильный формат могут улучшить эти показатели.

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

Непосредственная близость к популярному редакционному контенту действительно помогла увидеть рекламу. Мы заметили, что когда реклама была отделена от редакционных материалов либо пробелом, либо правилом, реклама получала меньше фиксаций, чем когда такого барьера не было. Объявления рядом с заголовками верхней части страницы показали хорошие результаты. Баннерная реклама над флагом на главной странице не привлекала столько внимания, как реклама под флагом и над редакционным контентом.

Текстовые объявления просматривались наиболее внимательно из всех типов, которые мы тестировали. На наших тестовых страницах текстовые объявления в среднем просматривались почти 7 секунд; лучшая медийная реклама в среднем длилась всего 1,6 секунды.

Размер имеет значение. Большие объявления имели больше шансов быть замеченными. Небольшие объявления в правой части главных страниц обычно видели только треть наших тестировщиков; остальные ни разу не бросили на них глаз. На страницах статей наши испытуемые чаще всего просматривали рекламу на полстраницы. Тем не менее, их видели только в 38 процентах случаев; большинство людей никогда не смотрели на них. Рекламные статьи, которые видели больше всего, были вставлены в текст статьи. Объявления «небоскреб» (тонкие вертикали в левой или правой колонке) оказались на третьем месте.

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

[ Узнайте больше о том, что Eyetrack III говорит о рекламе здесь . ]

Большие онлайн-изображения удерживают взгляд дольше, чем изображения меньшего размера.

Домашние страницы новостей обычно используют шаблоны, многие из которых используют заданный размер основного изображения. Хотя ценность использования дизайна на основе шаблонов может (и должна) обсуждаться, то, что мы узнали о размере фотографий в Eyetrack III, может быть полезно для тех, кто задается вопросом, сколько места оставить для изображений.

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

На одной из наших тестовых страниц была фотография размером с почтовую марку, которую просмотрели 10 процентов наших участников. Сравните это с фотографией среднего размера (около 230 пикселей в ширину и в глубину), которая привлекла внимание примерно 70 процентов пользователей.

Мы обнаружили, что изображения размером не менее 210 x 230 пикселей были просмотрены более чем половиной тестировщиков. Наше исследование также показывает, что чистые, четкие лица на изображениях привлекают больше внимания на домашних страницах.

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

Изучив 25 новостных веб-сайтов, мы обнаружили, что около 20% из них постоянно используют маленькие изображения на своих главных страницах. Четыре из пяти сайтов обычно размещают главную фотографию главной страницы в левом верхнем углу.

И вот интересный факт исследования: мы заметили, что люди часто нажимают на фотографии — хотя на наших тестовых страницах они ни к чему не приводили (и действительно, нажатие на фотографии ничего не дает на многих настоящих новостных сайтах).

[ Узнайте больше о том, что Eyetrack III говорит об изображениях здесь . ]

Текст для фактов; мультимедийная графика для незнакомых концепций

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

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

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

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

[ Узнайте больше о том, что Eyetrack III говорит о понимании мультимедиа здесь , и читать дополнительные общие мультимедийные наблюдения здесь . ]

Мы рассмотрели некоторые из основных моментов в этой статье, но их гораздо больше, поэтому, пожалуйста, потратьте немного времени. исследовать здесь для большего.

Элизабет Карр оказала помощь в подготовке этой статьи.