В этой статье из цикла юзабилити закрепим знания о том, как сделать удобный сайт на примере интернет-магазинов. Рассмотрим, какими должны быть основные элементы сайта в сфере e-commerce.
Теперь эти же аспекты, но подробнее.
Рассмотрим общие рекомендации ко всем страницам интернет-магазина.
SSL-сертификат — криптографический протокол безопасности. После установки на сайт доступно безопасное соединение HTTPS. Этот префикс отображается в строке браузера и свидетельствует о том, что данные, которые вводит пользователь, защищены от третьих лиц.
Установка SSL-сертификатов желательна для всех сайтов, так как это улучшает ранжирование в поисковой выдаче. Они также помогают защитить данные клиентов от перехвата, поэтому вдвойне рекомендуется устанавливать их на сайты интернет-магазинов.
Шапка — это верхняя область сайта, в которой отображаются основные разделы. А подвал — нижняя, содержащая дополнительную информацию (договор оферты, лицензии и свидетельства, иконки соцсетей и так далее). Эти области должны быть идентичными для всех страниц сайта.
Для интернет-магазина это имеет особое значение, так как в шапке закрепляются не только основные разделы, но и элементы, которые пользователи должны видеть везде: телефон, поиск, иконка корзины, личный кабинет.
Если магазин работает в нескольких городах, в шапке размещают метку с выбором региона (города):
В подвале интернет-магазина помещается юридическая информация, необходимая для работы интернет-магазина.
В подвале RU-CENTER даны ссылки на важные разделы сайта, соцсети, гарантийную информацию о защите прав пользователей. А также перечислены партнёры
В сфере e-commerce от коммуникации с клиентом и степени её проработанности зависит размер прибыли. Если покупатель не разобрался в вопросе и не смог связаться с консультантом, он пойдёт на тот сайт, где работает онлайн-чат или можно заказать обратный звонок. Если не предложить пользователю оставить свой email и не высылать на него акционные предложения и персональные скидки, покупательская активность на сайте будет ниже.
От общих параметров перейдём к тому, какие страницы должны быть в интернет-магазине и какими их стоит делать.
Попадая на главную страницу, пользователь должен сразу понимать, что продаётся в интернет-магазине и чем он отличается от других. Отличие помогает сформулировать УТП — уникальное торговое предложение, выделяющее ваш магазин в своей нише. Продемонстрируйте товары или расскажите о миссии магазина, чтобы зацепить потенциального покупателя, а заодно отсеять нецелевую аудиторию:
Так определяют уникальное предложение на сайте Invisible
Кроме понятности от главной страницы требуется заинтересовывать и побуждать к покупкам. Сделайте сайт визуально привлекательным и функциональным, чтобы добиться этого.
Также на сайт можно добавить яркие баннеры, рассказывающие об акциях и новинках, или продемонстрировать популярные товары:
Несколько баннеров на сайте L'Oréal Paris сменяют друг друга в слайдере
На главной странице рекомендуется выставлять и товары со скидками. Демонстрация выгоды привлекает покупателей.
Каталоги содержат перечень товаров с кратким описанием (название, фотография, цена) и кнопкой для покупки. Если товаров немного, каталог делают одностраничным.
Главное в таких каталогах — удобная навигация. Добавьте возможность сортировать товары по цене, названиям, статусам (новинка, хит и т. п.) и выбирать их количество на странице (оптимально 15–20 штук):
Если же ассортимент широкий, каталог стоит разбить на несколько разделов или даже добавить подразделы. Например, в интернет-магазинах одежды товары сначала разделены по адресату (мужская, женская, детская), а внутри уже разбиваются по типам одежды:
Пример сортировки товаров по каталогам в магазине Puma
Также мы рекомендуем использовать разделы с акционными, популярными, новыми товарами. В них собраны те же товары из других категорий, отфильтрованные по тому или иному признаку:
Гибкие фильтры позволят покупателю быстрее подобрать товары по интересующим его критериям. Перечислим основные рекомендации для этого инструмента:
Система фильтров на сайте Lamoda
Страницы товаров должны быть информативными и однотипными. Основные элементы страницы товаров:
Кроме этого, на страницу товара добавляют информацию о доставке, оценку пользователей и количество людей, интересовавшихся товаром; ярлыки (например, если товара нет в наличии и т. п.); возможность перейти к более развёрнутому описанию и похожие товары. Постарайтесь найти гармоничное сочетание подробности и минималистичности:
Корзина — это промежуточный этап между выбором товаров и оформлением заказа. Не загромождайте страницу лишними деталями. Эта страница должна содержать информацию о количестве выбранных товаров и сумме покупки. Перечислим рекомендации к этому элементу:
Размещайте иконку «Корзины» в правом верхнем углу сайта. Пользователи привыкли видеть её там, и отсутствие значка в привычном месте не оправдает их ожиданий.
Так устроена корзина на сайте «Читай-города». Раздел «Избранное» называется «Закладки»
Вы можете использовать механику «похожие предложения» и настроить подбор смежных товаров, которые отображаются на странице заказа. Также её можно использовать, если товара, который выбрал пользователь, нет в наличии. Так вы предложите ему релевантную замену. Основной принцип — выбирать действительно соотносимые товары, а не рандомные:
К кроссовкам на сайте Puma предлагаются релевантные товары (аксессуары для бега, носки). Парфюм вызывает вопросы, но, вероятно, это забота об имидже бегунов
Оформление заказа стоит продумать до мелочей и сделать максимально простым и удобным для пользователей. Ведь именно этот этап напрямую связан с получением прибыли.
Часто проблема связана с тем, что оформление заказа невозможно без регистрации или авторизации на сайте. Покупателям приходится тратить лишнее время и отвлекаться от конечной цели: оплатить покупку. Позаботьтесь о пользователях, которые не хотят регистрировать личный кабинет или торопятся.
Добавьте возможность быстрой регистрации или оплаты в один клик, чтобы упростить оформление заказа.
На сайте этого интернет-магазина покупателю предлагается авторизоваться или продолжить покупку как гость
Упрощённая форма регистрации должна содержать минимум полей (ФИО, телефон для связи, адрес доставки и email).
Другие обязательные элементы оформления заказа: выбор способа оплаты и доставки. Оба эти компонента должны содержать варианты, из которых покупатель сможет выбрать удобный для себя. Также стоит позаботиться о безопасности, прозрачности и открытости. Покупатель должен видеть, сколько стоит доставка, когда заказ придёт, и получать чек о транзакции.
Интернет-магазины предлагают такие варианты доставки, как самовывоз, постамат, курьерские и почтовые службы. Определите, как ваши клиенты будут получать заказы, и дайте им возможность выбрать удобный способ. Кратко прокомментируйте особенности каждого варианта, сроки, стоимость и не забудьте дать ссылку на подробное описание условий доставки.
Предоставьте несколько способов оплаты на выбор. Одним покупателям удобно оплачивать покупки банковской картой онлайн, а другие предпочтут расплатиться с курьером после получения товара.
Оплата онлайн должна быть конфиденциальной и безопасной. Удостоверьтесь, что транзакции защищены от злоумышленников.
Если оформление заказа происходит в несколько этапов, покупатель видит, на каком именно он находится и сколько их осталось до совершения покупки:
Заказ на сайте L’Oréal Paris оформляется в три этапа. Блок выше служит напоминанием, на случай если покупатель отвлечётся от оформления заказа
Настройте триггерное сообщение о завершении процедуры. Тогда после оформления заказа на email покупателя придёт сообщение о действиях на сайте. В сообщении укажите свои обязательства по транспортировке товара, сроки, необходимые действия для получения. Также это сообщение может содержать благодарность за покупку.
Исчерпывающее описание способов оплаты, доставки, гарантий потребителей стоит собрать в особый справочный раздел. Отдельно можно зафиксировать справочную информацию о работе интернет-магазина (помощь по работе с сайтом).
В этих справочных разделах пользователи смогут найти ответы, если у них возникнут дополнительные вопросы. Оформить разделы можно в виде простого перечня пунктов или раскрывающимися блоками вопросов-ответов. Главное — закрепите ссылки на эти страницы в подвале сайта.
На сайте Hoff справочная информация об оплате — в формате FAQ (часто задаваемых вопросов)
Страница «Контакты» на сайте интернет-магазина выполняет сразу две функции. Во-первых, информационную: вы сообщаете обо всех каналах связи с магазином. Во-вторых, контактоустанавливающую: покупатель видит, что вы не скрываетесь, а также может проверить, не фейковую ли информацию вы указали.
На этой странице рекомендуется размещать следующие данные:
На сайте SpaDream есть не только необходимая информация для связи, но и отмечаются адреса магазинов на карте
Личный кабинет на сайте предназначен для покупателей, которые планируют поддерживать длительные «отношения» с магазином. Например, в личном кабинете человек может один раз добавить адрес доставки или данные банковской карты, чтобы затем они «подтягивались» при оформлении заказа. Также там хранится информация обо всех заказах пользователя, его бонусах, статусах в программе лояльности и т. п.
Но новых пользователей, у которых нет опыта работы с вами, нужно убеждать в том, что регистрация на сайте выгодна. Расскажите о пользе от того, что клиент потратит время на регистрацию, или предложите ему бонусы к заказам. Другие рекомендации к Личному кабинету:
Регистрация на сайте М.Видео максимально упрощена: пользователю нужно ввести только телефон и полученный код
Программа лояльности — это система поощрений, которая стимулирует покупать больше и оставаться с компанией дольше. Чем больше покупательская активность клиента, тем больше вознаграждений (бонусов и привилегий) он получает. У компании при этом растёт оборот и прибыль.
Программы лояльности бывают разными: начисление бонусов, кешбэк, многоуровневая система скидок, скидки у партнёров и так далее. Чтобы система работала, нужно подбирать такую модель, которая будет привлекательна для ваших клиентов и выгодна бизнесу. Рассмотрим распространённые ошибки:
Пример многоуровневой программы лояльности (Клуба привилегий) интернет-магазина Kerastase
Размещайте на сайте актуальные новости интернет-магазина, информацию об акциях, изменении режима работы, коллаборациях, партнёрские материалы — всё, что показывает покупателям современную повестку дня. Если последние новости вашего магазина датированы 2018 годом, у пользователей может сложиться впечатление, что магазин заброшен и не работает.
На сайте Л’Этуаль отдельно выделены новости магазина и новости бренда
На странице «О компании» размещают историю бренда, делятся принципами и ценностями магазина, показывают «отцов-основателей» и т. п. Цель этого контента — показать, что за магазином стоят настоящие люди, которые творят историю, и таким образом создать почву для доверительных отношений.
Распространённые ошибки в рассказе о компании:
Консультационные услуги в областях организации и повышения эффективности бизнеса,привлечения финансирования в проекты,развития персонала, маркетинга и организации продаж, развития личностного потенциала сотрудников и владельцев бизнеса
– вот неполный перечень вопросов решаемых нашими сотрудниками. Подобнее...
Мы в соцсетях:
![]() |
![]() |