Изображения на сайте: прямой контакт с пользователем

Изображения на сайте: прямой контакт с пользователем

На основе материала 10 Things to Know About Images in Web Design

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

Люди предпочитают изображения, а не текст

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

Картинки привлекают внимание и вызывают эмоции

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

Логотип – отличный ориентир для посетителя

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

Большие изображения «над разворотом» и их количество

Согласно исследованиям команды Якоба Нильсена, в 2010 году пользователи 80% времени тратили на просмотр информации над разворотом, и лишь 20% – на все остальное. Картинки дают много преимуществ, однако не стоит переоценивать их значимость. Пространство, находящееся «над разворотом», т.е. та часть страницы, которую пользователи могут просматривать без прокрутки, является наиболее важной для вашего сайта. Это не связано с тем, что люди не желают прокручивать страницу. Просто область «над разворотом» – первое, что видят посетители при открытии сайта, поэтому нужно использовать ее с умом. Дайте людям причину заглянуть и «под разворот», проскроллить страницу. Если для этого необходимы большие изображения – используйте их. Но обязательно убедитесь в том, что они не вытесняют более важный контент вниз.

Осмысленные изображения

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

Фотографии людей

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

Фоновые изображения и атмосфера

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

Изображение – не баннер

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

Маркировка кликабельных изображений

Ссылки за картинками – распространенное явление. Это, в общем, неплохая практика, так как изображения имеют большие шансы привлечь внимание и, к тому же, они крупнее, по ним проще кликать. Но каждое кликабельное изображение следует обозначать, чтобы посетитель видел возможное действие (клик).Текстовые ссылки не нуждаются в таких подсказках.

Картинки и скорость работы сайта

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

Автор: Vyacheslav Vityuk

Подписаться на новости

Читайте также

25 октября / Комментарии

11 принципов веб-дизайна, которые повышают конверсию

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

далее →

26 сентября / Комментарии

Разбор юзабилити интернет-магазина Ulmart.ru и его преобразования за 2016 год

Изначально статья планировалась как одно целое, где я хотел рассмотреть возможные ошибки в юзабилити топа российских интернет-магазинов. Но после нескольких дней обзора, понял, что каждый сайт заслуживает отдельного разбора. Кроме того, мне захотелось не только осветить проблему, но и предложить своё видение ее решения. В связи с этим вся статья строится по схеме: Гипотеза о проблеме > Причина и Обоснование > Решение.
Поскольку статья начата еще в ноябре 2015 года, а закончена только сейчас, Ulmart успел исправить часть проблем,  обозначенных в статье. Об этом я дополнительно говорю в примечаниях . И сейчас мы можем отследить те преобразования, которые были сделаны.

далее →

6 сентября / Комментарии

Комфорт покупателей как залог успешного бизнеса. Основные ошибки в юзабилити интернет-магазинов

Четыре года назад была опубликована статья «22 ошибки в юзабилити интернет-магазинов, а также работающие варианты по их исправлению». Мы решили, что настала пора освежить данную информацию и задали разработчикам сайтов и CMS следующие вопросы: «Какие указанные в данном материале ошибки по-прежнему актуальны?», «С какими юзабилити-ошибками интернет-магазинов вам приходится встречаться чаще всего?», «Какие юзабилити-советы вы можете дать заказчикам?». И вот что мы узнали.

далее →

11 августа / Комментарии

Чек-лист юзабилити интернет-магазина

По-настоящему проверить удобство интернет-магазина без подтверждения данными веб-аналитики, не получится. Контекст взаимодействия; задачи, опыт и мотивы пользователей; устройства, с которых пользователи просматривают магазин — всё это влияет на конверсию и не может быть оценено чек-листом.
При составлении чек-листа, я ориентировался на исследования института Baymard, Юзабилити Лаб, Mastercart и студии Сибирикс + некоторые собственные наблюдения.

далее →

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

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

далее →

X
Нажмите «Нравится»,
чтобы читать Shopolog.ru в Facebook