Уважаемые читатели!
Сегодня я хочу рассказать, как не только не напугать, но и зацепить пользователей, впервые пришедших на ваш сайт. Речь пойдет о баннере на Главной странице магазина, его юзабилити и функции.
Основной вопрос: Нужен ли баннер на Главной?
Пример из жизни:
На рынке много-много торговых палаток, и рядом находятся 2 мясных магазина.
На одном написано: Мясо.
На втором же, написано, что в магазине всегда свежее мясо птицы, свинина и говядина.
Пока что, не заходя в них, вы можете сказать о первом то, что там продают какое-то мясо, а о втором то, что там продают различные виды мяса, в частности, то, что нужно именно вам, говядина, да еще и свежая.
Да, может в первом магазине тоже была свежая говядина, но эту информацию владельцы магазина не захотели показать покупателям. А во втором она была наглядно представлена, и вам, как покупателю, она оказалась полезной.
Баннер на Главной является составляющей витрины, которая показывает пользователям, что вы готовы им предложить. Таким образом, баннер на главной , однозначно, нужен с точки зрения маркетинга.
Баннер должен содержать больше графической информации, чем текстовой, т.к. пользователи ее воспринимают легче, пример, как делать не надо, можно посмотреть на сайте интернет-магазина Королева Спорта:
где в качестве рекламного баннера используется текстовый блок, который абсолютно не читается.
Только одни картинки тоже не воспринимаются, поскольку могут быть восприняты неоднозначно или вызовут множество вопросов.
Пример хорошего исполнения баннера, я бы сказал, как надо делать, можно посмотреть на сайте activizm.ru:
Каких размеров должен быть баннер с точки зрения юзабилити?
Рекомендуется делать баннер шириной и высотой таким, чтобы его без проблем могли просмотреть в полном разрешении экрана своего устройства не менее 75%-80% ваших посетителей.
Помните, большой баннер оставляет важную для посетителей информацию за пределами первого экрана (первый экран-это та область сайта, которая просматривается без прокрутки страницы вниз и вправо):
Какое дизайн решение использовать?
Цветовая гамма и используемые шрифты должны соответствовать тематике и общему стилю сайта.
Не рекомендуется делать слишком большое описание в баннере, поскольку тексты, особенно длинные, не читаются. Старайтесь ограничиться парой слов крупного шрифта, чтобы пользователь боковым зрением зацепил информацию, целиком «проглотил» и остановился взглядом на ней.
Не используйте пестрящие красные тона, их излишек воспринимается как сплошная реклама и отсеивается, вступает в силу такой эффект как баннерная слепота:
Баннерная слепота — психологическая оптическая иллюзия, благодаря которой пользователь сайта не замечает рекламные блоки (баннеры) или объекты, похожие на них.(Википедия)
Каким должен быть баннер статическим, flash баннер или сделанный с помощью яваскриптовых фреймворков?
Немного поясню, что это означает:
Статический баннер: просто картинка-никуда не двигается, ничего не делает.
Преимущество: простота, дешевизна и быстрая загрузка.
Недостатки: полностью исключается способность человеческого глаза улавливать движение, что снижает степень вовлеченности пользователя
Flash баннер — это баннер, организованный с помощью flash-технологии, т.е. анимация.
Преимущество: красочная анимация, любые эффекты с изображениями, вплоть до внедрения мультфильма.
Недостатки: дорогое производство, невозможность просмотреть с мобильных устройств, большое время загрузки, первый кадр появляется только после полной загрузки ролика.
Баннер на основе яваскриптовых фреймворков (Javascript фреймворков) — это последовательность статических баннеров, связанных стандартными переходами с заданным временем перелистывания.
Это средний вариант по тем показателям, что я рассматривал ранее.
Какую информацию использовать на баннере?
Здесь вы должны разместить все то, что вы хотели бы показать вашему покупателю: хотите показать, чем вы лучше других, так разместите в баннере преимущества покупки именно у вас, как например это реализовано на сайте http://moscross.ru/:
У вас есть товары «локомотивы» — расположите их в этом баннере. Практически во всех интернет-магазинах есть акции, расскажите в баннере о них.
Как не надо делать:
Как надо делать:
Просто разместите обычные информационные баннеры. Но здесь не нужно забывать о том, что этот баннер должен предоставлять пользователям варианты дальнейших действий, а именно, прикрепите ссылку для перехода в раздел с группой товаров или к конкретному товару.
Как не надо делать можно посмотреть на сайте http://slalomshop.ru/:
Несколько переключающихся баннеров рассказывают о различных товарах, но баннеры не кликабельны и ни предоставляют пользователю дальнейших действий, а искать товар, представленный на баннере, по каталогу будет не больше 2 покупателей из 100 (самые-самые горячие покупатели).
Внимание! Уделите должное внимание тестированию баннера. В идеале следует провести А/В тестирование баннера на сайте, оценивая эффективность с помощью статистики. Однако есть и более экономный вариант тестирования-покажите этот баннер своим друзьям или знакомым, поскольку ваш взгляд «замылен», и вы не можете в полной мере оценить, эффективен ли баннер.
Вот мы определились с четвертой ошибкой в юзабилити главной страницы. В следующей статье, которая появится в течение 3-х дней, мы узнаем:
Как должна выглядеть витрина с товаром?
Продолжение следует…
Высоких Вам конверсий и продаж!
Возникли проблемы с созданием витрины, пишите, подскажу.
