Неужели, неужели «карусели» устарели?

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

Главные недостатки использования слайдеров

Многие сайты (18 из 30, согласно анализу Harrison Jones), использующие слайдеры в верхней части первого экрана, сталкиваются со сложностями двух типов: SEO и юзабилити.

К проблемам в сфере SEO множество аналитиков относят:

1. Применение Flash.

   Тысячи публикаций и обзоров посвящены данному вопросу. Уже вполне очевидно для всех, что flash-объекты должны быть полностью упразднены. Однако кое-кто продолжает пренебрегать этим, и все же попадаются в сети слайдеры с flash-анимацией на баннерах. Кратко и в последний раз о главной причине их бесполезности — недоступность для поисковиков и невозможность воспроизведения на большом количестве устройств (iOS, MacOS).

2. Скорость загрузки.

   Если функционирование слайдера снижает скорость загрузки всей страницы, то есть ли смысл в его применении? Каждая лишняя секунда снижает поведенческие факторы, а значит и позиции в выдаче и UX.

3. Контент.

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

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

1. Низкий CTR.

   Карусели используют практически во всех сегментах интернет-маркетинга (B2B, B2C). Независимо от типа сайта, имеем приблизительно следующую картину кликабельности:

   

   * По данным http://searchengineland.com/homepage-sliders-are-bad-for-seo-usability

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

2. Необходимость скроллинга в поисках полезного контента.

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

3. Чрезмерный акцент.

   Одной из самых больших проблем юзабилити слайдеров является «эффект мегафона». Баннер на слайдере почти всегда привлекает внимание динамичностью и обилием ярких картинок. "Эффект мегафона" проявляется именно в этом — как будто кто-то крикнул посетителю в громкоговоритель: «Смотри сюда!». И посетитель смотрит, думает, решает. При этом ничего не указывает на то, что основная информация, которая нужна посетителю, расположена уже под слайдером. Тепловые карты сайтов со слайдерами показывают, что основная активность приходится на меню и навигационные элементы.

4. Комментарий AskUsers: Важно понимать, что карусель должна привлекать внимание, но не полностью перетягивать его на себя, как бы ограничивая и парализуя дальнейшие действия посетителя. Закажите юзабилити-тестирование в сервисе AskUsers.

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

10 обязательных критериев, которым должен соответствовать хороший слайдер

Все описанные выше проблемы и сложности в основном возникают из-за того, что карусель не соответствует базовым принципам юзабилити, что влечет формирование негативного User eXperience (UX).

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

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

2. Карусель ни в коем случае не должна быть единственным доступом к продукту или каким-либо разделам сайта и предложениям.

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

4. Одно из самых частых нарушений – время показа слайда. Выбирайте умеренный темп смены слайдера. В среднем, для слайда с одним стандартным заголовком требуется около 5-ти секунд. Если на слайде размещено больше текстовой информации, то следует время показа корректировать индивидуально. Приблизительная формула – 1 дополнительная секунда на каждые 3 слова.

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

6. Остановка авторотации требуется при нажатии на любой из элементов управления слайдером.

7. Используйте крупные стрелки, кнопки и изображения, позволяющие посетителю понять, какой из слайдов является текущим для удобства перемещения вперед и назад.

8. На мобильных и сенсорных устройствах не применяйте автоматическую ротацию, так как там невозможно выполнение принципов № 5 и № 6 из-за отсутствия курсора.

9. Максимально поддерживайте свайпы и перелистывания в сочетании с другими элементами управления.

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

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

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

Классический пример такого решения — результаты проведенного компанией Clarks еще в 2015 году А/В-тестирования. В ходе исследования посетителям предлагался один из двух вариантов сайта:

Версия А с использованием карусели

Версия В с тремя статичными слайдами в качестве отдельных блоков

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

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