Слайдер-карусель очень часто используется на современных сайтах. Слайдеры выглядят красиво и стильно, привлекая взгляд пользователя, словно аттракционы взгляд прохожего.
Однако, использовать их следует с умом, поскольку они поглощают ресурсы — занимают много места на первом экране, приковывают к себе взгляд пользователя.
Если слайдер создается с учетом маркетинговых нюансов, он может стать полезным инструментом. Согласно исследованиям Беймардского института, больше половины топовых американских интернет-магазинов используют «карусели» на первом экране.
На практике выработались конкретные требования к слайдеру на сайте:
Грамотно настроенная авторотация слайдов
У интерактивных слайдеров конверсия в 3-5 раз выше, чем у статических. Динамический контент привлекает внимание. Мозг человека устроен таким образом, что движущиеся объекты вызывают у нас больший интерес. Вместе с тем такая броскость слайдера должна быть оправдана. Без мощных продающих моментов этот раздел превращается в «визуального вампира», отвлекающего пользователя от продающих триггеров и преимуществ, расположенных в других частях сайта.
При настройке авторотации слайдов следует учесть два нюанса:
а) Слайды не должны сменять друг друга слишком быстро. Иначе пользователь может просто не успевать считывать с них информацию. Конечно, скорость авторотации задается индивидуальными особенностями слайдера — сложностью использованных в нем текста и изображений. Однако, ведущая исследовательская компания в области пользовательского опыта Nielsen Norman Group дает общую рекомендацию:
На каждые 3 слова пользователю нужно дать 1 секунду.
То есть, если на экране использован состоящий из 9-10 слов заголовок, на его осмысление пользователю потребуется не менее 3 секунд.
Особенно неразумно было бы позволять быстро промелькивать слайдам со сложной информацией, характерной для наукоемких сфер. В качестве примера можем привести слайдер с разработанного нами сайта биотехнологической компании «НекстБио»:
б) Авторотация должна прекращаться, если пользователь навел курсор на определенный слайд. Согласно исследованиям, каждый третий веб-разработчик проигнорировал это нехитрое правило. А ведь пользователь так оказывается в идиотской ситуации. Заинтересовавший его слайд куда-то пропадает. Будет ли человек напрягаться и специально перелистывать обратно? Зависит от степени заинтересованности потенциального клиента. Однако, легкое раздражение такие ситуации неминуемо вызывают.
В общем, если гость навел курсор на слайд, нужно дать ему возможность нормально ознакомиться с предложением.
в) Перевод авторотации на ручной режим в случае активных действий пользователя. Если человек начал кликать по определенным слайдам и внимательно их изучать, значит его что-то заинтересовало. Авторотация должна отключиться, чтобы не сбивать человека с толку.
Оправданная последовательность появления слайдов
Юзабельная навигация
На первый взгляд может показаться преувеличением говорить о важности навигации на уровне отдельно взятого слайдера-карусели. Казалось бы, кликай и выбирай, чего тут думать. Однако, в коммерческой веб-разработке не бывает мелочей. Даже такой миниатюрный и неказистый веб-элемент, как ползунок, имеет вполне определенные навигационные задачи:
а) показывает, какой слайд в цепочке сейчас демонстрируется — например, на разработанном нами сайте дистрибьютора WD-40 точка-ползунок отображенного слайда выглядит ярче других:
б) позволяет переключиться на другой слайд — если вдруг человека заинтересовало ранее увиденное предложение;
в) помогает сориентироваться, сколько слайдов еще осталось — согласно исследованиям, это повышает вероятность ознакомления пользователя с большим количеством слайдов;
г) намекает, что сейчас авторотация начнется по второму кругу.
Очень часто параллельно с точками-ползунками используются стрелочки-ползунки, размещенные по бокам слайдов. Такое классическое решение реализовано на сайте, разработанном нами для компьютерной компании «Адвантикс»:
Адаптация под мобильные устройства
Следует отметить, что приведенные выше рекомендации в большей степени относятся к десктопам. Слайдеры на мобильных устройствах имеют свою специфику.
Во-первых, важно оптимизировать дизайн слайда под мобильные устройства. Когда разработанные для десктопа слайды показываются на маленьком экране смартфона, текст часто становится совершенно нечитабельным, мелким. А изображения теряют свою детализацию.
Во-вторых, необходимо наличие функции свайпинга, то есть перелистывания слайдов привычным для пользователей смартфонов жестом смахивания вместо использования традиционных ползунков — точек и стрелочек. Увы, каждый десятый разработчик это до сих пор игнорирует.
Слайдер-карусель — не панацея
Слайдер вовсе не обязательный элемент современного сайта. Нельзя добавлять его, просто беря пример с конкурентов. Продающий слайдер отличается от других тем, что он добавлен на сайт осознанно, для выполнения определенной задачи. За 9 лет работы нашего агентства мы разработали множество современных и эффективных сайтов, на которых слайдер-карусель не используется вовсе. На это есть веская причина:
Значимость первого экрана невозможно переоценить. Если пользователь им не заинтересовался, то он уходит на веб-ресурсы конкурентов. Поэтому, нужно трижды подумать, какой контент разместить на первом экране. И далеко не всегда добавление слайдера — оптимальное решение.
В интернете можно даже наткнуться на статьи, в которых слайдеры называются «убийцами конверсии». В то же время есть и веб-студии, которые ни одного сайта не делают без шикарной дизайнерской карусели. Мы в Marketing Up считаем такие подходы максималистскими и неэффективными. Слайдер-карусель — это инструмент, который одному сайту может сослужить добрую службу, а другому нет. Нужно смотреть каждый индивидуальный случай.
Среди минусов слайдеров можно упомянуть следующие факторы:
- они выглядят наиболее шикарно на больших экранах, да вот только последние годы активно увеличивается число посещений со смартфонов и планшетов;
- чрезмерное количество слайдов, согласно закону Хика, сбивает пользователя с толку избыточным выбором;
- слайдеры увеличивают время загрузки сайта, в то время как электронная коммерция все больше «ускоряется»;
- дублирующиеся заголовки и «закопанные» в картинках тексты могут негативно сказаться на поисковом продвижении;
- если пользователь кликнул по слайдеру, посмотрел раздел и вернулся, ему придется заново ориентироваться в слайдах, что плохо с точки зрения юзабилити;
- у многих слайдеры ассоциируются с рекламными баннерами, что заведомо формирует у них определенное отношение к контенту;
- согласно исследованиям, в большинстве случаев кликабельность слайдеров-каруселей сравнительно невысока.
Слайдер имеет смысл использовать, когда проявляет себя важнейший плюс этого формата — его способность повысить плотность контента на самом важном месте сайта. В качестве примера приведем слайдер, который мы разместили на сайте компании-арендодателя офисов:
Пользователь получает необходимую информацию по каждому офисному центру. Это расположение, стоимость и площадь имеющихся помещений. Отсюда же потенциальный клиент узнает о развитой инфраструктуре бизнес-центров — наличии переговорных, тренажерных залов, зон для отдыха. Слайдер емко передал всю суть предложения. Если человек заинтересован в аренде подобного офиса, он будет читать дальше.
Мы надеемся, что эта статья была для вас полезна. Если ваша компания нуждается в разработке нового веб-ресурса, мы рады будем посодействовать решению этой задачи. Наше обширное портфолио позволит вам удостовериться в компетенциях Marketing Up. Обращайтесь!
Комментарии