Якоб Нильсен: Фотографии, как контент веб-страниц

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

Якоб Нильсен (Jakob Nielsen) – гуру и король юзабилити, по мнению части специалистов из сферы веб-разработок. Сам он себя называет адвокатом пользователей и старается максимально упростить своим подзащитным доступ к информации. Им было написано около десятка книг и зарегистрировано несколько десятков патентов на тему эффективного проектирования и юзабилити веб-сайтов.

Якоб Нильсен (Jakob Nielsen) – гуру и король юзабилити

В последнее время компания «Nielsen Norman Group», руководителем и соучредителем которой является Якоб Нильсен, активно использует в своих исследованиях технологию «Eye tracking» для изучения поведения пользователей на сайтах. Это позволяет сделать более детальную оценку эффективности и удобства сайта. В статье Нильсена «Photos as Web Content» пойдет речь о фотографиях.

«Eye tracking» позволил отследить отношение пользователей к фотографиям на сайтах. Можно сделать следующие выводы:

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

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

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

Ниже примеры из еye tracking-исследований, проводившихся в последнее время.

Фотографии людей – это хорошо (если это фото реальных людей).

Это уже можно назвать стандартом – размещение фото сотрудников компании, чтобы пользователи могли ее ассоциировать с реальными людьми в отличие от многочисленных безликих корпораций. На сайте FreshBooks.com используют эту рекомендацию в разделе «О нас»:

Якоб Нильсен: Фотографии, как контент веб-страниц

Несмотря на то, что высота страницы получилась 9 335 пикселей, пользователи прокручивали страницу почти до самого конца. Посетители потратили на 10% больше времени для просмотра фотографий, чем на чтение биографий, хотя биографии занимают на 316% большую площадь на странице. Очевидно, пользователи хотели сделать быстрый обзор команды FreshBooks, и просмотр фото позволяет сделать это действительно быстрее, чем чтение текста. Ключевым моментом является то, что это фотографии реальных людей, работающих в компании.

А вот стоковые фото общего характера полностью игнорируются:

Якоб Нильсен: Фотографии, как контент веб-страниц

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

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

Детальные фото товаров – это хорошо.

Сравните поведение пользователей на страницах двух интернет-магазинов: «Pottery Barn» и «Amazon.com»:

Якоб Нильсен: Фотографии, как контент веб-страниц

Якоб Нильсен: Фотографии, как контент веб-страниц

Страница Amazon здесь показана частично, только ее верхняя часть. По результатам исследований заметно насколько более интенсивно пользователи рассматривали фото-превью книжных полок в отличие от фото-превью плоских телевизоров. Для полной страницы Amazon (а не показанного на картинке фрагмента) только 18% потраченного пользователем времени было уделено фотографиям, в то время как текст получил 82% времени. В среднем каждый товар на Amazon получил 0,9 фиксаций взгляда на фотографии и 4,4 фиксаций взгляда на описании.

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

Это хороший пример того, почему не всегда хорошо копировать структуру крупных и известных сайтов. У Amazon чудовищно огромный ассортимент товаров. Они используют одинаковый шаблон страницы для всех категорий товаров, не адаптируя под каждую категорию отдельно. Pottery Barn имеет узкий специализированный ассортимент и его страницы созданы с учетом особенностей товара.

Большие фото – это хорошо (если открываются по запросу).

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

Еще в 2005 году Якоб Нильсен в своем списке «Топ-10 ошибок веб-дизайна» указал 10-ым пунктом «Недостаточное увеличение фотографий». То есть при клике на ссылку «показать увеличенное фото» пользователь должен получить картинку как минимум в 2 раза большую по размеру, а не увеличенную лишь на 20%. К сожалению, за эти годы данная ошибка не потеряла свою актуальность.

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

Якоб Нильсен: Фотографии, как контент веб-страниц

Это пример фотографии панели с сайта ExtremeTech.com. Здесь фотография уменьшена в месте со страницей на 50% от оригинала 714×868 пксл. Как видно пользователь оставил 12 фиксаций взгляда на фото.

Фото, несущие информацию – это хорошо.

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

Оцените эту запись блога:
Инфографика Франческо Франки
Инфографика аэропортов: единый международный станд...

Читайте также:

 

Комментарии

Нет созданных комментариев. Будь первым кто оставит комментарий.
Уже зарегистрированны? Войти на сайт
Гость
22.11.2017
Если вы хотите зарегистрироваться, пожалуйста заполните формы имени и имя пользователя.

Исторические фото