Advertisement
  1. Business
  2. BigCommerce

15+ Советов по дизайну от BigCommerce для лучших сайтов онлайн-коммерции

Scroll to top
Read Time: 10 min
This post is part of a series called How to Use BigCommerce to Make Your Online Store (Starter Guide).
How to Use a BigCommerce Theme to Design Your Online Store
BigCommerce vs Shopify: How to Choose the Best Online Store Software

() translation by (you can also view the original English article)

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

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

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

Is your online store optimized for salesIs your online store optimized for salesIs your online store optimized for sales
Оптимизирован ли дизайн вашего онлайн-магазина под продажи? (источник графики)

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

Из предыдущей статьи этой серии вы узнали, как установить тему-премиум BigCommerce и кастомизировать ее под свой онлайн-магазин.

В этой статье мы поделимся 15+ потрясающими советами о дизайне сайтов, которые помогут вам вывести свой магазин BigCommerce на новый уровень. Сделайте его не только привлекательным, но и превратите в эффективную машину конверсии.

15+ Советов по дизайну от BigCommerce: как создать потрясающий онлайн-магазин

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

1. Сохраняйте дизайн сайта BigCommerce простым и организованным

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

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

2. Сделайте ваш сайт BigCommerce легким для навигации

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

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

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

Modez BigCommerce themeModez BigCommerce themeModez BigCommerce theme
Тема BigCommerce the Modez включает опции интуитивного меню.

Ознакомьтесь с еще большим количеством тем BigCommerce на ThemeForest, которые мы включили с подборку лучших в 2017 году:

3. Максимально упростите возможность связаться с вами

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

"Austin Bazaar" - сайт на платформе BigCommerce хорошо делает это, разместив номер телефона на видном месте, и также указав часы работы:

Austin BazaarAustin BazaarAustin Bazaar
Сайт "Austin Bazaar" размещает свой номер телефона на видном месте.

4. Добавьте отзывы покупателей

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

"Josie Maran", еще один сайт на платформе BigCommerce, располагает обзоры товаров непосредственно под описаниями товаров, что добавляет весомости как магазину, так и конкретной продукции:

Josie MaranJosie MaranJosie Maran
Сайт "Josie Maran" и обзоры товаров от покупателей.

5. Используйте строку-поисковик

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

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

6. Добавьте изображения высокого качества

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

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

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

7. Упростите процесс оформления покупки

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

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

8. Оптимизируйте онлайн магазин под мобильные устройства

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

Воспользуйтесь встроееными функциями BigCommerce для шопинга и осуществления платежей с мобильных устройств. Так покупателям будет легче платить за ваши товары с помощью PayPal One Touch или Apple Pay, что повысит вашу конверсию до 12%.

BigCommerce mobile featuresBigCommerce mobile featuresBigCommerce mobile features
Извлеките выгоду из мобильных функций BigCommerce

9. Выбирайте отзывчивую тему BigCommerce

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

10. Добавьте быстрый просмотр товаров

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

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

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

Panthers sitePanthers sitePanthers site
Сайт "Carolina Panther" предлагает быстрый просмотр товара

11. Составьте список правил вашего онлайн-магазина

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

Решите эту проблему, разместив ссылки в главном меню, по которым они могут попасть на страницу, где четко описано, куда и как вы осуществляете доставку, какими компаниями вы пользуетесь, и как вы осуществляете возврат товара. Также подумайте о том, чтобы создать страницу с "Часто Задаваемыми Вопросами", на которой также будут предоставлены ответы на эти вопросы.

12. Указывайте затраты на доставку сразу

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

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

13. Последовательно используйте свой брендинг

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

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

Набор предложений для онлайн-рынка на Envato Market предлагает последовательный визуальный ряд во всех своих онлайн-магазинах.

Envato Marketplace eCommerce brandingEnvato Marketplace eCommerce brandingEnvato Marketplace eCommerce branding
Брендинг для онлайн-рынка на Envato Market

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

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

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

15. Помогите посетителям быстро отфильтровать товары

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

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

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

Узнайте больше об успешных онлайн-продажах товаров здесь:

16. Добавьте ярлыки и знаки качества в свой онлайн-магазин

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

Это покажет им, что вы проводите заказы с помощью надежных платежных систем, и информация из пластиковых карт посетителей не окажется в руках у хакеров или других криминальных элементов. Логотипы от хорошо известных брендов типа VeriSign, McAfee Secure, TrustE или Better Business Bureau, часто используются на сайтах электронной коммерции для повышения доверия. "Man Crates" размещают их внизу каждой страницы.

Man CratesMan CratesMan Crates
"Man Crates" размещают логотипы надежных сервисов внизу каждой страницы

17. Будьте лаконичны и конкретны в текстах на страницах продаж

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

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

Усовершенствуйте дизайн вашего магазина BigCommerce  с помощью наших советов

Замечательный дизайн BigCommercе жизненно важен для того, чтобы посетителей сайта превратить в покупателей. Он помогает вам зарекомендовать свой бренд и добиться доверия. Он также поможет покупателям получить удовольствие от нахождения на вашем сайте. Воспользуйтесь советами по дизайну BigCommerce вверху, чтобы усовершенствовать свой онлайн-магазин и ознакомьтесь с нашей подборкой тем BigCommerce, если вы еще только начинаете создание онлайн-магазина. Удачи!

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Business tutorials. Never miss out on learning about the next big thing.
Advertisement
One subscription. Unlimited Downloads.
Get unlimited downloads