Top.Mail.Ru
ypx
INTENSIVE
Попробуй себя в UX/UI-дизайне UX/UI-дизайн бесплатно
7 дней
5 проектов в портфолио
проверка дз
banner-circle
INTENSIVE
Попробуй себя во Frontend разработке Frontend бесплатно
7 дней
1 полноценный проект
проверка дз
banner-circle
Как изображения помогают пользователям ориентироваться на сайтах?
Изображения — это мощное средство коммуникации и лучший способ устранения языкового барьера, поскольку визуальную информацию легко понимают и считывают все люди в мире. Мы запоминаем 80% того, что видим, и только 20% того, что читаем.
Веб-дизайн
3866

Картинка вместо тысячи слов


Представьте, что у вас есть интернет-магазин на русском языке. В разгар туризма в Россию приехали иностранцы и захотели купить в вашем магазине товары. Туристы говорят на разных языках и переделать русскоязычный сайт на языки всех стран и народов невозможно. Наш язык, в свою очередь, очень сложен для любого заграничного путешественника. Сможет ли турист без труда найти на вашем сайте нужный раздел, желаемый товар и оформить заказ? Да, сможет, но только при определенном условии…

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

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

Расскажите о товаре визуально


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





Видео также является эффективным средством демонстрации характеристики продукта. Например, с помощью видеоролика можно визуально показать свойства крема: «хорошо впитывается и увлажняет». Модель в видео может наносить продукт на лицо и демонстрировать действия продукта без использования текстовых описаний на каком-либо языке.




О чем именно говорят ваши фотографии?


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



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

Лучшим решением будет использовать не фотографии мебели, а иконки. Например, как сделано на сайте Первого мебельного или Hoff:





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

Оставьте пользователям визуальными подсказки


Посетителям сайта бывает сложно ориентироваться на странице с огромным количеством текста. Чтобы помочь пользователям быстрее найти нужную информацию можно использовать легко узнаваемые обозначения рядом с важными разделами описания товара. Например, на сайте S7 использованы маленькие значки (банковская карта, список с рейсами, чек-поинт, иконка вируса) в разделе «Покупка и Управление» для того, чтобы направить внимание пользователей на нужный раздел.





Преимущества изображений для веб-сайта


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

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


Заключение


Наиболее верным решением будет наличие нескольких версий сайта на самых используемых языках в мире (как минимум, версия сайта на английском языке). Любой сайт должен иметь четкие и подробные визуальные элементы и изображения, которые помогут покупателям найти и купить нужные им товары.
Понравилась статья? Сохраните её в своих соц. сетях!
обучайся с нами профессии
UX/UI-дизайнер
Подробнее о курсе
Читайте другие статьи
Цвет года 2023: особенности и использование в дизайне
Месяц назад институт цвета Pantone Color Institute назвал главным цветом 2023 года оттенок Viva Magenta. Разбираемся, почему именно этот насыщенный карминово-красный цвет был выбран экспертами и как использовать его в дизайне.
Веб-дизайн
15671
Модальное или немодальное окно: как выбрать?
В статье разбираемся что такое модальное и немодальное окно и в каких случаях их лучше всего использовать.
Веб-дизайн
31559
Гештальт-принципы в графическом и UI дизайне
Помимо знания основ композиции, теории цвета, типографики, дизайнеры должны разбираться в психологии человека. Это помогает управлять вниманием пользователя и упрощать восприятие информации. Гештальт-принципы именно об этом.
Веб-дизайн
30195
Получайте первыми свежие статьи из нашего блога прямо на вашу почту
Введите корректный e-mail
Никакого спама. Только ценные и полезные статьи для вас!