0%
8 (846) 379-00-00

Web-дизайн - Сообщения с тегом "сайт"

Интуитивно понятное добавление в корзину

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

кот.jpg

Значки на иконке корзины

На иконке корзины при добавлении продукта должен появиться значок количества товаров или сумма заказа. Так клиент поймет, что добавление прошло успешно.
Промежуточный итог нужен для следующих целей:
  • Пользователи могут сразу заметить, если произошла ошибка (например, добавлено больше или меньше товаров, чем нужно).
  • Удержание внимания пользователя.
  • Помогает пользователю представлять себе размер расходов и ориентироваться по своему бюджету.
1.jpg

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

Подтверждение добавления товара в корзину

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

d.jpg

Пример: сайт доставки пиццы при добавлении товара в корзину выдает выпадающее окно с данными заказа, не перекрывающее важную информацию основной страницы.

Кнопка «Добавить в корзину»

На некоторых сайтах пользователи случайно добавляют один и тот же продукт в корзину несколько раз, а при оформлении заказа удивляются, замечая дублирование. Это происходит по разным причинам:
  • Пользователи забывают, что добавили продукт в корзину, либо отвлекшись, либо из-за того, что слишком долго держали сайт открытым в браузере.
  • Если на сайте нет функции сравнения товаров, то посетители могут воспользоваться корзиной для сравнения, а после забыть удалить продукты-кандидаты.
  • Если пользователь находит нужный товар в разных разделах каталога, то может положить его в корзину несколько раз, забыв, что добавил его раньше.
  • Если при клике на кнопку «Добавить в корзину» визуально ничего не меняется, клиент подумает, что товар не сохранен, и снова кликнет по кнопке.
Что веб-дизайнер может сделать, чтобы повысить наглядность добавления в корзину? Измените вид кнопки «Добавить в корзину», поменяйте ее цвет, название на «Добавить еще» (или аналогичное), внутри кнопки может появиться галочка или другое интуитивно понятное графическое изображение. Важно, чтобы пользователь смог еще раз выбрать тот же товар, например, другого размера или расцветки, а для этого кнопка должна оставаться активной после первого заказа. Другой вариант – при повторном клике на кнопку «Добавить в корзину» происходит переход в корзину, где можно изменить количество заказанных товаров.

v.jpg

Пример: В интернет-магазине ozon.ru значок «Добавить в корзину» при заказе меняет цвет и название на «В корзине N шт. Перейти». При этом можно добавить тот же товар снова, для чего есть кнопка «+1 шт.»

Выводы
Не забывайте обеспечить грамотный отклик сайта на действия посетителей, а именно:
  • Появление количества и стоимости заказа на иконке корзины.
  • Всплывающее или выпадающее окно, показывающее, что товар добавлен в корзину.
  • Изменение названия и оформления кнопки «Добавить в корзину» (с возможностью добавить больше товара).

Культурные различия в сайтах разных стран

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

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

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

Сайт американской стоматологической клиники:

США1.jpeg

Сайт голландской стоматологической клиники:
нидерланды - копия.jpeg

     К тому же, США – это страна с ярко выраженной индивидуалистической культурой. Поэтому здесь на страницах сайтов вы вряд ли встретите большие компании людей (как в Японии, Китае и Корее). Скорее всего, вам с экрана будут улыбаться, подчеркивая свою неповторимость, отдельные личности.

     «Магия» цвета для каждой культуры тоже своя. Например, красный часто ассоциируется в США и Европе с агрессией, а в Китае считается, что этот цвет приносит удачу.

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

     Примеры китайских веб-сайтов:

Китай.jpeg


Китай1.jpeg


Китай11.jpeg


     Японские сайты
     Японские веб-сайты, как и китайские, выглядят пестрыми и загроможденными. Цвета зачастую конфликтуют между собой. Главные проблемы: перегруженность текстом, небольшие картинки, огромное количество столбцов и пунктов меню. Дело в том, что иероглифы содержат много информации. Всего несколькими символами можно написать целое предложение. К тому же, японцы любят изучать подробные характеристики товаров, так что перегруженность текстом – это настоящая болезнь японских сайтов.
     Плюс ко всему, в японском нет заглавных букв (иероглифов) и практически нет курсивов. Поэтому делать визуальные акценты с помощью текста практически невозможно.
Пестрые городские пейзажи Японии, обилие рекламы, переполненное пространство – все это перетекло из реальной жизни в Интернет.

     Примеры японских сайтов:

Япония1 - копия.jpeg


Япония11.jpeg


Япония0.jpeg


Япония111.jpeg


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

1.png


111.png

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

     Греческие сайты:

Греция!.jpeg


Грецияя.png


греция 1.jpeg


Греция11.jpeg
  Итак, мы с вами убедились, что есть реальные различия между сайтами разных стран. И если вы хотите продвигать свой бизнес на иностранной площадке, то перед разработкой и запуском сайта обязательно проведите исследование культурных, поведенческих и психологических особенностей вашей потенциальной аудитории.
Фото:
Появились вопросы?
Получить бесплатную консультацию