Визуальный контент для сайта: 5 ноу-хау победителей
Можете ли вы объяснить, почему одни сайты вам нравятся, а другие — нет? И почему одни веб-страницы запоминаются лучше, чем другие? В одной из последних статей на сайте writtent.com автор Хелен Нестеренко (Helen Nesterenko) делится очень простыми и эффективными советами по управлению визуальным контентом для вашего сайта или социальных сетей.
В интернете зрительный канал — основной для восприятия практически всей информации. Решения о покупке/подписке или других целевых действиях ваши посетители также принимают, исходя из своего визуального опыта.
Для начала немного статистики:
- 92,6% людей принимают решение, полагаясь на то, что они видят
- 90 секунд требуется, чтобы сформировать мнение о продукте по его внешнему виду
- 85% успеха в выборе продукта зависят от цвета.
В цифровую эпоху умение правильно выбирать и использовать визуальный контент — один из ключевых навыков. Если его не будет у вас — им воспользуются ваши конкуренты. Но мы-то знаем, что вы здесь чтобы побеждать, а не пасти задних. Так что приступим!
1. Используйте белые (иначе “негативные”) пространства
У вас на примете есть сайты, на которых ваш мозг “отдыхает”? Скорее всего, здесь дело именно в правильном использовании белых пространств — грамотно расположенных пустых областей на странице, которые делают страницу “воздушной” и гармоничной. Непосредственные функции белых пространств — улучшать восприятие информации, расставлять акценты и направлять внимание читателя.
Существует два типа белого пространства: пассивное и активное. Пассивное белое пространство обычно служит фоном, обрамляет и разделяет элементы текста и изображения, чтобы структурировать контент и повышать читабельность. Активное белое пространство — это осознанное размещение пустот на макете с целью выделить его отдельные элементы или направить внимание посетителя в нужном направлении.
Известный пример использования белого пространства — главная страница Google
Практический совет от профессионалов: свободное пространство вокруг цели на сайте (кнопки “Купить”, “Подписаться” или другого призыва к действию) сфокусирует внимание в нужном месте и способно значительно повысить ее эффективность.
2. Проведите цветовое A/B-тестирование
Уверены ли вы в том, какой цвет кнопок на сайте будет работать лучше всего? И как цветовая гамма влияет на конверсию посетителей в потенциальных клиентов? К сожалению или к счастью, однозначного ответа на этот вопрос не существует — в разных контекстах одни и те же цвета могут давать разные результаты, и эффективный способ определить лучших из них — провести A/B- или сплит-тестирование (split testing).
Так, например, с психологической точки зрения зеленый цвет считается для призыва к действию самым подходящим, чуть ли не идеальным — так как он ассоциируется с правильным решением, естественностью и здоровьем. Тем не менее, A/B-тестирование на странице Performable сервиса Hubspot показало, что кнопка «Get Started Now!» красного цвета оказалась на 21% более эффективной, чем зеленая. Это одно из многих подтверждений необходимости использовать A/B-тестирование на вашем сайте.
А на какую из двух кнопок «Get Started Now!» захотели бы нажать вы?
3. Картинка вместо 1000 слов
Изображения несут эмоцию, гораздо более сильную и простую для восприятия, чем текст. Они проникают прямо в подсознание и способны передать материи, трудно поддающиеся словесному описанию. В выборе изображений существует несколько правил, которые помогут использовать их эффективнее:
Фотографии из реальной жизни работаю лучше всего
Если вы работаете с людьми, ваши идеальные главные герои — это ваши клиенты. Самые эффективные изображения — те, с которыми захотят себя ассоциировать ваши покупатели.
Instagram авиакомпании Virgin America очень убедительно передает комфорт и удовольствие от пребывания на борту
Скриншоты (снимки экрана) не будут лишними никогда
Специально сделанные снимки экрана уместны в большинстве случаев и работают, потому что они максимально близко иллюстрируют то, о чем вы говорите. А если вам нужно также расставить в них правильные акценты или добавить аннотации, Skitch от Evernote для этого — самый простой и удобный инструмент.
Как искать изображения для легального использования
На сегодняшний день найти бесплатные изображения с правами на использование в личных или даже коммерческих целях нет так уж и сложно. Flickr предоставляет возможность поиска по изображениям c лицензией Creative Commons, а в Google Images этот фильтр называется “С лицензией на использование” (free to use or share) в выпадающем меню инструментов расширенного поиска .
Слабое место картинок из фотобанков
Не думайте, что посетителей сайта смогут убедить фотографии людей с идеальными улыбками из фотостоков. Это уже давно не так. Однако, если вы действительно не можете обойтись без услуг фотобанков, я рекомендую Shutterstock and Fotolia.
Рисунки, наброски или схемы от руки
Рисунок всегда был одним из лучших способов объяснить что-то другому человеку и просто незаменимым инструментом, когда необходимо передать кому-нибудь сложную или нелинейную идею. Ведь все, что вам для этого нужно — бумага и ручка. А также, возможно, немного вдохновения от идеолога визуального мышления Дэна Роэма (Dan Roam):
В своей книге «Визуальное мышление» Дэн Роэм учить решать проблемы и продавать идеи при помощи картинок на салфетке
4. Используйте инфографику
Несмотря на то, что инфографики уже доказали свою эффективность для визуализации данных, многие компании очень неохотно используют их как маркетинговый инструмент. А ведь встречаются случаи, когда использование инфографик приносило 401%-й рост трафика и увеличение потока потенциальных покупателей на 4480%! Ссылка на исследование: http://blog.thewholebraingroup.com/return-on-infographics
Самое сложное — начать, но и это довольно просто с помощью сайтов visual.ly или picktochart.
5. Расскажите историю картинками
Иллюстрированные истории (то, что в оригинале называется visual storytelling) — это отличный способ доносить информацию в эру ее переизбытка. Они работают с читателем как на ментальном, так и эмоциональном уровне, и помогают передать ему самое главное.
Вместо того, чтобы много писать:
Визуализация ингридиентов для пирога из книги «IKEA Cookbook by Forsman & Bonderfors»
Подведем итоги
- Белые пространства для выделения главной информации и направления внимания
- A/B-тестирование для достижения наилучшей конверсии на вашем сайте
- Рисунки от руки — вместо тысячи слов
- Инфографика для лучшего восприятия и распространения материалов
- Наглядные иллюстрации для создания запоминающихся историй
Начните использовать эти инструменты прямо сейчас и сравните производительность сайта до и после изменений. Какие положительные результаты принесет ваш сайт или социальные сети? Удачи вам!
