15 мая 2015, 11:16

Сайдбарная слепота

В далеком 1997 Якоб Нильсен в статье Why Advertising Doesn't Work on the Web впервые использовал термин «баннерная слепота» (banner blindness). Суть термина понятна — пользователи веб-сайтов концентрируют внимание на нужном им контенте и абстрагируются от рекламных блоков и баннеров, то есть попросту не замечают их.

Позже он написал статью Banner Blindness: Old and New Findings, основываясь на результатах айтрекинговых исследований. В ней наглядно подтверждаются основные постулаты материала десятилетней давности:

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

Аналогичные выводы я сделал, проводя анализ метрик проектов, над которыми работал лично. Этот эффект, по аналогии с термином Нильсена, я назвал «сайдбарная слепота».

Откуда взялись сайдбары

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

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

Если посмотреть на первые вебсайты, то мы увидим, что никаких сайдбаров на них не было. А вот начиная с нулевых годов использование сайдбара стало чем-то вроде необходимости.

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

О чем стоит знать дизайнерам

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

Тут у читателя могут появиться вопросы, например: «у нашей компании есть блог с замечательными статьями, которые очень нравятся клиентам. По-вашему, нужно оставить только сам текст статьи, и убрать из сайдбара форму подписки на рассылку? И кнопки “Поделиться”?» Убрать эту информацию из сайдбара — не значит вовсе убрать ее со страницы. В приведенном примере подписка на рассылку и возможность поделиться — это контекстные действия, которые подавляющее большинство пользователей совершит только после прочтения статьи. И тогда стоит задуматься, необходимо ли их располагать в сайдбаре, может быть правильнее их разместить под текст статьи?

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

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

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

Иначе так и будут создаваться сайты, в которых CTA-кнопка расположена в сайдбаре, например:

Мы начинаем двигаться в правильном направлении

Например, не так давно в Яндексе поняли, что рекламные ссылки в сайдбаре не дают столько прибыли, как должны, и перенесли рекламную выдачу из сайдбара в низ колонки органической выдачи, что увеличило количество кликов на рекламные объявления в 2,5 раза.

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

Мои любимые примеры — интернет-ресурсы, которые используют сайдбары в их первоначальном смысле (т. е. для контекстных комментариев к определенным абазцам), например Medium, сайт дизайн-бюро Артёма Горбунова или книга Magic Ink Брета Виктора.

Да и вообще, сравните Youtube и Vimeo. Какой из этих сайтов создан, чтобы получать удовольствие от просмотра видео?

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

Поделиться
Запинить