Просто Studio
Главная » 2013 » Июль » 18 » 20 советов для веб-дизайнеров интернет-магазинов
20 советов для веб-дизайнеров интернет-магазинов
Бывает, что пользователь намерен что-то купить в интернете, ищет подходящий товар, даже находит его, например, с помощью Google, переходит на сайт продавца. И… сразу же, после первого взгляда на страницу, покидает ее быстрее спринтера-олимпийца. Или вот еще один пример: заинтересовавшись красивым сайтом, позиционирующим себя как шедевр современного дизайна и юзабилити, потенциальный покупатель, попав на страницы интернет-магазина, тратит уйму времени и терпения, но так и не доходит до логичного завершения процесса покупки и разочарованно уходит ни с чем.

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


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

1. Дайте пользователям широкие возможности подбора товара

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

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

2. Пользователи должны легко изменять свой выбор

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

3. Панель поиска должна быть легкодоступна

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

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

4. Информация об отсутствии товара на складе должна быть видимой и однозначной

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

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

5. Используйте качественные фотографии

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

6. Покупатель не должен искать корзину для покупок

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

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

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

7. Навигация по сайту должна быть простой и удобной

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

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

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

8. Не оставляйте информацию о стоимости доставки «на закуску»

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

9. Вопрос к каждому пикселю

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

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

10. Помните о поисковой оптимизации

Значение поисковой оптимизации (SEO) часто занижают веб-дизайнеры интернет-магазинов. Привлечь в магазин покупателя без оптимизации сайта можно лишь с помощью проплаченной рекламы.

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

11. Добавьте своему сайту индивидуальности

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

12. Добавьте на сайт кнопки социальных сервисов

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

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

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

13. Обеспечьте посетителю быстрое знакомство с продуктом

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

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

14. Добавьте форму подписки на новости магазина

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

15. Не загромождайте страницы продукта


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

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

Стоит также быть осторожным при добавлении на страницы продукта разделов «Вместе с этим товаром посмотрели» или «Купившие этот продукт также выбрали», несмотря на то, что это отличный способ заинтересовать покупателя в покупке дополнительных позиций. В этом вопросе можно зайти слишком далеко и создать беспорядок на странице.

16. Добавьте отзывы

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

17. Наглядно покажите возможные вариации продукта

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

Например, если вы предлагаете свитер красного цвета, то предоставьте изображение его именно в этом цвете. В дополнение к стандартным элементам можно использовать плитки с образцами цветовых вариантов и диаграмму размеров в виде выпадающего списка или кнопок выбора (радиокнопок).

18. Избегайте отвлекающих элементов на стадии завершения заказа

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

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

19. Сделайте кнопку «Добавить в корзину» заметной

Кроме того, что кнопка «Добавить в корзину» должна присутствовать на каждой странице интернет-магазина, она еще и должна быть заметной. Чем яснее, смелее и привлекательнее выглядит эта кнопка, тем выше шанс, что она будет использована.

20. Сделайте процесс обратной связи простым и понятным


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

Просмотров: 1307 / Познакомьтесь с другими публикациями: Новости и статьи