Тенденции веб-дизайна 2020: улетный визуал & инновации
Высокотехнологичный улетный визуал – три слова характеризующие тренды и тенденции Web’а. Визуальная лаконичность в оформлении становится мейнстримом современного веб-дизайна. Объединение искусства с высокими технологиями должно сделать «познавательности» более изобразительными. Тенденция наступления визуального формата – это направление будущего, которое требует свежих и нестандартных дизайн-решений уже сейчас.
В 20-м десятилетии ожидаем новых идей совмещения взрывной графики с хайтеком. Дизайнерам придется удивлять изобретательностью. Их задача – реализовать инновационный и обширный функционал без визуального перегруза. Итак, тенденции развития веб-дизайна с лучшими на 2020 год примерами применения трендов.
- Совмещение фотографий с иллюстрациями
- Паттерны: от подложки до интерактива
- Черно-белые палитры
- Шрифты-гиганты, негабаритные надписи и минимализм
- Современный ретро-стиль
- Лайн Арт: креатив с визуальной чистотой
- АРТ и Дизайн: иллюстративное единение
- Трехмерная графика / 3D-моушн эффекты
- Инновации, которые мы увидим в 2020-х
Тенденции в веб-дизайне 2020 года
1. Совмещение фотографий с иллюстрациями
В тренде новая визуальная эстетика – сочетать фото с 2D-иллюстрациями от руки. К фотоснимку добавляются элементы иллюстрации, либо они дополняют друг друга. «Микс двух реальностей» открывает дорогу творческим и маркетинговым идеям.
тренд в дизайне тренд в дизайне тренд в дизайне тренд в дизайне2. Паттерны: от подложки до интерактива
Интересные паттерны не вышли из моды. Помимо полноэкранных, применение частями будет на пике популярности. Так, дизайнеры задают где надо акценты или общую атмосферу, добавляют сайту эмоциональности.
Черно-белые дизайны – нестареющая классика. Они изящны и элегантны, эффективны для eCommerce / творческих ресурсов. Ожидаем свежих черно-белых решений с отрицательным пространством, крупными шрифтами и элементами line-art.
тренд в дизайне тренд в дизайне тренд в дизайне4. Шрифты-гиганты, негабаритные надписи и минимализм
Гигантские шрифты и большие (но негабаритные) надписи отличат дизайны 2020 года. Крупная типографика при компактной лаконичности заголовков не вызовет хаоса в минималистичном оформлении или на мобильных экранах. К примеру, увеличенная нестандартным кеглем надпись:
- Цепляет взгляд
- Создает интересную визуальную деформацию
- Усиливает дизайн концептуальным посылом «большей решительности»
тренд в дизайне
тренд в дизайне5. Современный ретро-стиль
С приходом новых веб-технологиий и трендов творческие дизайнеры начинают ностальгировать по прошлому. В 2020-м будут популярны штрихи «состаренного» дизайна: изношенность, черно-белые и зернистые / потертые фото, приглушенные ретро-оттенки и шумные / пыльные текстуры. Высокотехнологичное ретро – это особый шарм.
тренд в дизайне тренд в дизайне6. Лайн Арт: креатив с визуальной чистотой
Абсолютный хит во всех сферах графического дизайна 2020-го года. Лаконичность контурной графики и креатив LineArt-иллюстраций сделают дизайны чище, профессиональней на вид.
тренд в дизайне тренд в дизайне тренд в дизайне тренд в дизайне тренд в дизайне7. АРТ и Дизайн: иллюстративное единение
Арт-иллюстрирование дизайна – горячий тренд 2020 года. Ожидаем креативных фантазий, концептуальных идей и произведений искусств – от картинок пастелью и акварели до модерна и флэт графики с градиентами. А также, запоминающихся несоответствий / странных художеств с нарочитой непропорциональностью, персонажами без лиц и т.д.
# Интерактивность сайта + моушн-графика
Взаимодействие пользователей с сайтом прокладывает дорогу к взаимопониманию, какие бы цели они не преследовали. Этим объясняется интерес к игровому дизайну, поясняющим графическим роликам и анимационному иллюстрирования с многоуровневым интерактивом.
тренд в дизайне8. Трехмерная графика / 3D-моушн эффекты
3D скоро станет настоящим мейнстримом в графическом и веб-дизайне. Иными технологиями вам не удастся получить такой глубины и реалистичности. В 2020 году ожидаем новых 3D дизайнов – статичных, анимированных и интерактивных.
Моушн стал увлекательнее, чем когда либо. Задача интерактива – цеплять и удерживать целевую аудиторию. 3D-моделлеры просто расширяют методику «втягивания» посетителя в диалог.
тренд в дизайне тренд в дизайне# 3D-анимации
Моушн-дизайнерам известно, что анимированная 3D-графика производит визуальный восторг.
тренд в дизайне# Статичная 3D графика
Трехмерная графика привлекает плавностью форм и оттенками, а качественный 3D-арт делает сайт узнаваемым. Обычно, дизайнеры упрощают остальное, добиваясь современного чистого вида и сбалансированной структуры дизайна.
тренд в дизайне тренд в дизайне# 3D-рендеринг и высокая реалистичность
Завораживающая «фирменная» реалистичность в продающем дизайне – это интересно и ярко. Актуально для eCommerce, промо-сайтов, домашней или посадочной страницы с товарами. Качество создается проработкой объекта: блики на поверхности, рассеивание… Софт-2020 существенно упростит и удешевит реализацию Wow-эффекта. Смотрите пример 3D-рендера продукции на фоне цепляющих мотиваторов в динамичном дизайне товарного лендинга.
9. Инновации в веб-дизайне 2020-х
Передовую технологию спешат представить в виде тренда. Но осмысленного, практичного применения в веб-дизайне каких инновационных направлений ожидать на ближайшее будущее?
# Чат-боты
В 2020 году больше веб-ресурсов предложат услуги говорящего и самообучающегося чат-бота. В режиме 24/7 он ответит на часто задаваемые вопросы, послужит опорой на протяжении всего посещения сайта. Продвинутые ИИ-технологии сделают ботов адекватными как никогда.
# Диалоговые интерфейсы & Автоматизированные агенты
В 2020-х диалоги с сайтом будут интернет-привычкой, а пионерами внедрения разговаривающих ассистентов станут веб-сервисы. Голосовой ввод – глобальный тренд, Популярностью обязан совершенствующимся технологиям распознавания речи и удобству голосового интерфейса (по сути является отсутствием UI). Ожидаем умных ассистентов на основе речевых технологий. Общаться с сайтом командами – совершенно новый пользовательский опыт. Бизнесу пора присмотреться к модной тенденции, а пользователям – приобретать навыки web-коммуникации в реальном времени.
Подводя итог
В WEB-е уже многое менялось, но две тысячи двадцатый обещает быть колоритным. С начала 20-х, сайты начинают впечатлять не только визуально. Для веб-дизайнеров и пользователей 2020-й станет годом технологических возможностей / высокоинтеллектуальных интерфейсов / удивительно креативных решений.
Успешных дизайнов и взаимопонимания с Web’ом 2020-х!
10 трендов веб-дизайна на 2020 год
2020 год обещает стать прорывным в области веб-дизайна и готов предложить нам по-настоящему захватывающий опыт. Добавьте ко всему этому прогресс экранных технологий, и не ошибетесь, если в своих будущих проектах вы не побоитесь использовать яркие цвета и такие их сочетания, которые раньше обходили стороной.
Содержание статьи
Два основных направления
1. Тренды дизайна в сфере eCommerce
2. Тренды отзывчивого дизайна
1. Яркие цвета + простота
2. Анимации, интегрированные gif и динамические иллюстрации
3. Асимметричные макеты
4. Громкая типографика
5. CSS Grids
6. Масштабируемая векторная графика
7. Нарисованные от руки изображения
8. Голосовые интерфейсы
9. Искусственный интеллект и передовые технологии машинного обучения
10. Брутализм в веб-дизайне
Заключение
Два основных направления
Но опять же, благодаря таким пионерам индустрии, как Google и Apple, поддерживающими flat-дизайн, в этом году в концепцию минимализма, наконец, может проникнуть глубина и цвет. За последние пару месяцев стало очевидно, что плоский дизайн может пополниться всплесками более глубоких и заряженных энергией оттенков.
В любом случае, в 2020 году подавляющее большинство дизайнеров и разработчиков будут фокусировать свое внимание на двух группах трендов веб-дизайна:
1. Тренды дизайна в сфере eCommerce
Поскольку онлайн-шопинг уже стал нормой для миллионов потребителей, от интернет-магазинов требуется, прежде всего, то, что нужно посетителю с точки зрения пользовательского опыта / интерфейса (UX / UI) и визуальной привлекательности. По большей части, основные тенденции eCommerce-дизайна в ближайшем будущем так или иначе будут касаться удобства пользования сайтом, простоты и скорости его работы. Другими словами, чем проще будет человеку заказать и получить в руки тот продукт, который ему нужен, тем лучше.
2. Тренды отзывчивого дизайна
Мы живем в эпоху, когда людям гораздо комфортнее выходить в интернет при помощи своих гаджетов, в силу чего прогнозируемый многими экспертами рост объемов мобильного трафика уже случился, и во многих ключевых регионах планеты он уже превысил объем традиционного десктопного трафика.
Во всем мире на мобильный сектор приходится около 52% всего веб-трафика. К концу 2019 года 63% всех пользователей мобильных телефонов будут осуществлять выход в интернет, главным образом, через свое мобильное устройство. Следовательно, более подходящего времени, чтобы сосредоточить свое внимание на главных адаптивных тенденциях дизайна, наверное, и не будет.
В настоящее время несколько ключевых тенденций веб-дизайна уже становятся популярными среди разработчиков по всему миру. Некоторые из них являются продолжением существующих трендов, другие — знаменуют собой появление принципиально новых функциональных возможностей.
Но что всех нас ожидает в ближайшие пару лет?
1. Яркие цвета + простота
Поскольку все больше брендов стремятся быть заметнее на фоне множества конкурентов, тренд на использование ярких и смелых цветов в дизайне веб-сайтов сохранится.
Яркие и насыщенные цвета не только погружают в себя, но и привлекают внимание, и многие онлайн-бренды этим активно пользуются.
Но дело не только в цвете. Когда дизайнер действует наперекор тому, что делают остальные (а большинство специалистов предпочитают оставаться в тени более «безопасных» оттенков), то этим демонстрирует дальновидность, смелость и даже эксцентричность идентичности бренда. И если ваша целевая аудитория приветствует все эти качества, то такой дизайн не только привлечет ее внимание, но и добьется более лояльного и доверительного отношения.
Стоит отметить, что особенно выгодно такие дизайны смотрятся на устройствах, чьи экраны используют технологию In-Plane Switching (IPS), в силу чего яркие цвета и смелые решения выглядят еще более зрелищно и эффектно.
Ниже — удачный пример дизайна за авторством Egwineco.com; обратите внимание на то, как при помощи ярких цветов дизайнеры делают оформление каждой банки максимально интересным и привлекательным.
Вечеринка на крыше + жареная курочкаОторвать взгляд от этих банок действительно сложно. Дизайн сайта прост, но вместе с тем способен удивить посетителя и заинтриговать настолько, что ему сию минуту хочется протянуть руку к экрану и стащить одну баночку себе на пробу. Предложение стать гостем зажигательных вечеринок на крыше и отведать жареной курочки только добавляет ценности основному предложению.
Вечер у костра + сыр на грилеСам дизайн при этом остается предельно простым. Подобная простота сама по себе является одним из популярных трендов в среде eCommerce последних лет.
Надо отметить, что появление подобных дизайнов является отражением прогресса потребительских технологий. У большинства пользователей на руках ультра-мощные и высокотехнологичные устройства, которые способны отображать столь привлекательные изображения и даже усиливать эффект от их демонстрации. Смелые и красивые визуальные образы в дизайне — это норма, соблюдение которой ожидает каждый потребитель от любого современного сайта.
Читайте также: 8 ярких цветовых трендов 2019 года2. Анимации, интегрированные gif и динамические иллюстрации
В 2017 году весьма модным было размещать на страницах сайтов видео. Но медленная загрузка таких страниц заставила многих довольно быстро предать этот тренд забвению, ведь чем дольше загружается сайт, тем большее число пользователей (потенциальных покупателей) вы теряете.
Очевидно, что людей раздражают не сами ролики: разного рода динамические изображения пользуются популярностью у пользователей всех возрастов — а именно долгая загрузка страниц. Что же следует предпринять в данной ситуации?
Использовать анимации, конечно же.
Есть несколько способов, где и как вы можете задействовать этот формат:
В отличие от видео высокого качества анимации не приведут к долгой загрузке страниц (несмотря на наличие ряда возможных вариантов использования). Мало того, что анимации добавляют вашему бренду изрядную долю харизмы (при условии, что они качественно воспроизводятся), так еще и помогают выразить его ценности и поведать о нем историю — в свежем и интересном формате.
В будущем году особое внимание будет уделено мобильной анимации.
Ориентация на мобильные экраны (так называемый mobile first) уже некоторое время является трендом веб-дизайна, и это доминирование мобильных устройств (их превалирование над десктопом) будет только усиливаться, мотивируя дизайнеров как можно плотнее заниматься разработками мобильных анимаций и их всесторонним развитием.
Иллюстрации, в свою очередь, могут существенно облегчить задачу по демонстрации потенциальным клиентам того, как пользоваться продуктом — или помочь с обзором функций сервиса.
Интернет-магазины также способны извлечь пользу от кастомных иллюстраций, обеспечив с их помощью более удобное перемещение по страницам продукта, демонстрируя всем онлайн-покупателям то, как продукт работает, как настроить фильтры и корзины покупок, и, наконец, доводя их до страницы оформления заказа.
«Серьезные» бренды могут задействовать пользовательскую анимацию и иллюстрации, чтобы придать своей воронке продаж или пути покупателя атмосферу непринужденности. Или просто удержать внимание людей во время загрузки страницы.
Благодаря прогрессу веб-технологий, искусственного интеллекта и продвинутым механизмам обработки больших данных, анимация и 3D-эффекты смогут обеспечить более мягкую визуализацию данных.
Но анимации следует использовать с одной оговоркой, а именно — не забывать про мобильных пользователей. В зависимости от размера и характера используемого устройства, может оказаться трудным или даже невозможным перенести десктопный опыт на мобильную платформу.
Тем не менее, есть много способов использовать анимацию для установления и укрепления отношений с клиентами.
Читайте также: 75 инструментов веб-анимации, которые вам нужно испробовать3. Асимметричные макеты
Просто задумайтесь.
Для разработки большинства сайтов используются сетка, границы которой обрамляются внутренними и внешними отступами, что делает любую страницу максимально комфортной для восприятия. Не то чтобы хорошо организованные страницы — это грех, но в 2020 году именно асимметричные структуры позволят многим брендам выразить свою индивидуальность и даже брутальность на полную катушку, создавая причудливые и экстравагантные работы.
К примеру, персональные сайты уже возвели эту идею в ранг культовой. Сайты на ломаных сетках особенно привлекательны из-за их уникальности и демонстрируемой в лоб самоуверенности.
Но забывать об осторожности все же не стоит.
Бренды, которые могут похвалиться большими объемами живого контента на сайте, могут воспринять асимметричные структуры как фактор, который будет только усложнять веб-опыт читателей. Такой компании было бы неплохо пересмотреть эту идею и переключиться на более подходящий, но представительный дизайн — если они хотят, чтобы пользователи остались довольны.
В качестве примера вновь можно обратиться к сайту Dadadata. На нем использовано сочетание асимметричной структуры и динамического фона, который приходит в движение при перемещении указателя мыши:
Насколько это смелое решение (и как быстро, в хорошем смысле, все на сайте образует беспорядок?).
Конечно, нередко появляются и такие примеры дизайна, когда разработчики явно переборщили с тем или иным трендом. Секрет потрясающих дизайнов заключается в том, что работа с асимметрией должна быть, как это ни иронично звучит, хорошо просчитана. Чтобы создать ощущение баланса в асимметричном дизайне, важно убедиться, что ни одна часть страницы не является более «тяжелой», чем все остальное. Использование больших изображений приветствуется, но при условии, что они идеально сбалансированы с текстом, пространством и другими элементами.
Независимо от того, насколько сложным или причудливым может оказаться дизайн, человек всегда будет в первую очередь уделять внимание более крупным объектам на странице и уже потом разглядывать детали.
Читайте также: Как использовать симметрию и асимметрию в дизайне лендингов4. Громкая типографика
Типографика как искусство оформления текста не станет в 2020 году чем-то принципиально новым. Между тем нужно отметить, что в настоящее время наибольшее предпочтение отдается шрифтам без засечек (san-serif), поэтому если вы хотите выделиться на фоне конкурентов, в будущем году стоит разменять традиционные шрифты на что-то более смелое и дерзкое, то, что трудно будет не заметить.
Порой текст оказывается гораздо убедительнее, чем самая эпатажная фотография, и, как правило, этого удается достичь за счет использования больших, жирных и нестандартных шрифтов. Благодаря большему количеству инструментов и устройств, поддерживающих пользовательские шрифты, 2020 год — это самое подходящее время, чтобы смело заявить о себе интересным выбором шрифта.
Стоит отметить, что набирают популярность так же и вариативные шрифты.
Вариативный шрифт — это, по сути, один динамический шрифт, который ведет себя как бесконечное множество начертаний. Главное, чтобы все интерполировалось. Осей интерполяции при этом может быть сколь угодно много: от ширины символов до насыщенности. Так что наиболее отчаянные дизайнеры шрифтов могут насладиться большим разнообразием доступных им вариантов.
Взгляните на пример вариативного шрифта от блога Typekit:
И, конечно же, типографика имеет больше значение для любого интернет-бизнеса, который стремится обратить себе на пользу возможности поисковой оптимизации, используя целевые, хорошо продуманные ключевые слова.
В погоне за оригинальностью и своеобразием не стоит забывать о таких основных характеристиках текста, как его читабельность и простота восприятия. Конечно, шрифты должны быть интересными и необычными, но если из-за ваших творческих амбиций контент станет менее разборчивым, считайте, что вы только навредили.
Также очень важно сохранить баланс между «громкой» типографикой и мобильной отзывчивостью. Проблема в том, что типографику, которая удачно смотрится на десктопных экранах, как правило, трудно вписать в крошечный экран мобильных устройств. А размениваться мобильными посетителями в 2020 году все же не стоит. Как уже было отмечено выше, их просто больше.
Кстати, если вы пользуетесь платформой LPgenerator, вам не нужно открывать сервис Google Fonts для получения сторонних шрифтов на ваши посадочные страницы, ведь шрифты подключаются прямо из редактора. Мы добавили все шрифты из коллекции Google Fonts в наглядную галерею, и все, что нужно сделать — это выбрать подходящий шрифт, нажать на кнопку подключения и использовать его для новых или уже размещенных на лендинге текстов.
Читайте также: Анатомия шрифта: визуальный гайд по типографике5. CSS Grids
Этот тренд веб-дизайна предназначен для решения проблем с адаптивным дизайном:
В последнее время многим интернет-брендам приходилось создавать отдельные версии сайта для мобильных устройств и для настольных компьютеров. И дизайнеры должны были так настраивать эти ресурсы, чтобы те могли самостоятельно определять, с какого устройства заходит на сайт посетитель, и перенаправлять этого человека на более подходящую его экрану версию.
И хотя с 2017 года всем известно, что в интернет люди чаще выходят со своих смартфонов и планшетов, чем с ноутбуков и ПК, отмахиваться от того, что способен предложить умный CSS grid все же не стоит, ведь это, бесспорно, прекрасный вариант, который позволит на базе одного сайта создавать множество его версий, соответствующих размеру экрана пользователя (вместо того, чтобы делать только мобильный или только десктопный сайт). С точки зрения конечного пользователя это, безусловно, одна из самых важных тенденций адаптивного дизайна последних лет.
Как уже упоминалось ранее, объемы мобильного веб-трафика уже превзошли традиционный настольный трафик на большинстве ключевых мировых рынков. Достаточен тот факт, что сам Google продолжает демонстрировать сильную приверженность мобильным веб-сайтам.
CSS grid как одно из последних достижений в адаптивном веб-дизайне гарантирует, что каждому посетителю, независимо от того, какого размера, типа и характера устройство он использует для доступа к сайту, будет предложен высококачественный веб-опыт. Система компоновки позволяет владельцу ресурса организовывать содержимое в строки и столбцы, соответствующие размеру экрана пользователя.
Читайте также: Почему LPgenerator не использует адаптивный дизайн для шаблонов лендингов6. Масштабируемая векторная графика
Люди любят мультимедиа, а сайты, на которых размещается привлекательный мультимедийный контент, оцениваются выше, чем простые текстовые веб-страницы, особенно, если дело касается привлечения и удержания посетителей.
Но раньше за такое богатое наполнение приходилось расплачиваться более долгой загрузкой страниц, и все из-за распространенных тогда «тяжелых» форматов файлов, вроде GIF, PNG, а также видео-форматов. Все они изначально не подходили под мобильные экраны.
Недавно стало известно, что в скором времени для ранжирования веб-сайтов Google будет использовать результаты мобильной индексации.
Это означает, что для всех владельцев веб-сайтов пришло время как следует заняться ориентированными на мобильные устройства дизайнами, сделать мобильную приоритезацию центром процесса разработки дизайна, не жертвуя при этом богатством визуального контента, способного очаровать посетителей.
И тут пора вспомнить про такой формат, как SVG.
Это векторные изображения, которые способны масштабироваться под разные экраны, сохраняя при этом исходное качество. В SVG нет пикселей, что и определяет способность этого формата к изменению размера изображения без изменения его четкости.
С помощью SVG-изображений возможно обеспечить постоянное качество пользовательского интерфейса для всех мобильных посетителей, а это значит, что использование этого формата — это еще один критически важный тренд адаптивного дизайна, который сохранит свою актуальность еще долгие годы.
Теперь вас не будет грызть совесть из-за того, что кому-то вы предоставили полноценный веб-опыт, а кто-то остался обделенным. SVG-формат не даст в обиду владельцев смартфонов и планшетов, а это важно в интернет-сообществе, ориентированном на мобильные технологии.
Читайте также: Как и когда использовать самые распространенные форматы графических файлов7. Нарисованные от руки изображения
По мере того, как все большее число веб-мастеров начинает воспринимать сайты как нечто большее, чем просто адрес в интернете, рисованные элементы, которые делают эти самые сайты уникальными и необычными, будут встречаться все чаще.
Надо сказать, что востребованным такой стиль изображений сделали два других не менее заметных тренда, речь которых уже шла выше — громкая типографика и кастомные иллюстрации.
Но глядя на эти картинки, нельзя не задаться вопросом: учитывая сложность и технологическую начинку большинства других тенденций веб-дизайна, упомянутых в этой статье, в чем заключается привлекательность таких далеко не самых совершенных рисунков? Почему бы не делать упор исключительно на фотографиях высокого разрешения, которые, как правило, и ассоциируются у большинства пользователей с классным и крутым дизайном?
Все просто — нарисованные от руки картинки обладают человеческим обаянием и теплотой.
Вы можете использовать такие рисунки, чтобы просвещать, привлекать и очаровывать, источая индивидуальность и обаяние:
Разумеется, вы всегда можете использовать в своем дизайне 4K-изображения и мотивирующие фото, но, тем не менее, важно не упускать один ключевой факт: веб-дизайн 21-го века часто оказывается слишком совершенным.
Все настолько безупречно и слишком идеально, чтобы быть продуктом чего-то иного, кроме бездушной машины. Напротив, если вы внесете в микс что-нибудь несовершенное, вы тут же сделаете свой дизайн чуть более человечным, душевным. Особенно, если сам рисунок будет немного грубым — для большинства пользователей, которые не обладают художественным талантом, он вызовет еще больше симпатий.
Любой желающий сегодня может снять кучу красивых фотографий, а затем разместить их на веб-сайте. Однако когда вы что-то рисуете от руки и с гордостью демонстрируете эти иллюстрации на своем сайте, делаете их частью своего имиджа, это многое говорит о характере вашего бренда. Да и о вас самих.
Конечно, вы можете нанять профессиональных художников, которые нарисуют то, что и как вам нужно, но ничто не способно рассказать о вашем бизнесе так, как это сделают нарисованные вашей командой иллюстрации.
Читайте также: 7 советов по созданию рисованной анимации8. Голосовые интерфейсы
Внимание мимолетно. И умные веб-мастеры знают, что только сотрудничество с прогрессивными веб-дизайнерами поможет им увлечь за собой современную аудиторию.
Пользователи устройств, на борту которых располагаются такие виртуальные смарт-помощники, как Алиса, Siri, Google Now и Cortana, уже давно предпочитают взаимодействовать с ними и искать что-либо в интернете при помощи голоса. А все потому, что говорить непосредственно в устройство гораздо удобнее, нежели набирать запросы вручную. И если веб-разработчики адаптируют свои интерфейсы под голосовое взаимодействие, то смогут привлечь внимание более занятой аудитории.
Экраны устройств уменьшаются в размере, и на них остается все меньше свободного места, а голосовые модели не очень прихотливы в пространстве и персонализируют доставку контента так, как не может ни один текст.
Возможно, все началось слишком неспешно, но популярность голосового управления / ввода, наконец, достигла своего пика. Следующая статистика показывает, как и почему голос является одним из самых важных трендов веб-дизайна в 2020 году и не только:
- ожидается, что к 2022 году голосовой шопинг перешагнет отметку в 40 миллиардов долларов;
- по всему миру объемы поставок смарт-колонок выросли почти на 200% в 3 квартале 2018 года;
- ожидается, что к 2022 году 55% всех домохозяйств обзаведутся смарт-колонками;
- 65% пользователей от 25 до 49 лет говорят со своими голосовыми устройствами по крайней мере один раз в день;
- 61% пользователей от 25 до 64 лет отмечают, что в будущем планируют использовать свои голосовые устройства чаще.
Однако крупный бизнес не спешит внедрять голосовые интерфейсы. Но, судя по данным исследований, это лишь вопрос времени. Не за горами эра, когда именно голос будет основным вариантом ввода/управления для рядового пользователя.
Читайте также: 4 тренда digital-маркетинга, которые встряхнут 20199. Искусственный интеллект и передовые технологии машинного обучения
Гигант от мира социальных сетей Facebook встретил 2018 год заявлением о том, какие тенденции развития социальных медиа будут актуальны в будущем году. Среди прочих были названы дополненная реальность, искусственный интеллект и машинное обучение.
Дизайнерам пользовательского опыта будет удивительно узнать, что в будущем главная страница сайта превратится в некий анахронизм, и пользовательские интерфейсы будут прекрасно обходиться и без нее. Ее место займут более таргетированные и персонализированные посадочные страницы.
Продвинутое машинное обучение поможет веб-мастерам, веб-разработчикам и дизайнерам UX / UI получать информацию о пользователе на основе их истории браузера и местоположения, к примеру.
В свою очередь, эта информация поможет владельцам сайтов и дизайнерам разработать релевантные интересам этих пользователей веб-страницы, которые будут встречать людей предложениями тех продуктов или услуг, которые посетители могли бы захотеть искать, скажем, на сайте интернет-магазина.
Искусственный интеллект — не новичок в сфере веб-дизайна и разработки. Любая автоматизированная система, которая обеспечивает персонализированный опыт, основанный на предпочтениях пользователя и воспринимаемом поведении, квалифицируется как ИИ.
Средний пользователь сети скоро начнет ждать (и требовать) гораздо более многомерной персонализации своего онлайн-опыта. Такой онлайн-опыт, при котором веб-сайты, которые они посещают и с которыми взаимодействуют, узнают о том, чего они хотят, прежде, чем они даже сами осознают это.
10. Брутализм в веб-дизайне
Прежде чем на сцену выскочили материальный и плоский дизайны, балом правили строгие сетки и блоки с острыми краями.
В прошлом году крупные компании старательно дополняли органические дизайны своих сайтов плавными изогнутыми линиями и сглаженными формами, подчас творя настоящие произведения искусства. Задача таких дизайнов — сделать стоящие за ними бренды более человечными, вдохнуть в них душу и, таким образом, привлечь внимание целевой аудитории и заслужить ее доверие.
В качестве хорошего примера можно вспомнить округлые дизайны Google.
К концу 2017 года сформировалась новая когорта дизайнеров, которая стремилась переосмыслить традиционную верстку веб-дизайна. В своих работах они старались подчеркнуть связь с дизайном старых-добрых статических сайтов с четко структурированным макетом. Цель этого состояла в том, чтобы за счет оригинальности и индивидуальности выразить принадлежность бренда к целевой аудитории.
Сайт дизайнера Atelier Florian Markl в стиле брутализмСайты с такой «оберткой» не ускользнут от вашего взгляда: сочетание цветных блоков горизонтальной и вертикальной направленности, соседство контрастных оттенков — внешний вид таких веб-ресурсов будет отличаться наличием асимметричных визуальных эффектов, которые диаметрально противоположны тому, что все мы привыкли видеть в более консервативных дизайнах.
Короче говоря, такие сайты по-брутальному оригинальны.
Более того, брутализм всегда ставил превыше всего функциональность ресурса, и нередко в жертву этой функциональности приносилась эстетическая сторона дизайна. Поэтому одними из наиболее востребованных трендов веб-дизайна на будущий год можно назвать простоту и доступность. Конечно, брутализм располагает потенциалом, чтобы создавать привлекательные и не лишенные красоты сайты, но вы можете обратиться к этому стилю, если вам понадобиться создать простой и функциональный сайт, преследующий исключительно бизнес-цели.
Читайте также: Брутализм и антидизайнЗаключение
По мере совершенствования технологий и средств потребления веб-контента, все больше дизайнеров отличаются созданием креативных и по-настоящему революционных работ, чье влияние распространяется на многие годы вперед.
Некоторые инновации, как, например, веб-анимации, уже являются вполне устоявшимися тенденциями, тогда как другие, вроде CSS grids, достигнут своего пика популярности в течение следующей пары месяцев. Тем не менее, нужно понимать то, что в долгосрочной перспективе жизнестойкость той или иной тенденции веб-дизайна будет по-прежнему определяться одним и только одним фактором: предпочтениями конечного пользователя.
Теоретически вполне возможно, что вкусы, предпочтения и ожидания вашей целевой аудитории могут радикально измениться с течением времени. Но надо понимать, что в этом случае многие практики веб-дизайна, ранее считавшиеся превосходными и обязательными, таковыми быть перестанут. Если потребители вдруг начнут проявлять негативную реакцию на асимметричные макеты, к примеру, от них очень быстро откажутся и разработчики.
Все это рождает необходимость технологического картирования будущего веб-дизайна, разработка сценариев его изменения относительно прогресса технологий. Просто подумайте: стремительный прогресс в развитии мобильных технологий изменил то, как сегодня мир получает доступ к веб-сайтам и как с ними взаимодействует. Голосовые интерфейсы тоже оказывают свое влияние. Возможно, через несколько лет технологии виртуальной реальности обозначат наступление новой эры веб-дизайна и разработки. Но пока это кажется маловероятным.
На данный момент лучше акцентировать внимание на перечисленных выше 10 тенденциях, которые помогут вам создать по-настоящему потрясающий дизайн, способный привести в восторг любого современного пользователя.
Если же у вас нет времени разбираться в тонкостях лендостроения, но при этом вам нужен уникальный сайт с гарантированно высокой конверсией, команда LPgenerator с радостью разработает для вас индивидуальный дизайн. Он будет выполнен с учетом всех ваших пожеланий, подчеркнет особенности оффера и позиционирование бренда, а еще — легко масштабируется по мере необходимости.
Высоких вам конверсий!
По материалам: sondoramarketing.com Изображение: pixabay.com
28-11-2019
Лучшие темы для создания Landing Page на WordPress в 2020 году
Здравствуйте, сегодня хочу с вами посмотреть на лучшие темы для WordPress при строительстве лендинга в 2020 году. К сожалению, хороших бесплатных вариантов нашёл мало. Впрочем, если есть хоть малейший опыт работы с WP, то без проблем реализуете Landing Page на любой теме для WordPress из репозитория. В крайнем случае можете воспользоваться конструктором, например, Elementor. О том, как строить посадочные страницы с помощью него, рассказал здесь.
А теперь перейдём к делу.
Список лучших тем для Landing Page на WP в 2020 году
Итак, этот список актуален именно на этот год. Если в течение этого года найду ещё подходящие варианты, то опубликую сюда. Добавлю, я перечислил здесь только те темы, с которыми работал сам. Уверен, есть множество отличных вариантов, которые для решения данной задачи подойдут. Но так как собственноручно не пробовал, то сказать по ним ничего не могу.
А теперь непосредственно список:
-
Тема Satelite — Creative Ajax Portfolio Showcase Slider Theme: https://1.envato.market/9DgaE. Стоит 39$. Красивая тема, хотя не самая производительная, подойдёт для строительства сайтов-портфолио и посадочных страниц. Главная фишка — невероятно красивый слайдер.
-
Тема Mesmerize: https://ru.wordpress.org/themes/mesmerize/. Имеет бесплатную версию, но функционал серьёзно ограничен. На одном из своих сайтов использую PRO-версию и доволен. Очень удобный конструктор главной страницы, доступный прямо из кастомайзера. Но очень ограниченный по возможностям.
-
WPConfigurator: https://1.envato.market/GNWb9. Цена — 69$ Главная фишка заключается в том, что можно прямо на главную страницу запилить прикольный конфигуратор продукта. Очень удобная вещь, если желаете продвигать какой-либо вариативный продукт. Без WooCommerce не работает. Но Landing построить вполне реально. Кстати, есть полная версия демо, в том числе и с админкой.
-
Navian – Multi-Purpose Responsive WordPress Theme: https://1.envato.market/vaMyO. Настройка довольна простая, есть куча заранее подготовленных макетов, на основе которых можете сделать собственные темы. Главная фишка — 17$ за тему. Это очень мало.
-
Hestia: https://ru.wordpress.org/themes/hestia/. Бесплатная тема, но лучше поставить Elementor для строительства лендинга на ней. Тема вполне себе производительная и отлично работает на любых устройствах.
Пока что у меня всё. Но давайте хотя бы более подробно расскажу о каждой теме, если информация вам интересна. К сожалению, не по всем темам остались материалы, но что есть, выложу.
Тема Satelite – Creative Ajax Portfolio Showcase Slider Theme
Очень красивая тема, полностью построенная на Ajax, соответственно, все элементы на ней работают без перезагрузки страницы, что позволяет включать фоновую музыку, а также строить классные карусели слайдеров. Ознакомиться с темой, а также превью можете по ссылке: https://1.envato.market/9DgaE. Стоимость — 39 долларов США.
Полноразмерный слайдерТема адаптивна, поддерживает разные макеты. Хоть и предназначена для портфолио, но построить красивый Landing на ней не проблема. Полная поддержка Gutenberg, а также WPBackery присутствует.
ПортфолиоБлоговый функционал никуда не делся. На базе данной темы можно сделать полноценный блог, но отношение поисковых систем к сайтам, построенным на Ajax и без меня должны знать, так что не рекомендовал бы.
Производительность нормальная, по крайней мере, для такого формата. Скорее проблема будет крыться в крупноразмерных фотографиях, чем в самой теме.
Тема Mesmerize
Отличная тема для создания Landing Page на WordPress. Для того чтобы сделать посадочную страницу, не нужно устанавливать какой-либо конструктор или работать в редакторе и учиться создавать стили. Ознакомиться с темой можете по ссылке: https://ru.wordpress.org/themes/mesmerize/. Ссылка на Live Preview на той странице будет.
Шапка в MesmerizeТема очень удобна для тех, кто не владеет кодом, но желает быстро построить Landing. Для этого достаточно перейти в кастомайзер и сделать страницу из заранее подготовленных блоков.
Кастомайзер блоков для Landing Page в MesmerizeКонечно, в бесплатной версии функционал очень ограничен, но в платной всё намного лучше. Впрочем, даже бесплатной версии хватит на построение нормальной посадочной страницы.
WPConfigurator
Если у вас есть только один вариативный товар и желаете продавать его прямо на главной странице, то вариант вполне себе приличный. Ознакомиться можете по ссылке, live preview там же: https://1.envato.market/GNWb9.
Конфигуратор продукта в теме WPConfiguratorБез WooCommerce не работает, к сожалению, сие решение заточено именно под него. Да, для Landing Page подойдёт, но также можно реализовать полноценный интернет-магазин с большим количеством товара. На ваше усмотрение.
В качестве конструктора используется KingComposer, что мне не особо понравилось, на мой взгляд, самый неудобный вариант из всех возможных. Но можете просто выкинуть его на помойку и работать с классикой или гутенбергом.
Конструктор конфигуратораСам конфигуратор создаётся с помощью такого вот конструктора, вы можете сделать полноценные маски для каждого товара. Работа трудоёмкая, но интересная. Учтите, делать такие вещи, как конфигуратор ПК или сервера, здесь не получится. Зато футболки, наклейки на упаковки и прочее вполне реально.
Navian – Multi-Purpose Responsive WordPress Theme
Тоже неплохая тема для WordPress, смотрится прилично, есть много готовых макетов, на основе которых вы можете построить нечто своё. Ознакомиться с темой и лайв ревью можете по ссылке: https://1.envato.market/vaMyO. Приятным бонусом становится цена, всего 17$, что очень мало по меркам Envato (ThemeForest).
Блок лендинга в теме NavianТема смотрится красиво, есть разные варианты меню, сайдбара и других вещей. Работать удобно даже новичкам, так что пользоваться темой можно.
Шаблон контактовКстати, если в планах расширение в блог или корпоративный сайт, то в этой теме всё необходимое присутствует, менять не придётся. Так что можно строить как и лендинг, так и блог. Единственное, по поводу WooCommerce сказать ничего не могу. Не тестировал.
Hestia
Если немного знаете код и умеете работать с классическим редактором, то можете смело устанавливать, но скажу сразу, что заточена под Elementor. Вместе с этим конструктором можно построить вполне приличный Landing без лишних трудностей. Ознакомиться можно по ссылке: https://ru.wordpress.org/themes/hestia/. Тема бесплатна, если, конечно, не будете покушаться на PRO-версию.
Если вы немного более продвинуты, то можете использовать базовые возможности кастомайзера, но там расчёт скорее на блог. Вы сможете настроить вывод из категорий на главную, добавить некоторые фишки.
В общем, построить Landing можно, но тема скорее для продвинутых пользователей.
На этом всё
Если появятся новые варианты, то обязательно добавлю сюда. Ну, свой список лучших тем для Landing Page на WordPress для 2020 года озвучил, можете ознакомиться, посмотреть. Желаю успехов и отличных лендингов, созданных без лишних сложностей.
65 Трендов Веб-дизайна в 2020 году. Топовые советы от профи
Автор Илья Чигарев На чтение 24 мин. Просмотров 50.9k. Обновлено
Привет. На связи Чигарев Илья. Данная подборка трендов веб-дизайна 2020 собрана из 4-х материалов с сайта Behance. Это посты, которые набирают наибольшую популярность и положительные отзывы среди комьюнити дизайнеров. Итак, давайте посмотрим какие тренды выделяют топовые дизайнеры со всего мира.
Безлимитная графика для ваших проектов
Для создания крутого дизайна для сайта, полиграфии, фотографии и прочего, как не крути, вам нужны будут качественные материалы. Это и фотографии, шаблоны, мокапы, иконки, пресеты, кисти и т.д. Все это есть в одном месте и качать можно неограниченно. Сервис ENVATO ELEMENTS с тонной материалов, готовых к скачиванию. Цена подписки от 16,50 $/мес. Переходите по ссылке и посмотрите что вы можете использовать для своего бизнеса и проектов. Подробности вы можете узнать в статье-обзоре.
ПОСМОТРЕТЬ СЕРВИС ENVATO ELEMENTS
Главные тренды веб-дизайна в 2020 году
1. Смелые, яркие цвета
В 2018 мы наблюдали восхождение смелых и ярких цветов, и они не собираются сдавать свои позиции, превращаясь в один из самых значимых трендов 2020.
Проект: Show Go Poster Collection 2018 / Автор: ∆ Studio—JQ ∆
Хотите научиться делать сайты?
Чтобы сэкономить на разработке или зарабатывать деньги создавая сайты для других? Недавно я записал новый курс «Идеальный сайт на WordPress» и «Лендинг в Elementor», где рассказал пошаговый план как создавать крутые сайты. Разработкой занимаюсь более 7-ми лет, на сайтах зарабатываю более 50 тысяч в месяц и в курсе я выложил всю технологию как делать такие сайты. Курс новый — 2020 года. Берите пока свежий. Подробнее читайте по ссылке.
Проект: Daily Posters / Автор: Magdiel Lopez
2. Яркие и насыщенные градиенты
Последние годы ознаменовались возвращением градиентов. Ожидается, что они снова войдут в тренды веб дизайна, претерпев изменения в 2020 году: в палитру добавятся насыщенные цвета в сочетании с разнообразием текстур. Градиенты в обновленной версии будут использовать двухцветные эффекты.
Проект: Magic.co / Автор: Ludmila Schevenko
Проект: Electric Objects / Автор: Rose Pilkington
Проект: Gradient Studies / Автор: Evgeniya Righini-Brand
3. Цвет года (Пантон)
PANTONE® 16-1546 Живой коралл (Living Coral)
Проект: Pantone Color of the Year 2019 | Living Coral / Автор: ∆ Studio—JQ ∆
4. Простота и удобство
Меньше значит больше» — бессменный тренд. Простота подразумевает аккуратную страницу со светлым фоном в лучших традициях минимализма. Пространство — бог: при его правильном использовании можно получить многофункциональный дизайн.
Проект: Creative case / Автор: Nikita Mahaev
Проект: A propos du cancer / Автор: Extra
Проект: Nona Home E-commerce Website / Автор: Daniel Tan
5. Больше дизайна с дополненной реальностью
Быстрый рост популярности дополненной реальности, или AR, будет заметен не только в индустрии игр, видео и приложений. У AR хорошие шансы охватить область дизайна, особенно за счет популярности мобильных устройств. Вероятным идейным вдохновителем могут стать DIA Studio, применяющие 3D типографику к повседневным объектам.
Проект: DIA / Автор: DIA
6. Экстра глубина (и полуплоский дизайн)
В 2020 году имеет смысл немного оживить традиционный плоский дизайн: добавление теней поможет сделать элементы более объемными, сохранив основные концепции минимализма, которые сделали плоский дизайн популярным. Пространство и объем — элементы новой концепции глубины.
Проект: Nike Promotion Ads — Parallax Effect / Автор: Jardson Almeida
Проект: Flyknit Lunar 3 / Автор: Callum Notman
Проект: Made You Look👁 255 | Live a little more / Автор: STUDIOJQ
7. Геометрические элементы
Использование геометрических элементов, таких как многоугольники (треугольники, квадраты, пятиугольники) и кривые (окружность или эллипс) сделает ваш проект запоминающимся.
Проект: Nike Le Quartier / Автор: Atelier Irradié
Проект: France Colombia cultural season Brand design / Автор: Graphéine
8. Больше творческой фотографии
Современные фотосессии и брендинговые кампании стану более дерзкими и экспериментальными, обратившись к искусным дизайнерским приемам. Созданный на основе бумажных зарисовок или 3D визуализации, такой дизайн совершенно точно будет выделяться и сохранится в памяти.
Проект: Aizone / Автор: Sagmeister&Walsh
Проект: Monkifesto / Автор: Snask
Проект: Nike AMD Revolution / Автор: Happy Finish
9. Дуплекс
Дуплекс (репродукция изображения с использованием полутонов двух ведущих цветов) имеет все шансы попасть в ведущие тренды веб дизайна в этом году. Эта техника не является новой — она появилась несколько десятилетий назад, но благодаря Spotify вновь обрела популярность.
Проект: Stranger Things Concept UI UX Design Web / Автор: Manuel Rovira
Источник: Spotify
10. Брутализм
Брутализм — грубая концепция, рассчитанная на захват внимания. Брутализм применяется в дизайне с 50-х годов прошлого века, в основном для оформления плакатов и афиш (направление возникло в архитектуре 40-х и стало трендом). Концепция снова востребована, ее можно встретить во всех сферах дизайна. Направление призвано шокировать аудиторию прямолинейным подходом, громоздкой типографикой и неизящными дизайнерскими техниками.
Проект: DoD Cyber Guide / Автор: Marçal Prats
Проект: Power A political party / Автор: Bruce Vansteenwinkel
11. Анимация, Gift-картинки и синемаграфика
Веб-сайты, логотипы, рекламные видео товаров и услуг — графика движения используется везде. Один из ведущих трендов графики движения — незаметные переходы, которые помогают потребителю лучше понять продукт. Графика движения присутствует и в типографике: от бросающихся в глаза заголовков на слайдерах до анимации на логотипе.
В 2020 очень вероятно возвращение в тренды синемаграфики (это статичные картинки с единичными движущимися элементами, например, изображение чашки, из которой с анимацией поднимается пар). Значимые элементы не должны быть неподвижными!
Проект: RED / Автор: Kevin Hou
Проект: cinemagraphs.com / Автор: Kevin Burg, Jamie Beck
Проект: Strong Women / Автор: Andreea Robescu
12. Генеративный дизайн
Генеративный дизайн уже несколько лет используется при разработке айдентики. За счет смешения цвета и формы этот прием позволяет добиться совершенно уникальной айдентики и повысить узнаваемость бренда.
Проект: Debrecen 2023 European Capital of Culture / Автор: Classmate Studio
Проект: Sydney School of Entrepreneurship / Автор: For The People
Проект: Archdiploma Dynamic Identity / Автор: Process
13. Набор цветов и узоров из 80-90-х
Где мы это видели? Ну конечно же: это возвращение популярных в 80-90-е цветов с их кислотным розовым и дерзкой контрастностью. Можно ли назвать эти ностальгические настроения вернувшимся трендом? Или все объясняется тем, что молодые дизайнеры — это люди, чье детство прошло в окружении сумасшедших цветов тех лет?
Их старые игрушки и сомнительные с точки зрения сегодняшней моды наряды родителей послужили вдохновением для возрождения яркого, красочного тренда, дополненного рядом современных веяний.
Проект: Yes To All / Автор: Nick Liefhebber
Проект: LOGOFOLIO 2017 / Автор: 268 Estúdio Design
Проект: 80’s inspired Pattern / Автор: Rahul Das
14. Кастомные иллюстрации
Персонализация бренда начинается с дизайна. Нахождение языка бренда посредством рисунков и иллюстраций превращает любой сайт в уникальную визитную карточку, которая будет транслировать голос бренда с самого запуска.
Проект: Bitcoin Illustrations Freebies / Автор: Milo Themes
Проект: Illustrations for Koypo Industries / Автор: Milo Themes
Проект: Lifecycle / Автор: Paperpillar Studio
15. Иллюстрации в миксе с фотографией
Эклектичный тренд на 2020 год сочетает пользовательские иллюстрации с фотографией. Этот метод дает уникальный и очень современный вид для любого проекта. Добавление рисованных элементов в обычную фотографию может сделать любую фотографию особенной, даже если вы используете ее на модной фотографии или плакате.
Проект: Magazine covers / Автор: Andreea Robescu
Проект: Insects Love / Автор: Andreea Robescu
16. Реальные фото
Фотостоки тоже подвержены влиянию трендов. В этом году будут цениться реальные, честные фотоснимки. Многие бренды используют уникальные фото, снятые в движении и без постановки. Фотография становится более искренней и напоминает моментальные снимки, сделанные в расслабленной и естественной обстановке.
Источник: unsplash
17. Изометрический дизайн и фотография
Изометрическое проектирование является способом художественного представления объемных объектов в плоскости. До того, как дизайнеры обнаружили этот прием, он использовался большей частью для составления технических и инженерных чертежей. Изометрический дизайн совершает масштабное восхождение в фотографии, иллюстрировании, 3D графике и иконографике. Можно с уверенностью сказать, что в 2020 году он будет востребован во многих креативных проектах.
Проект: Ultraviolet Break of Day / Автор: Field.io
Проект: Abstractions Vol.1 / Автор: Mohamed Samir
Проект: Isometric House / Автор: Angela Chan
18. Сочетание 2D и 3D
Создавать 3D объекты и помещать их в 2D проекты стало очень модно. Это сочетание дает уникальную внешнюю эстетику, соединяя глубину и плоскость. Технику можно применить в разных направлениях дизайна: от создания логотипов до веб-сайтов и рекламного видео. Конечный результат представляет собой сложную визуальную презентацию, которую невозможно забыть.
Проект: Daily Posters / Автор: Baugasm
19. Монохром
За последние несколько месяцев появилось множество композиций в одной цветовой гамме, на которых фон и объект на переднем плане или шрифт и тени/3D эффекты одинакового цвета.
Что произойдет, если 3D пойдет дальше в создании объема для объектов одного оттенка? Использование одноцветного 3D позволяет дизайнерам добиться иллюзии объема с помощью глубины цвета и теней.
Несмотря на отсутствие контраста возникает натуральный эффект объема, и мы видим объект, реалистично выступающий из фона. Этот магический эффект останется популярным в 2020 году.
Проект: Magrela Popcorn / Автор: Hugo Aranha
Проект: Amazonia Beverages / Автор: Hugo Aranha
Проект: Nespresso Expertise / Автор: JVG ™
20. Дудлы (иллюстрации, нарисованные вручную)
Нарисованные вручную картинки или даже просто отдельные элементы добавляют бренду уникальности. Картинки «от руки» не требуют выверенности линий и могут использовать грубые штрихи, за счет чего композиция получается более естественной.
Проект: Toasted Pets! / Автор: Brosmind ®
Проект: Awake Festival Proposal / Автор: Milo Themes
Проект: Art Hub Bahrain | Packaging / Автор: Elias Madan
21. Смешение и пересечение стилей
Иллюстрация и фотография, типографика и рисунки, градиенты с жирным шрифтом, дуплекс и яркие цвета — сочетайте 2, 3 или даже больше трендов 2020 года, чтобы получить эклектичный и запоминающийся дизайн.
Проект: Styled Social Media kit / Автор: Maksat Amirzhanuly
Дизайн логотипа
22. Адаптивные лого
В мире «отзывчивого» дизайна адаптация логотипа под любое устройство крайне важна. По-настоящему адаптивный логотип не просто уменьшается на странице, а претерпевает дополнительные изменения и подстраивается под окружающий контекст.
Адаптация логотипа стала топовой задачей для дизайнеров: бренд должен быть эффектно представлен вне зависимости от пространства и измерений. Бросая вызов дизайнерам, адаптивные логотипы становятся маст-хевом в 2020 году.
Проект: Responsive Logos / Автор: Joe Harrison
Автор: Design Studio
23. Логотипы с анимацией
Логотипы с анимацией используются уже некоторое время, но сегодня их можно увидеть практически на любом сайте. Анимированные лого способны отобразить историю бренда и увеличить конверсию за счет хорошей узнаваемости.
Проект: Type With Pride Gilbert font / Автор: Fontself Team
Проект: Logo Visual identity / Автор: Mariusz Mitkow
24. Яркие и забавные лого
Красочные лого с забавными элементами, анимацией и кастомными рисунками — значимый тренд 2020 года. Бренды хотят создать позитивный посыл потребителю, а развлекательный подход этому очень способствует.
Проекты: Axel Flores, Vladimir Lifanov, Silvestri Thierry, Vadim Carazan, Onrepeat Studio, Serafim Mendes
25. Негативное пространство
Негативное пространство остается горячим трендом в дизайне. Этот тренд продолжает потрясать основы веб дизайна, хотя активно используется уже некоторое время. Ранее дизайнеры обращались к негативному пространству для создания минималистского стиля, новшество этого года — наполнение свободного пространства яркими цветами, геометрическими фигурами и узорами.
Проекты: SeisTrece Studio , Vadim Carazan, Quim Marin, Bureau Rabensteiner, Andrei Traista
26. Геометрические фигуры и узоры
Оформление логотипа едва заметным кастомным узором делает громкое заявление о бренде. Мелкие геометрические элементы добавляют логотипу разносторонности и оригинальности, поэтому мы определенно увидим этот прием в 2020 году.
Проекты: islam biko , Quim Marin, Silvestri Thierry, Vadim Carazan
27. Монограммы
Монограммы никогда не исчезнут в сфере дизайне логотипа. Это способ создать стабильность, показать качество и традиции в бренде. Монограммы также могут быть созданы с использованием более современного подхода, смешивая некоторые современные тренды с этого года как яркие цвета, дуплекс или геометрические узоры.
Проекты: Milo Themes, Romain Billaud
28. Градиенты
Градиенты — один из главных трендов, унаследованных от 2017-2018 годов, и конечно же, он коснется дизайна логотипов. Легкий градиент или смелые переходы, что выберете вы?
Проекты: MICHAEL SPITZ, Nicholas Slater, Jeroen van Eerden, Vadim Carazan
29. Наложения
В связи с восхождением тренда дуплекс эффект наложения элементов друг на друга невероятно популярен в дизайне логотипов. Взгляните на нашу подборку.
Проекты: CaveLantern, Fontself Team, Rosie Manning
Веб-дизайн (Ui/Ux)
30. Концепция Mobile First
Ни для кого не новость, что мобильный трафик превышает десктопный. Веб дизайн 2020 года учитывает значимость мобильной версии динамических иконок, меню и подменю.
Проект: Food Drinks app Interaction Collection / Автор: Johny vino™ .
31. Микровзаимодействия
Они повсюду. Каждый раз, когда вы лайкаете что-то на facebook или пролистываете контент в мобильном приложении, вы участвуете в микровзаимодействиях. И они неплохо работают, учитывая, что их цель — активность пользователя и динамичный UX.
Элементы становятся текучими: кнопки могут менять форму, и все поверхности скрывают анимированные сценарии, ожидающие прикосновения и активации. Готовы спорить, что они не покинут пьедестал и в 2020 году.
Проект: My idea | An incident in front of you! | Playlist — Radial Interaction / Автор: Johny vino™ .
Проект: Brewskies v2 / Автор: Kevin Yang
Проект: Gesichtspunkt / Автор: Alim Maasoglu
32. Встроенная анимация
Элементы со встроенной анимацией ненавязчиво помогают пользователю в процессе просмотра сайта. Они скрашивают ожидание полной загрузки контента и проявляются при взаимодействии с элементами и процессами на странице, к примеру, при скроллинге или наведении фокуса на определенный блок.
Присутствие анимированных персонажей на странице помогает установить контакт с пользователем, расширяя привычное взаимодействие с сайтом.
Проект: inturn website / Автор: INTURN
33. Креативные экраны загрузки
Сайты, использующих скучные экраны загрузки, устарели. Почему бы не компенсировать пользователю время вынужденного ожидания креативным подходом? Ниже приведены 2 выдающихся примера применения креативных вариантов загрузки сайтами Contemple и Awwwards.
Проект: Contemple
Проект: Awwwards Conference / Автор: Adoratorio
34. Раскладка с ломаной «сеткой»
Некоторые дизайнеры считают, что традиционная «сетка» раскладки ограничивает их креативность, поэтому стремятся изменить правила и высвободить свою творческую энергию. «Сетка» с наложением картинок и текста друг на друга способна создать уникальный экспериментальный дизайн.
Проект: The Refugee Nation Web Design Branding / Автор: Justin Au
Проект: Ueno Concepts / Автор: Ben Mingo
35. Разбивка страницы
Разбивка страницы на части позволяет разделить контент семантически, например, изолировав текст от картинок или расположив информацию по иерархии. В 2020 году, когда объем информации продолжает расти, никто не хочет пробираться через нагромождение контента. Разбивка станет для дизайнеров тем волшебным инструментом, который поможет вместить все, не потеряв в UX и эстетике.
Проект: Product Landing Page UI / Автор: Dinesh Shrestha
Проект: Design Thinking / Автор: Radowan Nakif Rehan
36. Больше (интерактивного) 3D в оформлении
Главный тренд, который признает современный веб дизайн 2020 — восхождение (интерактивных) 3D элементов, экспериментирующих с глубиной, движением, текстурой и перспективой. Использование 3D элементов и 3D среды делает каждый веб-сайт выcокоуникальным, улучшая его внешний вид и/или пользовательский опыт. В качестве примера можно привести Atacac, который создал интерактивный футуристичный шоу-рум виртуальной реальности, позволяющий посетителям сайта рассмотреть каждый предмет одежды со всех сторон. Другой яркий пример — вращающаяся 3D скульптура сайта The Artery.
Проект: Atacac 2017 Yearbook
Проект: The Artery
37. Закругленные углы и плавные формы
На протяжении последних лет в дизайне преобладали прямые углы и остроконечные геометрические фигуры. В последние месяцы их сместили плавные линии и округлые формы. В сочетании с сочными цветами и использованием слоев этот тренд укрепляет свои позиции.
Проект: LuxuryClean UIUX iOS App / Автор: Mariusz Mitkow
Проект: Landing page project design / Автор: Mariusz Mitkow
38. Фоны с движущимися элементами
«Заставь меня читать» — скрытое обращение пользователя к любому веб дизайнеру. Фоны с движущимися элементами решают эту задачу, притягивая взгляд, но не отвлекая внимание от текста. К тому же они не вызывают проблем при загрузке в отличие от фонов из видео.
Едва уловимое движение текстуры, легкая анимация, эффект вплывающих пузырьков — все они отлично впишутся в веб дизайн сайта, цель которого — понравиться пользователю. Даже в 2020 году.
Проект: Wibicom / Автор: Wibicom Agency
39. Футуристические узоры
В начале 2000-х будущее виделось похожим на показанное в «Матрице»: бегущие по экрану цифры, технологии, робототехника, пульсирующий свет.
Сценарий утратил свою привлекательность, когда стало понятно, насколько далеко фильм отошел от реальности, которая оказалась намного менее футуристичной. Однако благодаря Глубокому Анализу и Big Data мы наблюдаем возвращение робототехнических трендов: футуристические орнаменты найдут применение и в 2020.
Проект: Crown Tech / Автор: Jan Wolinger
Проект: SpaceShip / Автор: Arif Rachman Hakim
Проект: Data Visualization Concept / Автор: Mario Šimić
40. Монохромные иконки
В то время, как остальное пространство страницы наполняется цветом и градиентами, иконки продолжают следовать «моно» правилу, ведь их главная цель — оставаться читабельными. Небольшое заполнение вариациями одного цвета сделает иконку визуально привлекательной, а не только информативной, и ловко впишет ее в общий дизайн.
Проект: Icon Design / Автор: Eaton
41. Иконки, частично заполненные цветом
Части графических иконок будут закрашиваться цветом. Это будет не полное заполнение, а лишь легкое прикосновение цвета, оставляющее пробелы, словно иконка небрежно нарисована от руки. Заливка, которая не перегружает иконку и сохраняет ее читабельной.
Проект: Alfred icons / Автор: Andrea O
Проект: Icons / Автор: Alisa_
42. Скроллинг с Parallax
Скроллинг с Parallax настолько вездесущ, что невозможно не принимать его во внимание. Когда скроллинг может управлять скоростью анимации, единственный лимит дизайнера — воображение.
Parallax — бессменный тренд веб-дизайна, продолжающий делать сайты оригинальными и запоминающимися. Создавая 3D эффект между движущимися передним планом и фоном, Parallax придает неуловимую глубину странице и плавность пролистывания контенту.
Проект: Dex Multi-Layer Parallax / Автор: Milo Themes
43. Мондрианизм
Желание свободы и эквилибриума (гармонии) — врожденное стремление человека (по причине присутствия в нем вселенной)», сказал Пит Мондриан. Мондрианизм станет трендом 2020 года: стиль, в котором соединяются базовые цвета — красный, желтый и синий, создавая впечатление чистоты, гармонии и уравновешенности.
Эквилибриум, основанный на прямоугольных формах и базовых цветах, с идеальным с точки зрения удобства пользователя размещением элементов.
Проект: Mondrian / Автор: Stugbear
Проект: Guernica / Автор: Shota
Типографика
44. 3D — моделирование
3D — многообещающий тренд, охвативший все сферы дизайна. Объемный текст добавляет реалистичности общей композиции.
Проект: Atypical / Автор: Pawel Nolbert
Проект: Alphabet Project / Автор: Serafim Mendes
Проект: RE NEON vI / Автор: Omar. Aqil
45. Жирная типографика
Жирная типографика была большой трендом в последние годы, и она определенно останется. В 2020 году мы увидим гораздо более смелую типографику в сочетании с яркими цветами. Поэтому помните, что если вы хотите сделать сильное заявление, смелая типографика это отличный метод.
Проект: Club AVi’s XII-year Anniversary Posters Series / Автор: Milo Themes
Проект: TEDxGroningen / Автор: Rudmer van Hulzen
46. Serif шрифты
На протяжении нескольких лет в типографике преобладали sans-serif шрифты, но сейчас наблюдается возвращение serif. Ниже представлены несколько интересных проектов, авторы которых выбрали serif шрифты и добились впечатляющих результатов.
Проект: Custom Type Design / Автор: Moshik Nadav Typography
Проект: Lux Naturalis Gala Invitation
47. Геометрический шрифт
Геометрические шрифты были востребованы последние несколько лет и остаются важным трендом и в 2020 году.
Проект: VitrineMedia / Автор: Graphéine
Проект: Sydney School of Entrepreneurship / Автор: For The People
48. Кастомные шрифты
Эксцентричные кастомные шрифты становятся хитом среди дизайнеров. Фрагментированный, искаженный или ломанный шрифт определенно выделяется на фоне других, на что и делается расчет. Некоторые из подобных шрифтов еще и интерактивные, с откликом на движения курсора мыши. Уникальности кастомных шрифтов нет предела, и в 2020 году мы увидим множество экспериментов с ними.
Проект: Lingerie XO The Sexiest Most Powerful Typeface Yet / Автор: Moshik Nadav Typography
Автор: Jeanne Bataille
49. Эксперименты с выравниванием и кернинг
Хаотичность в типографике была одним из главных трендов 2018 и остается на вершине в 2020 году. Забудьте о правилах и дайте простор фантазии!
Проект: Studio Studio / Автор: Rudmer van Hulzen
Проект: nyMusikk annual report 2016 / Автор: Non-Format
50. Экспериментальная типографика
Дизайнеру следует экспериментировать со шрифтами, добиваясь инновационных результатов. Добавляя в существующие шрифты негативное пространство или кастомные элементы, можно добиться потрясающих результатов.
Проект: Experimental Chinese Typography / Автор: Letitia Lin
51. Типографика в миксе реальными фото
Эклектичные тренды всегда эффектны, и этот не исключение. Добавляйте типографику в фотоснимки или 3D отрисовки и получайте авангардный дизайн.
52. Креативная типографика
Креативная типографика, применяющаяся уже некоторое время, не только не исчезнет в 2020 году, но и получит статус одного из главных трендов. Свободное от условностей применение этой техники поможет построить «мир, созданный воображением». «Используй шрифт, чтобы впечатлять» — лейтмотив этого года.
Проект: ILOVEDUST — 3D TYPE COLLECTION 1 / Автор: ILOVEDUST
Проект: Typography 3D — 9 / Автор: Alexis Persani
Дизайн упаковки
53. Плоский дизайн
Плоский дизайн до сих пор остается востребован в оформлении лейблов и упаковок. Плоские фигуры, узоры и кастомные иллюстрации — верный выбор в 2020 году.
Проект: Cheddar-Cheese-Melt-Mcdonalds-Packaging / Автор: Mostafa Abdelmawla
Проект: The-Gang / Автор: MARKA NETWORK
Проект: Melio / Автор: Rachael Batley
54. Минималистский дизайн
Дизайн со множеством элементов ушел в пошлое, вся второстепенная информация должна уступить место важной. Этот тренд активно использует отрицательное пространство, чтобы пользователь взаимодействовал только с необходимым ему контентом.
Проект: Sarta-Milano / Автор: MARKA NETWORK
Проект: Gyalmo / Автор: Łobzowska Studio
55. Узоры и фигуры
Геометрические
Геометрические формы будут присутствовать во всех сферах дизайна. Выбирайте орнаменты, которые отражают суть продукта.
Проект: NICHE-Tea / Автор: IWANT design
Кастомные фигуры и элементы
Персонализированный дизайн — обязательная составляющая в построении идентичности бренда.
Проект: aleFanty / Автор: less
Проект: Nature Organic Chocolates / Автор: Mike Karolos
Дудлы
Дудлы — свежий тренд этого года во всех направлениях дизайна, а разработка айдентики — идеальное поле применения для этих смелых рисунков. Дудлы могут преобразить обычный скучный дизайн в интересное и уникальное произведение искусства.
Проект: Zoe-Juices / Автор: Beetroot Design
Винтаж
Винтажные узоры остаются в теме, их традиционно принято связывать с определенным уровнем качества. Винтажный дизайн опирается на детали и способен создать айдентику, которая будет актуальна долгое время.
Проект: Mutti Special Edition for FICO Eataly World / Автор: Auge Design
56. Смелая типографика
Смелая типографика создает сильный и однозначный посыл. Если нужно, чтобы продукт выделялся, используйте большой шрифт в связке с яркими цветами.
Проект: Refresh
Проект: Amilk & Adidas / Автор: Duy Dao
57. Цвета
Дерзкие цвета
Сочные цвета — хит этого года, поэтому мы не раз столкнемся с ними в оформлении. Дополненные сумасшедшими узорами и геометрическими фигурами, яркие цвета преобразят оформление любого продукта.
Проект: Deker-rebranding / Автор: less
Проект: Mochila / Автор: Sweety & Co.
Пастельные цвета
Пастельные цвета — тренд-реакция на яркие цвета, охватывающий все больше пространства в оформлении. Мягкие оттенки транслируют теплое отношение к потребителю.
Проект: Freshly Baked / Автор: Design Happy
Проект: Ela cosmetics / Автор: ChocoToy cute
58. Необычные текстуры и формы
В оформлении упаковки разрешено все: от стекла до металла. Упаковка продукта должна выделять его на фоне аналогов и делать запоминающимся. Использование необычных материалов для современной инновационной упаковки — новое требование в дизайне.
Проект: Sprout Green Paulownia Wooden Box / Автор: Yinjue
Проект: Eco bamboo tooth brush / Автор: Margas Family
59. Голографический эффект
Голографический эффект — вернувшийся тренд. Металлические текстуры позволяют достичь футуристического эффекта и создать магически притягательный дизайн.
Проект: EAT ME / Автор: PACKVISION AGENCY
Проект: Sphynx / Автор: Anagrama Studio
60. Градиенты на упаковке
Добавьте мягкие градиенты для создания глубины или используйте яркие цвета для более прямолинейного эффекта.
Проект: YOU & OIL natural cosmetics / Автор: Irmantas Savulionis
3D
61. 3D натюрморты
Последние годы был заметен рост числа проектов с 3D дизайном. Наблюдая работы некоторых 3D художников из топа, например MVSM или Питера Тарка, можно предсказать, что в 2020 году популярность 3D натюмортов возрастет. Для корпоративных коллабораций тренд окажется на одном уровне важности с разработкой лого и размещением продукции.
Проект: Squarespace stillife / Автор: MVSM
Проект: Adobe Government / Автор: Peter Tarka
Проект: Audi Q-Riosity / Автор: Peter Tarka
62. Абстрактные фигуры
Абстрактные 3D фигуры и яркие цвета — микс года. Это определенно один из самых влиятельных трендов, так что не упускайте его из вида.
Проект: Logitech CRAFT / Автор: Pawel Nolbert
Проект: SWEET SPIRALS / Автор: Kirill Maksimchuk
63. 3D отрисовка в стиле металлик
3D отрисовка в стиле металлик смотрится эффектно и несомненно относится к трендам, которые интересно отслеживать в 2020.
Мощные инструменты отрисовки делают возможным создание безупречных и изящных 3D моделей. Благодаря им стал доступен реалистичный и привлекательный металлик эффект, излучающий роскошь и благородство. За счет правильного применения света, отражений и теней поверхности и элементы в стиле металлик обретают глубину и реализм и больше не выглядят неуместно.
Проект: Grand Spectacular 2016 / Автор: Mustaali Raj
Проект: Various Concepts / Автор: Oleg Morozov
Проект: NIKE FC 3D Golden balls in the real world / Автор: T A V O .
64. 3D графика с анимацией
Поскольку анимация все больше завоевывает мир дизайна, 3D графика с анимацией определенно достойна внимания в этом году. Вместе с аудио данное направление анимации станет хитом всех мультимедиа проектов. Используя визуальные и кинематические эффекты, моушн-дизайнер может вдохнуть жизнь в 3D персонажей и типографику, добавляющих уникальности продукту.
Проект: NIKOPICTO SHOWREEL 2018 / Автор: Nikopicto
65. Очень реалистичное 3D
3D всегда вызывает восторг и будет возглавлять современные тенденции веб дизайна 2020. Этот эффект способен обыграть реальность и вымысел так тонко, что их практически невозможно отличить. Картинка это или отрисовка? Грани продолжают стираться…
Проект: YOOX: Make a Wish / Автор: JVG ™
Проект: Air Max ’17 / Автор: Berd .
Статья собрана из источников:
- Design Trends Guide by Milo Themes
- Design Trends by Duminda Perera, Massimiliano Albizzati, Secil Kaya, Camilla Maccaferri
- Design Trends by Filip Triner
- Design Trends by Epicco Digital, Mark Banaynal
- Design Trends by Rylan Ziesing, Rhino Design
СПАСИБО!
Спасибо, дорогой друг, что дочитал данный лонгрид с трендами веб дизайна 2020 до конца. На его сбор, перевод и публикацию ушло 8 дней и если вам не сложно уделите 30 секунд, чтобы поделиться им в соц.сетях или на своем ресурсе, тем самым вы очень поможете распространить данный материал. Спасибо большое =)
Самый полный обзор трендов веб-дизайна (UI/UX) на 2020 год
Вы читаете перевод статьи “UI/UX Design Trends for 2020”. Над переводом работали: Анастасия Свеженцева и Ольга Жолудова.
Итак. Что же тут у нас сегодня. Поехали. Кстати, если вам интересно расширить свой арсенал навыков, поглядите новый обзор курсов по UI-дизайну и анимации.
Тренд 1: Продвинутое ценностное предложениеТехнологии продолжают качаться, что конечно же дает дизайнерам свободу творить и насыщать инженерные решения не только эмоциями и ощущениями, но и глубоким смыслом.
Каждый продукт начинает рассказывать свою уникальную историю для аудитории (с особенными предпочтениями).
Фалтер Инферно, Wild. Изображение сегодняшнего живого ада, взывающего вас взглянуть в зеркало.
Вспомните, гештальт-теория подразумевает, что целое больше, чем сумма его частей. И даже когда мы решаем бизнес-задачу с помощью дизайна, мы уже способствуем чему-то большему, чем благополучию компании.
Интересуетесь свежими статьями по дизайну? Вступайте в группу на Facebook.
Мы все также можем влиять на людей при помощи впечатлений и ощущений, которые дают продукты. К тому же тренд влияния на социум набирает обороты, и то, что движет компанией во время работы, становится так же важно, как и качество продукта или услуги.
Тренд 2: UI-анимация с упором на пользовательский опыт и впечатленияПричина, по которой вы делаете что-то, будет важнее того, что вы делаете.
Есть такое заблуждение, что сложная анимация зависит от аппаратного обеспечения настолько, что нет смысла ее создавать для массового потребителя со слабенькими процессорами.
Оказывается, есть продукты, способные превзойти отраслевые стандарты, заточенные для «слабого железа». Такие продукты – новая высота для производителей оборудования. GreenSock одна из таких. Ребята делают плагины и инструменты разработки интерактивной анимации.
Их детище оптимизирует процесс создания интерактивных проектов для работы практически на любом устройстве, получается мягонько плавненько и без тормозов. Анимации просто радуют глаз.
Corn. Revolution от Resn с сайта GreenSock.
Анимация в продукте – это полноценная чувственная история, которая действует в разы мощнее чем просто текст. С технологиями TweenMax и WebGL вы можете выразить через анимацию ту самую суть. Для многих дизайн-агентств в том числе и для нас, это еще не паханной поле, но как же круто наконец принести в мир огненную анимацию.
Тренд 3. Асимметрия и экран пополамВремя двигаться. В прямом смысле.
Блочный лейаут – это классика, он помогает помогает организовать информацию и сделать ее легко схватываемой на лету. Фактически – он основа страницы. Блоки – это симметрия. Тем не менее, существует и асимметричный тренд, и он всегда был на рынке, хоть и не был мейнстримом даже в эпоху широкоформатных экранов.
Baas Amsterdam и ассиметричный макет.
Нам кажется, что в этом году асимметрия вернется вновь. Во-первых, каждый сейчас работает в нескольких инструментах и наблюдает их борьбу за пространство на экране. Мы уже привыкли к культуре деления пространства на экране, и этот принцип находит свое отражение в макетах.
2019 – ежегодный отчет от Abb-d Choudhury и Sara Scobie.
То, что изначально имело функциональную природу для предоставления двух отдельных блоков информации на одном экране, теперь становится визуально привлекательным способом представления информации любого типа. Королевой асимметрии в 2019 году стала Zhenya Rynzhuk. Рады наблюдать за ее успехами. Подписывайтесь на нее.
Тренд 4. Неброские градиентыРазделяйте.
Общая тенденция в области дизайна направлена на автоматизацию, применение AI, меньше значит больше, и все такое. Тем не менее, визуальные элементы, в таком дизайне по-прежнему являются в значительной степени человеческой работой.
Один из таких примеров – это нежные цвета, а также упрощения и сокращения. Основная идея в том, чтобы добавиться впечатления чего-то умного и автоматизированного, в итоге получаются легкие и мечтательные оттенки.
10 Quota – Держите цитату дня ✌️ Анимация Sebastian Jungbluth2018 год был годом синих и фиолетовых градиентов. 2019 год такой же, но с более мягкими оттенками. Поэтому ждем больше разбавленных цветов в 2020 году.
Тренд 5. Гармоничные цветаНе раздувайте пламя.
Цвета 2020 года сочетают в себе оптимизм и недосказанность.
В целом, смена цвета, ожидаемый тренд во всех отраслях дизайна. В грядущем году они будут еще более натуральными, чем палитры прошлых лет.
A+WQ / Young Lab Slider Animation от Zhenya Rynzhuk.Однако, это не означает, что все цвета должны быть одной палитры. Яркий неуместный цветной элемент усилит этот эффект еще лучше.
Тренд 6. Пишите для людейСбавьте тон.
Развивающийся UX-копирайтинг в последние два года добрался до высокой планочки для копирайтеров. Сам термин «UX Writing» скорее всего исчезнет, поскольку любой копирайтинг для людей и есть UX-копирайтинг.
Текст не сопровождает дизайн, он его часть. Контекст решает, автор решает. Текст так же важен, как и то, что происходит после него. Картинка к статье бесспорно должна соответствать образу мысли читателя и его культурным нормам – это уже подтверждено исследованиями. Когда пишите для людей, вы помогаете читателю с принятием решения, помогаете выбрать продукт и сформировать к нему свое отношение.
До: «Ом» — облачная платформа для управления командной работой, контроля качества обслуживания клиентов и управления ресурсами.
После: «Ом» — программа для управления людьми. Помогает не срывать сроки, грамотно отвечать на звонки и находить бездельников.
Не срывать сроки. Раздаете сотрудникам задания, они видят их в «Оме» и выполняют. Когда придет срок, «Ом» напомнит сотруднику о задаче. Если сотрудник не справится — «Ом» вам сообщит.
Грамотно отвечать на звонки. «Ом» ведет досье на каждого клиента. Когда клиент звонит к вам в офис, «Ом» соединяет его с нужным менеджером и выводит на экран это досье. Менеджер сразу в курсе, кто ему звонит, что он покупал в прошлый раз и как дела по его проекту.
Увольнять бездельников. «Ом» знает, кто, что и как делает в компании. Если кто-то из менеджеров постоянно срывает срок или закрывает мало сделок, «Ом» покажет это в отчете.
Тренд 7. Миксуем опытНе существует волшебных слов.
Визуальная коммуникация сильнее слов. Микс быстро загружаемых видео, встроенных в макеты – хороший способ поднять уровень пользовательского опыта. Контент – все еще король, а способ его доставки играет огромную роль в воздействии, которое он оказывает.
Кофейная компания Allpress Culture.Микс контента – это про создание полезного опыта. Позже мы поговорим о настройке опыта на основе поведения пользователя, но основным трендом является сайт, как единая композиция из видео и иллюстрация, а не простая линейная верстка блок за блоком.
Аниме “OBSOLETE” от JUNNIE.
Тренд 8. Красота вернуласьСоздавайте опыт, а не ui-киты и руководства по стилю.
Здесь нечего сказать. Просто примите это. В этой книге всемирно известные дизайнеры Стефан Загмайстер и Джессика Уолш исследуют сущность красоты и преобразующую силу эстетически красивого дизайна.
Загмайстер и Уолш: О КрасотеВ этой новаторской визуальной книге они поставили перед собой задачу: выяснить, что такое красота и как она влияет на нашу жизнь. Они обращаются к философии, истории и науке, чтобы понять, почему нас привлекает красота и как она влияет на наши чувства и поведение. Будучи преисполнены решимости воплотить свои открытия в жизнь, Загмайстер и Уолш показывают нам, как красота может сделать мир лучше.
«Убедитесь, что ваше решение создано людьми, для людей».
– Стефан Сагмейстер.
Для кого эта книга: Для дизайнеров, иллюстраторов, архитекторов, фотографов, художников и всех, чья работа связана с визуальными видами искусства. Для всех, кто неравнодушен к красоте и стремится понять ее сущность.
Тренд 9. Desveloper (Дизайнер разработчик в одном лице)Криптонит дизайнера – это разработка. Иногда мы проектируем вещи, которые невозможно реализовать в определенные сроки, бюджет или силами имеющейся команды. Некоторые дизайнеры учатся кодить и становятся «опасными», потому что они знают достаточно, чтобы спорить, но недостаточно, чтобы на самом деле сделать это.
Эта дихотомия должна прекратиться в 2020 году, благодаря таким инструментам будущего, как Webflow. По сути, это визуальный инструмент, который позволяет вам создавать все, что угодно, до тех пор, пока это можно сделать с помощью HTML и CSS. Каждое движение пикселя является изменением кода, что делает этот подход идеальным способом для дизайнеров начать кодить.
Когда все движется к дизайну взаимодействия (interaction-based design), становится все труднее объяснить, как то самое взаимодействие должно работать и выглядеть. Поэтому важность и необходимость такого визуального инструмента для воплощения решений трудно переоценить.
Тренд 10. Белое пространствоСтаньте «опасным» дизайнером. Возьмите код на вооружение.
Когда множество элементов схватились за внимание, никто из них не получит его достаточно. Но когда один элемент выделен, он возьмет на себя все внимание. Учтите идею заложенную в интерфейсе и дайте ему пространство, чтобы не позволить этой идеи утонуть.
Есть микро и макро пустые пространства, пространства для текста и абзацев, они могут быть активными и пассивными, и все они масштабируются. В этом есть прагматический аспект, поскольку мы склонны обрабатывать сжатую информацию дольше и с меньшим пониманием.
Домашняя страница творческой студии Hello Monday с большим количеством пустого пространства.Окружение идеи пустым пространством – это способ выделить идею. Теперь давайте удостоверимся, что выделяемая информация, того стоит.
Белое пространство – инструмент умелого дизайнера
Тренд
11. Рендеры с чувственным опытомКроме применения векторных иконок, особенно в блоках «наши фишки», топовые дизайнеры продолжат активно применять рендеры в своих работах.
Потрясающая презентация Apple AirPods Pro / лендинг.
Чтобы представить продукт или услугу в 2020 году, все больше компаний будут применять супер-детальные изображения продуктов и людей, использующих эти продукты.
Изображения в высоком разрешении передают чувственный опыт и создают ощущение “в одном шаге от покупки”. Главное не тормозить загрузку промо-страниц, иначе все может скатиться снова в плохой UX
Вот это по настоящему, я чувствую это.
Тренд
12. Множество вариаций UXПодобно тому, как есть разные типы темперамента, есть разные типы поведения в Интернете. Долгое время мы создавали дизайны только среднестатистического пользователя в среднестатистическом контексте со среднестатистическим уровнем вовлеченности.
В эру больших данных мы можем адаптировать опыт для бесконечного числа людей, основываясь на их поведении. Современная аналитика позволяет нам определить, с кем вы имеете дело: просто путешествующий странник, неуверенный лидер или решительный герой. В зависимости от того, сколько времени они проводят на экране или скорости прокрутки, веб-сайт ведет себя по-разному.
Веб-сайт изменяет размер изображения iPhone 11 Pro в зависимости от вашего скролла.Такой подход требует активной позиции к исследованию пользователей и, возможно, не совсем подойдет для сервис-дизайнеров, но для бренд-дизайнеров годится как никогда. Это означает обеспечение каждого пользователя полным присутствием: понимание сцены, настроения и последствий действий, предпринимаемых пользователем.
Натренируйте ваши дизайны понимать контекст.
Тренд
13. Мобильный опытДвижение PWA устраняет пропасть между приложениями и мобильными сайтами. Доступ к одной и той же фиче теперь должен быть возможен двумя способами, что обязывает дизайнеров создавать согласованные паттерны UX.
Одним из различий между приложениями и мобильными веб-сайтами является необходимость в браузере. 2019 год – год, когда появился первый настоящий мобильный браузер Cake.
Юморист Эстер Повицки демонирует Cake – мобильный браузер.
Технически это приложение из AppStore, которое предназначено для освобождения пользователей от приложений. UX этого браузера как у приложений, только заточен он для поисковых систем и просмотра веб-сайтов.
Встречайте свайп.
Тренд
14. Наслоение типографикиЭто продолжение тренда смелой типографики. Заголовки перекрывающие постеры являются альтернативой звуку. С его помощью вы можете передать идею графически привлекательным способом.
Заголовки домашней страницы Orkestra перекрывают изображения.Мы ежедневно потребляем большое количество информации в текстовом формате, читая, мы мысленно проговариваем ее. Попробуйте помочь пользователям потреблять эту информацию в более увлекательном формате.
В студии Spatzek нет никакой суеты.Мы ежедневно потребляем большое количество информации в текстовом формате, читая, мы мысленно проговариваем ее. Попробуйте помочь пользователям потреблять эту информацию в более увлекательном формате.
Largo Studio использует перекрывающийся текст, чтобы проиллюстрировать видео их работы над проектом.
Замолвите за это словечко.
Тренд
15. Иллюстрации выражение особой культуры компании и продуктаК 2020 году все будет проиллюстрировано до такой степени, что мы заново изобретем стили иллюстрации, которые являются ничем иным, как произведениями изобразительного искусства, созданными теперь на цифровых носителях.
Это огромное окно возможностей для художников, которые терпеть не могут сток.
Иллюстрации Absurd.designС этой тенденцией все сводится к тому, как вы ее продаете. Absurd design – это хороший пример чисто художественного подхода к созданию контента и постановки его на бизнес-рельсы.
Иллюстрированное меню Qode Interactive CatalogСначала веселье, потом бизнес.
Тренд
16. Кастомная навигацияПродукты, которые предоставляют каждому особенный пользовательский опыт – важнейший тренд в 2020. Если вам требуется усилить бренд с помощью мощных визуальных средств, вам следует использовать все ресурсы веб-сайта, в том числе и навигацию.
Сайт Corphes перевернул навигацию, призывая вас подняться на вершину, а не спускаться.Навигация может дать нужный эффект, если она логически вплетена в историю. Существует два типа элементов навигации: видимый и скрытый. Важно спроектировать навигацию, основываясь на пользовательских сценриях = потоках данных.
Меню навигации сайта 2ndstreet повторяет расположение заголовка страницы.17. Полноэкранные визуальные эффектыПлывите по эффекту, а не ждите его окончания.
Займите всю площадь экрана ключевым сообщением. Примените центральной выравнивание. Так вы по максимум привлечете внимание пользователей, только еще учтите естественную тягу внимания к центру страницы.
Главная страница сайта Brand Studio – это окошко в безумный мир.
Чтобы создать захватывающий опыт не забудьте оставить намек на то, что здесь есть еще много полезной информации и перед пользователем только часть видимого контента. Это поможет юзерам сориентироваться и приступить к дополнительным исследованиям, что повысит доверие и снизит показатель отказов.
Shimane Misato из Японии – это интерактивная полноэкранная история.
Вы можете сыграть эффект только однажды для вовлечение на старте или же удерживать внимание увлекательной серией эффектов по мере изучения страницы. Такой подход годится особенно для объемных материалов, в которых неподготовленных веб-серфер мог бы попросту уснуть. С анимацией и эффектами контент станет увлекательнее.
Сайт Fishing Feed знакомит вас с проблемами рыболовной индустрии.
18. Визуализация данныхНе стройте стены, сносите их.
Поскольку технологии, которые создают потрясающий интерактивный опыт, становятся все более доступными, маркетологи могут строить свои целые стратегии вокруг визуальных данных. Показывать лучше, чем рассказывать, но если вы можете рассказать и показать, это самое крутое решение.
WebGL и 3D – это крутая комбинация, особенно если есть интересные данные. Любая выборка данных – это ценный источник для лидогенерации. Все, что нам нужно сделать, это отфильтровать их, найти наиболее сочные и интересные фактыы и применить их.
Autoneum – это визуализация автомобильного акустического управления, целая наука.
Визуализация данных – это не только диаграммы и графики. В зависимости от того, что важно пользователю, мы можем выбрать источники данных и представить их в формате увлекательной графической истории.
19. Непрерывный UXВизуализируйте, что важно, а не то, что доступно.
Хотите продукт? Нажмите здесь и зайдите на эту страницу. Хотите увидеть больше фотографий? Нажмите здесь и прокрутите. Хотите обзоры? Нажмите здесь и ознакомьтесь с нижним разделом. Хотите купить? Нажмите на значок корзины, затем перейдите на страницу «Оформить заказ», укажите свою кредитную карту, но до этого зарегистрируйтесь, заполните 27 текстовых полей, согласитесь с «Условиями и положениями», получите счет-фактуру по электронной почте, отследите свой заказ.
Каждый шаг этого процесса побуждает вас сомневаться в намерении купить. Каждое поле, которое вы должны заполнить, отнимает время. С таким подходом вы требуете от пользователя невероятной мотивации пройти процедуру покупки онлайн. Возможно, потому что сегодня люди знают, как продавать вещи.
А что, если бы, сайту для отправки покупки было нужно только ваше намерение совершить покупку. Одна кнопка для управления всем процессом. Мобильный телефон уже применяет этот прием, интегрируя в платежи простые жесты, а еще есть Face ID. Нам еще предстоит увидеть рост этого тренда в Интернете.
Конфигурация велосипеда от Den Klenkov – это потрясающий пример совершенно нового опыта покупки онлайн.Технологии уже многое знают о нас. Почему на полную не применять эти знания для улучшения UX. Пользователь не должен раздумывать, о том стоит ли доверить вам свою личную информацию. Если вы запрашиваете данные, они должны быть в сохранности. И это наша обязанность. Задача продукта – принять намерение пользователя и превратить его в удовольствие. Что бы мы ни использовали для этого, это нормально, если наши действия остаются в рамках этических норм и соответствуют современным требованиям безопасности.
Интернет работает на куки. Без них он превратился бы барахло. Теперь очередь за геолокацией. Непрерывный UX начинается там, где к конфиденциальной информации относятся, как торговому таинству, а не товару.
Речь идет не только о покупках. Любая цель пользователя должна рассматриваться подобным образом. Если вы выиграли битву за внимание пользователя, вы не можете проиграть битву за его удовлетворение.
20. Собственный путьНе перебивайте человека, который хочет дать вам свои деньги.
Технологический хайп держит всех в напряжении. В стремлении к немедленному обожанию мы начинаем забывать, что привело нас в отрасль, а ведь это годы учебы, шишки, синяки и какой-то опыт, заработанный.
Слепо стремясь к хайпу, мы пренебрегаем этим ради нескольких лайков и репостов на Dribbble. Тренды дизайна – это круто, но лучше иметь собственное мнение.
Быстрый тест. Прокрутите публикации в своем творческом аккаунте за последний год. Сколько хайповых вещей вы там нашли? Уверен, что тоже самое будет с Cybertruck через год. Нет ничего плохого в том, чтобы зарабатывать деньги, но дизайнеров запоминают за то, что они не такие как другие. Рецепта успеха нет, но есть преимущество в его поиске.
В заключение я приведу цитату из книги Марти Ноймайера «46 правил гения: руководство по креативности для новаторов»:
«Творчество и креативность – это дисциплина, которую вы используете, когда не знаете ответов на пути в неизведанное. В таком путешествии ошибочные шаги тоже шаги. Каждая ошибка приближает вас к решению».
Сайт компании — создание и особенности.
Сайт компании — самый эффективный из существующих способ презентовать бизнес в интернете. Причём, если 20 лет назад сайт для бизнеса был скорее имиджевым атрибутом, то в 2020-х он превратился в полноценный канал привлечения клиентов. Поэтому так важно, чтобы разработкой и продвижением занимались квалифицированные подрядчики: малейшая оплошность может привести к серьезным последствиям, вплоть до PR-кризиса.
В рамках статьи мы разберемся: кому и зачем нужен сайт компании, какие тренды на основное онлайн-представительство бизнеса аналитики прогнозируют на первую половину 2020-х, как оценить эффективность корпоративного сайта и какие особенности мы в Business Site обязательно учитываем при работе с украинскими клиентами.
Для чего нужен сайт компании и что на нём публиковать
Сайт компании — это развернутая презентация бизнеса. В любое время потенциальный клиент или заинтересованный партнер может зайти на него, чтобы получить нужную ему информацию о компании.
У сайта для бизнеса три ключевых цели: проинформировать, презентовать, продать. Для этого специалисты особым образом прорабатывают дизайн страниц, структуру, создают коммерчески-привлекательный и располагающий к доверию контент. Невозможно сделать это своими силами — без технической и маркетинговой экспертизы — после коротких курсов типа «Научись делать сайты за 3 дня».
Универсального шаблона структуры корпоративного сайта нет и быть не может. У компаний, включая работающие в одном сегменте рынка и на одну аудиторию, обязательно найдутся отличия в подходе к самопрезентации.
Поэтому под разработку сайта компании обязательно готовится уникальное техническое задание — проект, план работ, смета, описание желаемого результата. На основе содержимого этого документа заказчик принимает работу и оценивает результат.
Создание контента для страниц официального сайта коммерческого предприятия тоже лучше доверять профессионалам.
Распространённая ошибка предпринимателей — экономия на текстах и изображениях. Написанные «на коленке» тексты и снимки, сделанные кем-то из сотрудников, выглядят не представительно и мешают страницам завоевывать высокие позиции в поисковой выдаче.
Чем отличается сайт компании от лендинга и интернет-магазина
Сайт компании — всегда многостраничный и структурированный так, чтобы удерживать внимание посетителей как можно дольше. Именно структура визуально отличает его от ближайших «родственников»: одностраничников (лендингов) и интернет-магазинов. Давайте сравним детальнее.
Посадочная страница — это сайты для продажи одного продукта. Длинный пергамент лендинга продумывается таким образом, чтобы пользователь листал экраны и буквально проваливался в воронку продаж — от знакомства с предложением до совершения целевого действия (заказать, оставить контакты для связи, перейти к покупке посредством эквайринга). В корпоративном многостраничнике каждая страница — отдельный лендинг, связанный с остальными общей идеей презентации компании и её предложений.
Интернет-магазины — витрины с товарами, где каждый символ на страницах работает на то, чтобы как можно больше посетителей стали покупателями. В магазины приходят покупать, а не знакомиться с компанией. Поэтому если на корпоративном сайте и выкладывают каталог товаров, то оформляется он скорее как брошюра для ознакомления, чем как полноценный магазин с кнопкой заказа и корзиной.
Нужно ли размещать на сайте компании каталог товаров
Размещение на сайте каталога продукции и то, в каком виде это делать — страницами, файлом для скачивания, галереей, — зависит от того, что вы продаете и кому.
Формат подачи в виде онлайн-каталога с отдельной страницей под каждый товар и фильтрацией ассортимента по ключевым характеристикам товаров — лучше всего. Это удобно и для людей, которые могут зайти на сайт — все рассмотреть, обо всем почитать, — и с точки зрения продвижения сайта в поисковых системах.
Каждая товарная страница — потенциальный источник трафика из Google, а если товар уникальный — еще и брендированного трафика, который обычно лучше всего конвертируется в лидов.
Какими будут сайты компании в 2021: тенденции в разработке, дизайне, наполнении
Mobile first. Всё больше людей предпочитают пользоваться интернетом с телефона, чем с компьютера. Поэтому в 2020-х сайты разрабатывают сперва для мобильных экранов, а уже от них создают десктопную версию — удобную для восприятия и навигации на больших экранах.
Голосовой поиск и навигация. В США и большинстве стран ЕС голосовых ассистентов используют примерно так же часто, как текстовый поиск. В конца 2018 наблюдается взрывной рост интереса к голосовой навигации. Пока людям нравится голосом переключать треки и отправлять сообщения, но не исключено, что уже в 2021 году возможность послушать о компании также станет пользоваться спросом. По крайней мере это будет логичным продолжением тенденции общаться со смартфоном в режиме диалога.
Наглядное представление данных. Сегодняшний пользователь настолько ленивый, что не готов лишний раз мышкой пошевелить ради понимания чего-то, что не даётся ему с первого раза. И желание получать всю информацию о товаре в формате одной страницы — яркое тому подтверждение.
Со стороны диджитал-маркетинга большая ошибка — отпустить посетителя сайта гуглить какое-то неясное ему понятие или термин, который остался ему непонятен из характеристик в каталоге сайта. В 2017 для удержания аудитории достаточно было дать максимально полную информацию, в 2021 придётся искать пути ее максимально наглядного представления. Простые таблицы, списки характеристик, графики — это скучно. Учитесь подавать факты наглядно или делегируйте это, иначе люди будут покидать сайт и вряд ли захотят вчитываться в нагромождение цифр и понятий.
Отказ от формализма в контенте. Миллениалы — костяк платежеспособной аудитории в интернете. И они, и продвинутые Иксы, и совсем юные Z-ты устали от сложных и запутанных словесных конструкций формального языка. Опросы и исследования показывают, что охотнее всего средний пользователь взаимодействует с тем бизнесом, чьи сайт, корпоративный блог и социальные сети не перегружены формализмом.
Переход на простой язык общения через тексты, видео и аудио — логичное продолжение тренда на наглядность и доступность для восприятия всего, что размещено в интернете.
Высокая скорость загрузки страниц. Мы живем в эпоху быстрого интернета и нетерпеливых пользователей. Согласно исследованиям, буквально 1-3 секунды сегодняшний пользователь готов ждать загрузки страницы. Поэтому очень важно, чтобы ничто не тормозило загрузку — иначе и люди будут уходить, и добиться высоких позиций в поисковой выдаче точно не получится.
На что будет опираться продвижение сайтов в 2020-х: прогнозы экспертов в SEO
Раз уже заговорили о влиянии скорости загрузки страниц, то давайте заодно рассмотрим и другие факторы, которые по мнению экспертов могут стать ключевыми трендами SEO в 2021 и после.
Удобство страницы для пользователя — важнейшей фактор успешного продвижения сайта
Google давно работает над алгоритмом, способным без участия человека оценивать удобство страницы для конечного пользователя. Согласно открытым данным, на показатель удобства влияют три характеристики:
- LCP — время полной отрисовки самой большой и видимой части содержимого первого экрана сайта. Это может быть картинка, текст, видео.
- FID — время отклика.
- CLS — степень стабильности контента.
Использование Schema для структурирования контента
Разметка Schema помогает Google определять тип содержимого на странице и выдавать его в ответ на поисковые запросы пользователей. Красивые сниппеты и озвучивание ответов на вопросы при голосовом поиске реализуются как раз за счет использования Schema.
Оптимизация для E-A-T (опыт, авторитетность, надежность)
E-A-T — сравнительно новая метрика от Google, которая определяет надежность сайта, как источника некой информации или возможностей для конечного пользователя. На E-A-T влияет целый список факторов, среди которых использование защищенного протокола HTTPS, польза и экспертиза контента, возраст сайта, частота актуализации содержимого и пр.
Нативность и комплексный подход к SEO
Под нативным SEO подразумевается органичность подхода, который используется для продвижения сайта в поисковых системах. Поисковики за последние годы сильно развились — внедрение технологий машинного обучения позволяет им легко выявлять попытки имитировать качество и пользу страницы сайта. Поэтому, как пишут в блогах и рассказывают на конференциях представители Google — для попадания в топ выдачи сайт должен быть качественным, остальное не так важно.
Критерии эффективности корпоративного сайта
- Конверсия. В случае с корпоративным сайтом считать конверсию сложнее, чем у того-же интернет-магазина или лендинга. Но это не значит, что ставить цели и планировать их достижение тут бессмысленно. Просто формула расчета конверсии и стоимости клиента должна учитывать особенности воронки продаж для конкретной компании.
- Уровень доверия. Он оценивается исходя из нескольких показателей, в число которых входит рост брендированных запросов в поисковых системах в положительном ключе, повышение лояльности клиентов и пр.
- Развитие бренда. Брендинг компании в интернете — сложный комплекс действий, среди которых работа над официальными сайтом и блогом компании считается одним из важнейших действий для достижения успеха. Поэтому так важно не допускать ошибок на сайте и внимательно относиться к размещаемому контенту, ведь от этого зависит репутация.
Особенности корпоративных сайтов украинских компаний
Украинские компании, помимо общих мировых тенденций и требований, предъявляемых к корпоративным сайтам, должны учитывать и некоторые локальные особенности. На сайте украинской компании обязательно должна быть реализована:
- Мультиязычность — украинский язык делается основным, потому что того требует языковой закон, а русский и английский позволят охватить два основных языковых сегмента клиентов нашего бизнеса.
- Ориентация на SEO требования Google — после того, как несколько лет назад Яндекс в Украине попал под санкции, местные пользователи привыкли всё нужное гуглить. Отсюда и необходимость в оптимизации под поисковые системы брать за основу специфику именно гугловских алгоритмов ранжирования страниц в выдаче.
- Внедрение передовых и специальных возможностей — поддержка голосового поиска и навигации, темная тема на сайте, корректное отображение на дисплеях retina, удобный для управления одной рукой мобильный интерфейс и многое другое на сайтах украинских компаний внедрять нужно уже сегодня.
В нашей стране it-отрасль активно развивается, а вместе с ней растут аппетиты пользователей, активно читающих и изучающих сайты компаний из ЕС и США (авиакомпании, магазины, бренды). Поэтому получить максимальные охват и конверсию наш бизнес сможет только если будет внедрять все передовое.
Каким должен быть сайт компании в 2020-х: коротко
Сайт компании уже в 2021 году должен быть больше мобильным, чем десктопным. Сегодняшние пользователи хотит, чтобы страницы быстро загружались, корретно отображались на экранах разного размера, поддерживали голосовой поиск и навигацию. Поисковые системы учитывают предпочтения и ожидания пользователей при формировании выдачи, а значит, попасть в топ и получить трафик от SEO без учета E-A-T (опыт, авторитетность, надежность) точно не выйдет. Украинским компаниям при разработке сайта нужно также помнить про обязательную мультиязычность и ориентироваться на Google в последующем продвижении, потому большинство платежеспособной аудитории в нашей стране использует именно этот поисковик.
Только до 25.03.2021 Оставьте заявку на консультацию по разработке корпоративного сайта. Наш менеджер расскажет о том, как мы работаем, ответит на вопросы, подготовит для вас персональное коммерческое предложение по итогом консультации. – успейте оставить заявку!Рекламный сайт, одностраничник или landing page: новый тренд
Имеет значение первое впечатление!!!
Landing page (лендинг пейдж), одностраничный сайт − это сайт, который состоит из одной страницы и рекламирует или продает продукт или услугу. Это максимально упрощенная интернет-страница без усложненной навигации и лишнего текста. Подобная посадочная страница подходит для продвижения практически любого продукта или услуги. Подобный сайт −идеальное решения для компании, предлагающей небольшой спектр услуг или для продвижения одного или однотипного товара.
Специалисты компании KOLORO знают как спроэктировать посадочную страницу, чтобы она рекламировала и продавала
Правильная разработка
Приступая к разработке посадочной страницы, необходимо помнить, что его основная цель − реклама/продажа. Нужно подчеркнуть выгоды товара/услуги. Немаловажным является создание визуально правильной страницы.
При создании одностраничника нужно учесть, что заголовок должен не просто выделяться, он должен быть узнаваемым и читабельным, как и весь текст, который должен быть лаконичным и содержательным. Описание продукта/услуги должно быть таким, что пользователь поймет, что приобретая продукт компании, он сделает свою жизнь проще и лучше. Фотографии или видео должны быть реалистичными, как бы кадрами из жизни.
Важно понимать, что лендинг пейдж не будет аналогом главной страницы веб-сайта. Поэтому его содержание должно быть уникальным. Одностраничник под ключ будет отличатся от обычной страницы отсутствием: расширенной навигации, многочисленных ссылок и призывов.
Тренды сайта landing page
Технологии стремительно развиваются, упрощая не только внешний вид, но и юзабилити сайта лендинг пейдж. А веб-разработки поддаются дизайнерским веяниям моды.
Материальный веб-дизайн
Созданный компанией Google визуальный язык стал трендом, соединяющим в себе качественный дизайн, научно-технологические возможности и простоту юзабилити.
Удобство пользования и мобильная версия − важные составляющие при разработке.
Основная задача дизайнеров − сделать сайт лендинг визуально приятным, но простым, приближенным к натуральности и реальности. Для создания используются такие интерфейсные элементы, как псевдо 3D, анимация, яркие цвета, их смелые сочетания и тени. Все это для того, чтобы пользователь без лишней навигации мог легко сориентироваться в минималистической эстетике сайта.
Живые фотографии и видео
Стоковые изображения − вчерашний день. Сегодняшний тренд − качественные жизненные фотографии. Не последнюю роль в этом сыграли соцсети, в частности Instagram. Сейчас нормально следить за жизнью других людей и делиться своими буднями, выкладывая фотографии. Многие компании делятся своими буднями на сайте, выкладывая фото повседневной жизни офиса. Пользователь не просто ощущает себя частью жизни компании, но и доверяет ей больше.
Живее фотографий − только видео. Теперь оно используется не только в качестве контента, а и как главное полноэкранное изображение.
Видео эффективно используют в сторителлинге. Оно способно установить связь на уровне эмоций с пользователем. В отличии от простых изображений, видео обладает гибкостью и универсальностью, которые заинтересовывают пользователя, благодаря чему он дольше остается на сайте.
Минимализм
Минимализм − основной акцент мировых трендов. Он не обошел и дизайн посадочных страниц.
Но в данном случае минимализм способствуют концентрации внимания пользователя на необходимой информации:
- продукт,
- услуга,
- выгода,
- возможность.
Страница без лишней информации, на которой не нужно тратить время на поиски, подводит пользователя сразу к целевым действиям. Минимализм веб-страниц,сохраняя контакт с пользователем, акцентирует внимание на важных элементах.
Анимация
Движение − это жизнь, а жизнь − это движение! Это главный принцип страниц с оживленными деталями, притягивающими внимание. Не стоит добавлять много деталей, что может рассеять внимание пользователя. Анимация должна быть легкой и плавной, чтобы не спугнуть пользователя. И, поскольку это рекламный сайт, то анимация должна быть в духе компании и должна напоминать элемент дизайна.
Drop-down меню
Борьба за внимание пользователя нашла свое отражение в меню, которое прячется. Подобная навигация создана специально для смартфонов, чтобы разгрузить пространство и облегчить визуализацию. Хотя она хорошо смотрится и на полноценном экране. Прячущееся меню помогает сосредоточиться на основном. При таком решении лендинга используют одноцветный фон или однотонную структуру pop-out меню, но так, чтобы цветовое оформление было в одном тоне. Для текста используются крупные шрифты, которые легко читать, заполняя этим пространство.
Современные дизайнеры отошли от привычных боковых или верхних положений меню на странице. Уникальное меню страницы − фишка дизайнера/компании, которая привлекает пользователей новаторством и оригинальностью идеи. Верх уникальности − полное отсутствие меню. Для поиска нужного контента − нужно скроллить. Основным минусом является − долгий поиск необходимой информации. Но это перекрывает огромный плюс − прокручивая контент, можно ознакомиться со всем сайтом.
Также экран может быть разделен на отдельные, независимые друг от друга части.
Благодаря такому решению страницу можно заполнить разнородным контентом, например, с одной стороны видео или фото, а с другой −текст. Это не перегружает пользователя, а заинтересовывает динамичностью. При том, что обе части обособлены друг от друга, можно их объединить цветовым акцентом.
Mobile-friendly
Адаптация к смартфону, планшету или другому подобному гаджету, который постоянно под рукой, повышает статус компании в глазах пользователя.
Пользователи мобильных устройств повлияли на внешний вид сайтов. Максимальная простота требует стильности и лаконичности от дизайнеров и конкретики от маркетологов. Красивый дизайн и скорость загрузки сделали популярными страницы-карточки. Максимальное привлечение внимание обеспечивается двухцветностью страницы и большим количеством «воздуха» − белого цвета. Изысканная непринужденность приковывает внимание к акцентам на странице.
Винтаж снова в моде
Аристократично-эстетичные оттенки серого популярны в веб-дизайне последние несколько лет. Подобное решение компании подчеркивают состаренными или старыми фотографиями, подчеркивая тем самым историю бренда и его высокое качество. Благодаря этому он выглядит «теплее»и уютнее.
Преимущества сайта-одностраничника
Главное преимущество рекламирующего или продающего одностраничника − простое создание и небольшая стоимость.
Создать одностраничный сайт одностраничник специалист может за один-два дня. При желании можно сделать landing почти бесплатно или скачать готовый шаблон, дописав необходимую информацию и улучшив навигацию.
Среди пользователей такие сайты пользуются популярностью благодаря информативности и простоте использования. Вся необходимая информация содержиться на одной странице, упрощая поиск и ограничивается описанием услуги или товара, преимуществами и контактами.
Минусы landing page
Зачастую информацию о компании не удается поместить в несколько предложений, что приводит к созданию больших текстов, в котором пользователь теряется, внимание рассеивается и, как правило, сомневается или отказывается от покупки товара/заказе услуги у этой компании или через этот сайт. Возможности сайта ограничены и не позволяют добавлять новости компании. Также к минусам таких сайтов относится и дорогое продвижение.
Самые лучшие варианты разработки лендинг пейдж
Предлагаем вашему вниманию подборку лучших и самых креативных продающих лендинг пейдж по мнению многих мировых дизайнеров.
Концепция движения и огня − завораживает и задерживает на таком сайте.
Яркие краски и плитки − оригинальное решение сайта-портфолио.
Оригинальная 3D анимация и стрелочки, напрвляющие на дальнейшее изучение сайта.
Сайт пропитан духом танцевального шоу, которое проходит в Амстердаме, и, которому, собственно, посвящен.
Интересная рекламная страница молодежной одежды. Ее динамичность проявляется в интересном решении: когда курсор уводится от картинки − остаются размытые пиксели.
Paper & Paint интересно взаимодействует с посетителем: при передвижении по сайту происходит переход к следующему разделу, как будто вы перелистнули страницу альбома.
Заказывайте в агентстве KOLORO лендинг пейдж под ключ − и ваши продажи взлетят до небес!!!
KOLORO знает как правильно рекламировать и что сделать, чтобы выгодно продать!
6 лучших тенденций дизайна посадочных страниц, которые сокрушат его в 2021 году
Удовольствие от создания целевых страниц заключается в том, что это дает нам возможность экспериментировать с дизайном, копированием, предложениями и т. Д., Чтобы привлечь внимание наших целевых клиентов. В конечном итоге превращая их в лидов.
Многие маркетологи склонны сосредотачиваться только на предложении и не уделять дизайну и пользовательскому интерфейсу должного внимания. С невероятным количеством рекламы, ведущей на целевые страницы, которыми всех нас засыпают в наших социальных сетях, как никогда важно выделиться среди всех других целевых страниц, пытаясь привлечь внимание той же аудитории.
Из этого поста вы узнаете, как создать лучший дизайн целевой страницы и какие тенденции дизайна будут сокрушать его в 2020 году.
TL; DR;
- Фоновое видео
- Крупногабаритная типографика
- Минимализм
- Живые чаты
- Органические формы
- Пользовательские иллюстрации
Каковы ключевые элементы целевой страницы с высокой конверсией?
Оптимизация целевой страницы — это одновременно искусство и наука.Есть несколько ключевых элементов, которые создают отличное впечатление от целевой страницы для посетителя, например:
- Заголовок (ценностное предложение)
- Подтверждающая копия
- Дизайн (макет)
- Цвет
- Призыв к действию
- Медиа (видео, изображения, аудио и т. Д.)
- Социальное доказательство (отзывы, логотипы клиентов и т. Д.)
Эти элементы необходимо постоянно улучшать и тестировать с течением времени, чтобы найти наиболее эффективный вариант целевой страницы.Как бы нам ни хотелось, чтобы это было так, просто невозможно создать ИДЕАЛЬНУЮ целевую страницу с первой попытки. Потребуется некоторая итерация, чтобы увидеть потрясающие результаты, которые вам нужны.
Хорошая новость заключается в том, что HubSpot позволяет очень легко запускать A / B-тесты, чтобы помочь вам понять, какой вариант страницы работает лучше всего.
Почему дизайн целевой страницы имеет значение?
Как потребители, мы живем во времена, когда существует множество возможностей выбора, когда дело доходит до рассмотрения и принятия решения о покупке.
На этапе рассмотрения покупателя первое впечатление о вашем бренде происходит за доли секунды. 17 мс согласно исследованию, проведенному исследовательской группой Google в попытке понять эстетические суждения людей о первых впечатлениях от веб-сайтов.
17 мс … Вау !! Это быстро, но не удивительно. Можно с уверенностью сказать, что мы все зашли на веб-сайт и сразу подумали: «НЕТ!» и закрыл вкладку.
Великолепный дизайн целевой страницы поможет вашему бренду наглядно продемонстрировать качество, доверие и позволит вам быть на несколько шагов впереди ваших конкурентов.В конце концов, это приведет к более высоким коэффициентам конверсии и новым клиентам.
Каковы основные тенденции в дизайне посадочных страниц на 2021 год?
2021 уже здесь, а это значит, что сейчас отличное время, чтобы начать обновлять свой веб-сайт и целевые страницы, чтобы идти в ногу с ведущими тенденциями в веб-дизайне.
Вот список лучших тенденций веб-дизайна и целевых страниц на 2021 год:
1. Фоновое видео
Правильное использование фонового видео на целевой странице может сделать ваш простой статичный дизайн чем-то более привлекательным для посетителей.Во многом как в этом примере от DITTO.
Даже несмотря на то, насколько крутыми могут быть фоновые видео, безусловно, есть способы испортить их и нанести ущерб производительности целевой страницы и опыту людей. Итак, давайте рассмотрим некоторые основные правила, о которых следует помнить.
- Не затмевайте и не отвлекайте внимание от основного ценностного предложения
- Оптимизируйте видео, чтобы уменьшить размер файла (макс. 7–10 МБ)
- Выберите видео, которые текут. Отрывистые видеоролики с большим количеством сокращений могут отвлекать
- Используйте актуальные высококачественные видео, которые имеют отношение к вашему сообщению.
Если вы ищете место, где можно найти классные высококачественные видеоклипы для добавления, я большой поклонник Stocksy.
2. Крупногабаритная типографика
Один из простейших способов заставить ваше ценностное предложение резко упасть со страницы — это сделать шрифт намного больше. Эта тенденция быстро начала проявляться, поскольку мы теперь лучше понимаем, как люди читают в Интернете. Тем более, что нас всех засыпают информацией каждый день.
Сделайте паузу и подумайте, как вы читаете этот пост.Готов поспорить, вы выполнили как минимум три из следующих действий:
- Сделал однократную прокрутку до конца сообщения перед чтением
- Быстро пролистывал и просматривал заголовки
- Чтение только жирного текста или маркированного списка
- Приостановлено на изображениях
- Прочтите только первое предложение каждого абзаца
Наше поведение при чтении в Интернете изменилось, и важно, чтобы мы принимали во внимание просматриваемый контент на создаваемых нами целевых страницах.
Давайте взглянем на одну из текущих целевых страниц Lyft. Здесь, над сгибом, вы можете видеть, что они подчеркивают суть своего заголовка.
Они не останавливаются на достигнутом. Когда вы прокручиваете целевую страницу вниз, они используют негабаритную типографику на протяжении всего процесса.
Работа с типографикой и размерами шрифтов может быть непростой задачей, когда дело доходит до того, чтобы каждый размер хорошо смотрелся вместе. Инструмент, который я очень люблю и постоянно использую для выбора размера шрифта, называется TypeScale.
3. Минимализм
Все мы слышали поговорку «меньше значит больше», и есть много случаев, когда это правда. Особенно, если речь идет о дизайне целевой страницы.
CLEAN (каламбур), минималистичный дизайн — это оптимизация как письменного, так и визуального контента, чтобы он не перегружал посетителя, когда он впервые попадает на вашу страницу. У этого есть два основных преимущества.
- Оптимизация скорости веб-страницы: более быстрое время загрузки может увеличить коэффициент конверсии.
- Улучшенная когнитивная нагрузка: — это причудливый способ сказать, что человеческий мозг будет понимать происходящее намного быстрее.
Отличный пример, на который я ссылался при создании серии шаблонов CLEAN для HubSpot, — от Shopify.
Этот простой дизайн позволяет посетителям быстро усвоить важные детали. Часто это приводит к более высокому коэффициенту конверсии.
4. Живые чаты
Если вы были на моем сайте, то знаете, что я большой поклонник живого чата.Включение этой функции на целевые страницы может помочь посетителям решить, подходит ли им ваш продукт или услуга, ответив на их вопросы в режиме реального времени.
Не только это, но и вы сможете лучше понять возражения клиентов и сможете оптимизировать свой контент для их обработки.
Живые чаты — также фантастический способ наладить связь с потенциальными клиентами путем построения доверия и взаимопонимания.
Вот пример того, как ProfitWell использует чат на своей целевой странице.
5. Органические формы
Мы все привыкли видеть стандартные формы, такие как круги, квадраты, прямоугольники и т. Д., Используемые для веб-дизайна. Тенденция, которую мы начнем видеть гораздо больше в 2020 году, — это использование плавных, органических форм.
Эти типы форм при правильном сочетании и правильном использовании могут создать визуально привлекательную страницу, мягкую, но привлекательную для глаз. В то же время проявляйте дружелюбие и доступность.
В этом примере целевой страницы от HubSpot вы можете увидеть, как тонкое добавление органических форм придает чистой и профессиональной странице приятный дизайн.
6. Пользовательские иллюстрации
Большой тренд, который мы наблюдали в 2019 году, который обязательно станет популярным в 2020 году, — это использование пользовательских иллюстраций.
Это неудивительно, так как качественные стоковые фотографии, которые не кажутся полностью недостоверными, бывает довольно сложно найти. Не говоря уже о том, что индивидуальная фотосессия может быть довольно дорогой.
Введите собственные иллюстрации. Этот стиль иллюстраций имеет дополнительное преимущество, так как позволяет визуально передать различные аспекты вашего предложения, при этом они привлекают внимание и оригинальны.
В этом примере вы можете увидеть, как Asana включает их в свой бренд.
Если стоимость и время не позволяют вам создавать собственные иллюстрации, еще один замечательный ресурс, который я использовал много раз, — это Creative Market. Если вы выполните поиск по «изометрическим иллюстрациям», вы найдете множество вариантов.
Заключение
2020 год принесет миру только новые продукты, услуги и предложения.Один из лучших способов преодолеть шум и убедиться, что ваш бренд и предложение выделяются из общей массы, — это понять, как меняется ландшафт дизайна, и соответствующим образом адаптироваться / протестировать.
Я призываю вас начать экспериментировать с этими 6 тенденциями целевых страниц, чтобы найти успешную целевую страницу, на которой вы будете конвертировать потенциальных клиентов в течение всего дня.
Если вы проводите эксперименты с целевой страницей на платформе HubSpot, определенно стоит проверить мой CLEAN 6 Landing Page Pack (бесстыдный плагин).Это даст вам все инструменты, которые вам нужны как маркетологу, чтобы начать повышать коэффициент конверсии уже сегодня.
Я буду рад вашим отзывам
Узнав меня, вы скоро поймете, что я очень ценю обратную связь. Если у вас есть отзывы об этом посте, я бы хотел их услышать. Просто напишите мне комментарий ниже.
Тенденции целевых страниц, которые необходимо знать на 2020 год
Если вы собираетесь создать свою следующую большую целевую страницу, чтобы привлечь больше клиентов и увидеть, как ваши продажи зашкаливают, то вам нужно познакомиться с некоторыми из лучших тенденций целевых страниц, чтобы подпитывать ваше вдохновение.
Для магазинов электронной коммерции, которым необходимо воспользоваться преимуществами своего веб-сайта для увеличения своего трафика, почерпнув вдохновение для целевой страницы из успешных примеров, вы сможете создать идеальное оружие для резкого увеличения доходов и улучшения целевых страниц электронной коммерции.
Хотя собрать вдохновение можно легко, создание их с нуля может занять очень много времени.
Чтобы сэкономить время, компании обычно используют отличный конструктор целевых страниц, чтобы упростить задачу и создать потрясающие целевые страницы, которые будут конвертироваться.
С правильными инструментами и правильным контентом ваши целевые страницы электронной коммерции превратятся в мощные машины для конвертации, которые будут способствовать вашему годовому доходу и привлечь больше лояльных клиентов, чем вы когда-либо могли себе представить.
Что вы найдете в этой статье?
9 Тенденции целевых страниц, которые необходимо подготовить к будущему:
1. Минимальный подход
2. Всплеск цвета и простых фонов
3. Простые фоны и типографика
4. Четкие призывы к действию, которые выделяются
5.Социальное доказательство
6. Забудьте о панели навигации
7. Подчеркните ценность своих продуктов
8. Два призыва к действию лучше, чем один
9. Интерактивные элементы для создания целевой страницы
Вывод
Звучит хорошо? Давайте нырнем.
9 трендов целевых страниц, которые необходимо подготовить к будущему:
1. Минимальный подход
Хотя вам нужно, чтобы ваши страницы выделялись, опыт показал нам, что меньше значит больше.
Если вы покажете посетителям больше, чем им нужно знать, это может заставить их отказаться от вашего призыва к действию.
Чтобы бороться с этим колебанием, популярные бренды приняли более минималистичный подход, когда дело доходит до создания и доставки лучших целевых страниц.
Сохранение минимума помогает вашей аудитории сосредоточиться на важной информации, которая будет волновать их и привести к конверсии.
Сохранение минимума помогает вашей аудитории сосредоточиться на важной информации, которая будет волновать их и привести к конверсии # landingpages101 Click To Tweet Например, Dollar Shave Club — отличный пример того, как бренд использует преимущества минимального макета для повышения конверсии и получения лучших результатов.
Минимальный дизайн может быть простым, но он может сделать ваши призывы к действию более заметными. (Источник: Dollar Shave Club)
Стремление к минимализму — одна из самых популярных тенденций, которые вы должны учитывать в 2020 году, чтобы вдохновить вашу целевую страницу и помочь вам создать целевую страницу, которая будет работать, несмотря ни на что.
Кроме того, минималистичные целевые страницы были одной из самых популярных тенденций дизайна в 2019 году, поскольку по ним «намного легче ориентироваться для пользователя. Вместо отвлекающих элементов сообщения или информация выделяются мгновенно.”
2. Всплеск цвета и простой фон
Как визуальные существа, ваши посетители предпочитают определенные цветовые комбинации и визуальные эффекты.
Поскольку бренды отошли от ярких цветов и формата начала 2000-х годов, сочетание минималистичного дизайна с подходящими цветами стало ключом к увеличению конверсии и привлечению довольных клиентов.
Как показывают исследования, «92,6% людей считают, что визуальное измерение является фактором № 1, влияющим на их решение о покупке (вкус, запах и т. Д.).) », Что означает, что эстетическая часть ваших страниц будет определять процент конверсии.
Брендам, которые это учли, удалось привлечь внимание своей аудитории с помощью цветов.
Например, Indochino — это бренд, который создает индивидуальные костюмы для своей целевой аудитории, принадлежащей к определенной возрастной группе.
Чтобы их целевая страница обращалась к этой аудитории, они выбирают простой дизайн с синими и черными цветами, что делает их профессиональными.
Эта целевая страница предлагает идеальный баланс цвета и визуальных эффектов для привлечения целевой аудитории бренда.(Источник: Индокино)
Поскольку синий — это цвет, который их мужская аудитория обычно выбирает в качестве любимого цвета, 57% из них, если быть точным, использование цветов, соответствующих вкусу вашей аудитории, может создать положительное отношение к вашей странице и мотивировать их к щелкните.
Синий — универсальный любимый цвет (Источник)
Хотите больше подобных идей?
Получайте еженедельные советы, стратегии и передовые отраслевые знания по электронной торговле.Доставлено прямо в ваш почтовый ящик.
Woohoo! Вы только что зарегистрировались. Проверьте свой почтовый ящик, чтобы подтвердить подписку.
3. Простые фоны и типографика
Как мы уже говорили, вы не должны пренебрегать выбором правильных фирменных цветов для представления вашего бизнеса, веб-сайта и целевых страниц.
То же правило применяется к фонам вашей целевой страницы, где сложный или плохой дизайн может стать серьезным препятствием для вашей аудитории.
Вместо того, чтобы расширяться, вы должны выбрать простой фон, который будет гармонировать с вашей типографикой и CTA.
Эта исключительная целевая страница имеет реалистичное изображение продукта, чтобы вдохновить будущих клиентов на покупку. (Источник: Beats by Dre)
Для Beats by Dre это фоновое изображение достаточно простое, чтобы продемонстрировать продукт новым посетителям и порадовать их теплые тона и дружелюбное лицо.
В то время как копия вашей целевой страницы будет отвечать за способность вашей страницы конвертироваться, типографика также может повлиять на ее успех.
Простые шрифты, выделенные жирным шрифтом, стали любимыми на целевых страницах, поскольку они могут задать тон и настроение вашего бизнеса.
Итак, когда вы найдете идеальное фоновое изображение, цвет и баланс текста, у вас будет идеальное оружие, чтобы очаровать посетителей и заставить их щелкнуть.
4. Четкие выделяющиеся призывы к действию
Ясные призывы к действию, которые выделяются, являются одним из наиболее важных элементов для создания целевых страниц с высокой конверсией.
Например, уHome Chef есть отличный пример целевой страницы, чтобы показать нам, как важно иметь четкие, выделяющиеся призывы к действию.
Если вы посмотрите на CTA, вы увидите, что он стратегически размещен под видео, которое призвано стимулировать свою аудиторию выбирать блюда домашнего шеф-повара: «Сэкономят ли вам наборы для приготовления еды?»
На этой целевой странице используется ярко окрашенное поле с призывом к действию, которое трудно пропустить и на которое легко нажать (Источник: домашний шеф-повар)
Теперь вы можете задаться вопросом, достаточно ли этого, чтобы посетители нажимали на ваш призыв к действию?
Ну, может, но этого недостаточно.
Чтобы гарантировать успех вашего призыва к действию на целевой странице, вам необходимо выбрать правильные цветовые комбинации, которые сделают его привлекательным, и его трудно будет пропустить.
Чтобы гарантировать успех вашего призыва к действию на целевой странице, вам нужно выбрать правильные цветовые комбинации, которые сделают его привлекательным и его трудно пропустить. Нажмите, чтобы твитнутьЗдесь Home Chef использует дополнительные красные и зеленые цвета для создания гармоничного и мощного результата, который радует глаз.
Поскольку красный — это мощный цвет, привлекающий внимание, использование его в их призыве к действию — секретное оружие шеф-повара, чтобы привлечь на борт больше клиентов.
5. Социальное доказательство
Социальное доказательство — термин, введенный Робертом Чалдини в 1984 году, — это явление, при котором мы полагаемся на знания таких экспертов, как знаменитости, влиятельные лица и т. Д., Чтобы определить, имеет ли что-то ценность или нет.
Для целевых страниц социальное доказательство стало одним из самых необходимых ингредиентов для повышения надежности и эффективности страницы.
Итак, когда мы говорим о целевых страницах с социальной защитой, мы имеем в виду элементы, которые повышают доверие и дают посетителям чувство безопасности и надежности.
Например, многочисленные целевые страницы включают значки доверия, отзывы, счетчики клиентов и логотипы клиентов, чтобы превратить их целевую страницу в инструмент массового преобразования.
Вот пример из Shopify:
Эта целевая страница дает потенциальным клиентам все правильные причины присоединиться к бренду: количество существующих доверенных клиентов и отзывы. (Источник: Shopify)
Shopify включает в себя три элемента социального доказательства, чтобы повысить эффективность своей целевой страницы и превратить ее в надежный сайт, которому могут доверять новые компании.
От количества доверенных предприятий и логотипов клиентов до отзывов, выделенных жирным шрифтом, страница Shopify показывает новым клиентам, что, когда они зарегистрируются, они также станут довольными клиентами, которым нечего терять.
6. Забудьте о панели навигации
Панели навигации идеально подходят для вашей домашней страницы.
Однако они не так действуют на целевые страницы.
Поскольку целевые страницы должны привлекать внимание посетителей и заставлять их нажимать на ваш CTA, включение панели навигации вверху будет отвлекать ваших посетителей, а не побуждать их нажимать на поле CTA.
Согласно Instapage, навигационные ссылки могут убить ваши целевые страницы из-за их отвлекающего характера и «более низкого коэффициента конверсии целевой страницы после клика».
Например, Fabletics переняла тенденцию отсутствия панели навигации, чтобы максимизировать эффективность своей страницы и увеличить количество конверсий.
Нет панели навигации, нет проблем! Эта целевая страница сводит к минимуму отвлекающие факторы, оставляя навигационные ссылки вне поля зрения. (Источник: Fabletics)
Наличие панели навигации может повлиять на успех вашей целевой страницы больше, чем вы думаете.
Согласно A / B-тесту целевой страницы на целевой странице Yuppiechef, удаление панели навигации и других ссылок привело к увеличению их коэффициента конверсии на 100%.
А чтобы убедиться, что ваши целевые страницы работают, A / B-тестирование и юзабилити-тестирование могут быть вашими лучшими друзьями, чтобы определить, дают ли ваши страницы желаемые конверсии.
7. Подчеркните ценность своей продукции
Хотя простота — это один из элементов, которые заставляют целевые страницы творить чудеса, есть еще одна вещь, которую успешные магазины электронной коммерции использовали, чтобы уменьшить колебания своих потенциальных покупателей и превратить их в уверенных покупателей.
Когда новые покупатели находят ваш магазин, они обычно нажимают на определенную целевую страницу с определенной целью.
Если они готовы принять ваш CTA, то все просто.
Если нет, то вы должны указать им все причины, по которым они должны это сделать.
Например, у Urban Outfitters есть целевая страница, на которой можно продвигать свою программу лояльности клиентов и побуждать посетителей регистрироваться.
Если вы обратите внимание, то увидите, что их целевая страница имеет одни из лучших элементов, описанных выше, выделяющийся призыв к действию, отличные визуальные эффекты и текст, чтобы соблазнить посетителя присоединиться сейчас.
Копирование этого типа повышает коэффициент конверсии целевой страницы, делая призыв к действию практически неотразимым. (Источник: Urban Outfitters)
Однако посетителей Urban Outfitters совершают не это.
Добавив раздел, который подчеркивает ценность продукта / услуги или демонстрирует, как продукт / услуга на самом деле работает, ваша целевая страница снабжена всей необходимой информацией, чтобы дать вашим посетителям четкое представление о том, что они получат.
По мере того, как все больше брендов принимают эту тенденцию, становится ясно, что посетители должны видеть, как они могут использовать ваши продукты / услуги, не прибегая к гуглу.
Добавление раздела с практическими рекомендациями на целевую страницу поможет посетителям понять, что им нужно делать, чтобы воспользоваться преимуществами вашего продукта / услуги. (Источник: Urban Outfitters)
Предоставляя им хорошо спроектированную страницу, на которой есть вся необходимая информация, по которой ваш посетитель должен щелкнуть, ваш магазин электронной коммерции получит в свое распоряжение мощную конверсионную бомбу, которая минимизирует отказы и увеличит взаимодействие.
8. Два призыва к действию лучше, чем один
Иногда сами целевые страницы могут немного отвлекать, особенно когда им есть что продемонстрировать.
Хотя это не обязательно плохо, вы должны принять во внимание, что люди легко отвлекаются на модные визуальные эффекты и текст, которые уводят их от CTA
Чтобы сохранить конверсию, Beachbody on Demand использует двойной призыв к действию, чтобы посетители переходили по ссылкам.
Вот первый призыв к действию бренда, который находится вверху страницы:
Привлекательные визуальные эффекты усиливают этот удивительный оранжевый призыв к действию, который невозможно не заметить, как бы вы ни старались. (Источник: Beachbody on Demand)
После этого целевая страница демонстрирует, как работает продукт, простым и информативным способом вместе с отзывами для повышения его эффективности.
Эта целевая страница также показывает ценность продукта, показывая потенциальным покупателям, что их цели легко достичь. (Источник: Beachbody on Demand)
После демонстрации бренд включает второй призыв к действию.
Если вы внимательно посмотрите, то увидите, что второй призыв к действию напоминает их первый призыв к действию, но предлагает больше причин для начала.
А для тех, кто пропустил первый призыв к действию, эта целевая страница дает посетителям вторую, чтобы напомнить им, что нужно щелкнуть и начать работу.(Источник: Beachbody on Demand)
Напоминание вашим посетителям о необходимости воспользоваться вашим призывом к действию перед тем, как покинуть целевую страницу, — идеальный способ повысить рейтинг кликов и привлечь больше клиентов.
Просто имейте в виду, что для того, чтобы это сработало, вам не следует использовать одни и те же визуальные эффекты, а придумать новый формат, чтобы поймать тех, кто избежал вашего первого призыва к действию.
9. Интерактивные элементы для создания идеального лендинга.
Интерактивность — это элемент, который значительно улучшил качество обслуживания клиентов.
Поскольку покупатели должны чувствовать себя причастными ко всему процессу, предоставление чего-то большего, чем классическая статическая целевая страница, поможет вашему магазину создать уникальный характер бренда, который будет отличать вас от ваших конкурентов.
В данном случае уHappySocks есть блестящая целевая страница для продвижения своей коллекции носков Rolling Stones.
Посмотрим, почему.
Когда посетитель попадает на их страницу, это первое, что он встречает:
И действие! Эта целевая страница использует интерактивные функции, чтобы заинтриговать потенциальных клиентов и побудить их взаимодействовать со страницей в увлекательной игровой форме.(Источник: HappySocks)
Бренд использует тематику продукта, чтобы задать настроение целевой страницы, что, на мой взгляд, может удивить как любителей рока, так и носков.
Целевая страница, однако, не останавливается на достигнутом, поскольку на ней больше анимации, чтобы сделать их потенциальными покупателями увлекательными и интерактивными.
Целевые страницы, подобные этой, дают посетителям новый вид традиционной статической целевой страницы. (Источник: HappySocks)
Поскольку мы живем в эпоху искусственного интеллекта, виртуальной и дополненной реальности, использование чего-то столь же простого, как анимация, может заинтересовать ваших посетителей и дать им лучший опыт работы с целевой страницей.
Еда на вынос
Как наиболее эффективный инструмент лидогенерации, ваша целевая страница должна быть уникальной, менее отвлекающей и способной захватить вашу аудиторию с первого взгляда.
Знание того, что заставляет посетителей нажимать и совершать конверсии, — лучший способ спланировать целевые страницы своего собственного магазина электронной коммерции и увеличить свои продажи.
Для этого вам нужно идти в ногу с текущими тенденциями в области целевых страниц, получать полезную информацию, подпитывать свое вдохновение и, когда вы будете готовы, создать идеальные целевые страницы, чтобы поразить вашу аудиторию.
Биография автора:
Марилия Димитриу (Marilia Dimitriou) — писатель, работающий в программе электронного маркетинга Moosend. Ее страсть к писательству заставила ее найти новые способы сочетать искусство творческого письма с SEO-копирайтингом. Когда она не пишет статьи, вы обнаружите, что она тратит время на свои тряпки.Следуйте за ней на Linked.in
Хотите вывести свой интернет-магазин на новый уровень? Мы создали полностью бесплатный контрольный список оптимизации электронной торговли , который охватывает все аспекты вашего сайта , от вашей домашней страницы до формы оплаты. Он наполнен действенными и простыми советами, которые, как доказано, способствуют увеличению конверсии. Скачайте сейчас.
Блог электронной коммерции Growcode / Оптимизация электронной торговли / Целевые страницы: все тенденции, которые вам нужно знать, чтобы вдохновлять вас на 2020 год
Оставьте свой комментарий
7 тенденций целевой страницы, на которые следует обратить внимание, чтобы повысить коэффициент конверсии
целевых страниц после клика — это место, где происходят конверсии.Тем не менее, оптимизация платных объявлений не окажет большого влияния на рентабельность инвестиций в рекламу, если вы не учитываете целевую страницу после клика.
Создание целевых страниц после щелчка для оптимизированной целевой страницы после щелчка включает больше, чем просто вставку заголовка и кнопки с призывом к действию на странице. Чтобы убедиться, что ваши страницы настроены для конверсии, вы должны учитывать последние тенденции в отношении целевой страницы после клика.
Мы рассмотрели сотни посткликовых целевых страниц из разных отраслей, чтобы представить вам 7 тенденций посткликовых целевых страниц (продемонстрированных с примерами), которые вам следует рассмотреть в этом году.
трендов на целевой странице после клика, которым следует следовать
Тенденции, обсуждаемые ниже, удобны для пользователей, новаторски и соответствуют тому, что посетители получают хороший пользовательский опыт. Это означает, что все целевые страницы после клика должны иметь:
-
1. Коэффициент конверсии: Количество мест, на которые нужно нажать, по сравнению с количеством целей конверсии. В идеале соотношение составляет 1: 1, то есть на целевой странице после клика можно нажать только на одно место. На большинстве целевых страниц после клика эта ссылка является кнопкой с призывом к действию.
2. Соответствие сообщения: Соответствие содержания объявления целевой странице после клика, чтобы сообщение закрепилось в сознании потенциального клиента и чтобы они знали, что оно актуально.
3. Контрастная кнопка CTA: Кнопка не сливается со страницей; он использует «всплывающий» цвет, а иногда и другие компоненты дизайна, такие как инкапсуляция и / или пустое пространство, чтобы потенциальные клиенты заметили и преобразовали предложение.
4. Соответствующее пустое пространство: Наличие большого отрицательного пространства поддерживает визуальную иерархию и помогает привлечь внимание к определенным элементам страницы, таким как форма и кнопка CTA.
Тенденция №1 целевой страницы после клика: пользовательские иллюстрации
Пользовательские иллюстрации добавляют индивидуальности вашей целевой странице после клика. Иллюстрации также можно использовать, чтобы рассказать историю и добавить игривый тон, что может сделать ее более привлекательной для посетителей.
Вы можете добавить этот эффект дизайна, чтобы ваша страница отличалась от других в вашей отрасли. Qualaroo использует собственные иллюстрации, чтобы продемонстрировать, что пользователи узнают из руководства:
Между тем Lyft использует пользовательские иллюстрации ниже, чтобы усилить свой бренд и отличить себя от своего основного конкурента, который демонстрирует фотографии реальных людей:
JOANY использует индивидуальные иллюстрации, чтобы продемонстрировать своего представителя бренда, добавляя индивидуальности странице:
BirdEye демонстрирует иллюстрации для творческого объяснения функций продукта, вместо простого добавления снимков экрана:
LegalZoom предлагает настраиваемые иллюстрации, чтобы добавить цвет и индивидуальность целевой странице после клика, которая могла бы легко показаться скучной, учитывая все разговоры о налогах:
Пользовательские иллюстрации помогают привнести веселье, энергию и индивидуальность в вашу целевую страницу после клика; их также можно использовать, чтобы создать более привлекательный вид для вашего бренда, поэтому добавляйте иллюстрации там, где они имеют отношение к вашему предложению.
Тенденция # 2 для целевой страницы после клика: Минимализм / больше пустого пространства
Минимализм в веб-дизайне проистекает из философии «меньше значит больше». Продемонстрируйте минимализм на целевых страницах после щелчка, урезав страницы только до основных элементов и используя больше пустого пространства, чтобы продемонстрированным элементам было достаточно места, чтобы дышать.
Пустое пространство или пробел — это пустая область на странице, которая помогает привлечь внимание или выделить определенный элемент. Белое пространство не обязательно является «белым» пространством.Скорее, это негативное пространство, поэтому оно может быть любого цвета, если оно выполняет свои функции.
Uberflip использует минимализм, чтобы создать разгромленную страницу, посвященную их бесплатному путеводителю по «собственному путешествию»:
Woodpecker имеет пустое пространство, чтобы посетители могли сосредоточиться на заголовке, и добавляет контрастную кнопку, чтобы убедить посетителей щелкнуть:
Фоновая пользовательская фотография как на этушах, так и на целевых страницах Zebra после щелчка мышью добавляет пустое пространство, чтобы посетители могли сосредоточиться на заголовке.
Первый, этюды:
И зебра:
Minimalism помогает убрать загромождение целевой страницы после клика и сосредоточить внимание посетителей на элементах, которые влияют на конверсии.
Minimalism помогает убрать загромождение целевой страницы после клика и сосредоточить внимание посетителей на элементах, которые влияют на конверсии.
Тенденция # 3 для целевой страницы после клика: крупная жирная типографика
Типографика — это визуальный инструмент, который помогает добавить индивидуальности, вызвать эмоции и задать тон вашей целевой странице после клика при продвижении вашего предложения.
Сочетание больших букв, контрастных шрифтов с засечками и без засечек в заголовках и основном тексте эффективно создает динамические параллели на целевой странице после щелчка, что увеличивает вовлеченность посетителей.
Для Shopify большая жирная типографика с большим количеством белого пространства создает привлекательную и визуально привлекательную целевую страницу после клика:
Тенденция # 4 для целевой страницы после клика: яркие, яркие цветовые схемы
Вместо того, чтобы выбирать безопасные для Интернета цвета, многие целевые страницы после щелчка теперь фокусируются на перенасыщении и ярких оттенках цвета, которые мгновенно радуют посетителей.Яркие цвета мгновенно привлекают внимание посетителей.
Это то, что ChartMogul делает со своей целевой страницей после клика:
Тенденция # 5 для целевой страницы после клика: дизайн вертикальной разделенной страницы
Вертикальный разделенный макет целевой страницы после щелчка позволяет разделить элементы на две группы, повышая удобочитаемость и упорядочивая страницу от нежелательного беспорядка.
Вертикальный разделенный макет дает больше места для рассказа посетителям.
Slack демонстрирует это, объясняя преимущества сервиса с помощью копии слева и пользовательских иллюстраций справа:
Это тот же подход, который использует Sleeknote со своей целевой страницей после клика:
Используйте вертикальные макеты в своих интересах и убедите посетителей нажимать кнопку CTA более инновационным, творческим и убедительным способом.
Макет целевой страницы после клика №6: тени и глубина
Падающие тени добавляют глубины элементам страницы и создают трехмерный эффект, который создает иллюзию мира за пределами страницы.Эта игра теней помогает создать универсальный эффект, который увеличивает визуальную привлекательность страницы и помогает пользователям удобнее, делая акцент на определенных элементах.
QuickBooks добавляет тени и глубину вокруг изображений целевой страницы после щелчка, чтобы создать трехмерный эффект:
Roadmunk делает то же самое на своей целевой странице после клика:
Повысьте визуальную привлекательность вашей целевой страницы после клика, добавьте тени и глубину, чтобы создать трехмерный эффект, который посетители не могут не оценить.
Тренд целевой страницы после клика № 7: Фоны из частиц
Хотите включить фоновое видео на свою целевую страницу после клика, но беспокоитесь о проблемах с производительностью страницы? Вместо этого используйте фон из частиц.
Фоны частиц — это легкие анимации JavaScript, которые создают движение как естественную часть фона, поэтому им не нужно время для загрузки. Этот компонент дизайна также привлекает внимание посетителей, потому что они не только добавляют видеоэффект на страницу, но и делают вашу страницу запоминающейся.
Scout использует фон из частиц, чтобы продемонстрировать преимущества услуги:
Используйте фоновую анимацию частиц, чтобы поделиться своим рассказом с посетителями и убедить их нажать кнопку CTA без каких-либо проблем со скоростью страницы.
Ваши целевые страницы после клика в тренде?
Создаете ли вы целевые страницы после клика, чтобы продвигать бесплатную пробную версию, электронную книгу или привлекать посетителей для следующего веб-семинара, убедитесь, что каждая страница находит отклик у аудитории, чтобы они оставались на ней достаточно долго, чтобы предпринять нужные вам действия. ВНИМАНИЕ !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
Начните создавать профессиональные, высококонверсионные целевые страницы после клика, подписавшись на демонстрацию Instapage Enterprise сегодня. Со 100% настраиваемыми шаблонами, удобным конструктором и Instablocks ™; Наша платформа дает вам возможность масштабировать производство целевой страницы после клика быстрее, чем когда-либо.
35 Тенденции целевых страниц, которые стоит протестировать в 2021 году
Тенденции целевых страниц всегда меняются.
Сегодняшний блестящий результат исследования — это завтрашняя опровергнутая теория.
Но что делает дизайн целевой страницы таким интересным, так это то, что вы никогда не знаете, что будет работать, пока не попробуете его.
Это просто обоснованное предположение, пока вы не соберете данные, и вы никогда не узнаете, есть ли у вас всего лишь предположение или два от крупного выигрыша.
На этой заметке ознакомьтесь с этими 35 тенденциями целевых страниц, которые стоит проверить самостоятельно.
Тенденция 1 целевой страницы: короткие и сладкие
Некоторые продукты или услуги требуют длинного шага и требуют, чтобы вы перечеркивали каждое «t» и ставили точки над каждым «i».
Другим просто нужна короткая и приятная речь, которая ясно и просто передает предлагаемую ценность.
Хорошее практическое правило состоит в том, что простые предложения с низкими инвестициями не требуют длинных коммерческих предложений и, как правило, получают выгоду от короткой простой целевой страницы.
Например, эта короткая целевая страница не обязательно должна быть длиннее, потому что вам либо нужна бесплатная загрузка, либо нет. Добавление еще 1000 слов вряд ли сдвинет стрелку с того, кто хочет сообщить свой адрес электронной почты.
Короткие и приятные целевые страницы лучше всего подходят для лид-магнитов
Эта страница короткая и приятная, но не скучная. Он имеет сильный призыв к действию и вызывает много ожиданий даже при ограниченном количестве копий.
Тенденция № 2 целевой страницы: больше и лучше
В отличие от короткой и милой страницы, иногда больше и лучше на самом деле… лучше.
Некоторые передачи действительно требуют целой песни и танца. Вы должны поразить их этим ценностным предложением, вникнуть в болевые точки, охватить все преимущества, показать свои прошлые успехи, объяснить, как все это работает, и так далее и тому подобное.
Возьмите эту целевую страницу Nusii, например:
Он очень длинный и дает посетителям массу причин использовать их программное обеспечение.
Nusii отлично справляется с задачей создания социальных доказательств, выделения отзывов клиентов и демонстрации всего, что может предложить их программное обеспечение.
Хорошее эмпирическое правило состоит в том, что более высокие цены обычно требуют более длительных периодов воспитания и более длинного и сложного шага целевой страницы. Если вы просите кого-то о более крупных инвестициях, вам, как правило, требуется более обстоятельный аргумент с дополнительными подтверждающими доказательствами и большим количеством социальных доказательств.
Точно так же, как вам, вероятно, не нужна длинная страница, если вы запрашиваете только адрес электронной почты, вам, вероятно, действительно понадобится большая страница, если вы просите кого-то выделить значительное количество времени или денег.
Вот что я называю старым старым
Имейте в виду, что даже если у вас дорогой продукт или услуга, более длинные целевые страницы не обязательно будут для вас лучшим вариантом. Единственный способ узнать, что подойдет лучше всего, — это протестировать.
Тренд целевой страницы № 3: форматирование двух столбцов
Целевые страницы — это пространство, и то, где вы их размещаете, может иметь большое влияние на то, как посетители будут взаимодействовать со страницей.
Одна из тенденций, в первую очередь для целевых страниц для настольных компьютеров, — это размещение информации в двух столбцах. Это можно использовать для общего формата страницы или, более конкретно, для форм, отображаемых на вашей целевой странице.
С другой стороны, это позволяет вам представлять сразу несколько вещей. Это также может помочь уменьшить неуверенность пользователей в том, что будет дальше, по сравнению с прокруткой вниз по одному столбцу.
Переход на форму с двумя столбцами увеличил конверсию этой страницы на 57%.
С другой стороны, два столбца могут отвлекать от информации, которую вы пытаетесь представить в любом из столбцов. А поскольку мы хотим, чтобы наша целевая страница имела линейное повествование, двухколоночное форматирование может иногда создавать вариативность в том, как люди читают страницу, нарушая этот линейный рассказ.
И наконец, форматирование двух столбцов несовместимо с просмотром веб-страниц на мобильных устройствах.
Тренд целевой страницы №4: Дизайн сначала мобильные
На просмотр смартфонов и планшетов приходится более половины всего интернет-трафика.В течение многих лет компании, следящие за поведением пользователей мобильных устройств, пытались сделать свои целевые страницы «удобными» для мобильных устройств. На практике это означает, что они были разработаны в первую очередь для пользователей настольных компьютеров. Затем были изменены те части, которые плохо переносились на мобильные устройства.
За последние 5 лет стало все более обычным делом разрабатывать целевую страницу для мобильных устройств и беспокоиться о впечатлениях от настольных компьютеров постфактум.
УInstapage отличная мобильная целевая страница
Это частично связано с увеличением доли мобильного трафика, но это также связано с тем, что дизайн, ориентированный на мобильные устройства, обычно не создает проблем для пользователей настольных компьютеров, в то время как обратное обычно неверно.
Тенденция 5 целевой страницы: нет навигации
Когда кто-то заходит на вашу целевую страницу, вы хотите, чтобы он взаимодействовал со страницей и конвертировал. Обычно вы не хотите, чтобы они покидали вашу презентацию и продолжали просматривать ваш сайт.
Вот почему все чаще удаляются варианты навигации с ключевых целевых страниц. Убрав панели навигации и меню, вы сможете меньше отвлекаться и ограничить возможности посетителя либо взаимодействовать с вашей страницей, либо уходить.
Возьмем, к примеру, эту целевую страницу от ASU в Интернете, у нее нет верхнего меню навигации.
Уход может показаться плохим вариантом, но если посетитель не резонирует с ценностным предложением вашей целевой страницы, он, вероятно, в любом случае не подходит для ваших продуктов или услуг.
Тренд целевой страницы № 6: вступительное видео
Когда дело доходит до конверсии посетителей, видео действительно, очень, очень, очень эффективно.
Вступительные видеоролики, в частности, полезны для определенных целевых страниц.В конце концов, в письменной форме вы можете сказать очень много всего. Когда люди впервые попадают на вашу страницу, вам нужно быстро их зацепить, и если ваша ценность немного сложна для объяснения, вступительное видео может помочь вам действительно добиться успеха, не требуя от посетителя прокрутки.
Styku — отличный пример вступительного видео в действии.
Посетители могут щелкнуть, чтобы просмотреть вступительное видео, прежде чем прокручивать остальную часть страницы.
Он также выступает в качестве дифференциатора на конкурентном рынке и может добавить индивидуальности вашему бренду.Если у вас есть время и ресурсы для создания вступительного видео, это стоит сделать.
Тренд целевой страницы № 7: автозапуск видео
Видео с автовоспроизведением обладают всеми преимуществами обычных видео с дополнительным бонусом, заключающимся в том, что вы не полагаетесь на то, что посетитель начнет воспроизведение. Он просто начинает воспроизведение, когда страница загружается, немедленно доставляя ваше сообщение.
Прекрасным примером этого является целевая страница Summus Laser:
Summus Laser использует вводное видео, чтобы объяснить свои продукты, прежде чем вы переходите на их целевую страницу.
Обратной стороной является то, что многие пользователи Интернета особенно враждебно настроены по отношению к автовоспроизведению видео и любому виду воспроизведения звука, не управляемого пользователем. Частично это связано с их ассоциацией с навязчивой рекламой, а частично — с ожиданием контроля при просмотре.
Независимо от причин, вы должны быть особенно осторожны при тестировании этой тенденции целевой страницы. Убедитесь, что видео очень хорошее и очень актуальное, а затем проверьте разницу в производительности между воспроизведением по щелчку и автовоспроизведением.
Тренд целевой страницы № 8: Пользовательская фотография
Мы точно знаем, что очевидные стоковые фотографии отпугивают потенциальных клиентов.
Поскольку компаниям по-прежнему нужны изображения на своих сайтах, одним из популярных вариантов является создание собственных фотографий для использования на веб-сайтах и целевых страницах.
Самое большое преимущество кастомной фотографии — актуальность. Если вы фотографируете своих сотрудников, активы, местоположение и т. Д., Весьма вероятно, что фотографии, которые вы производите, будут иметь отношение к вашему бизнесу и, соответственно, предложению вашей целевой страницы, как в этом примере от Билла Видмера.
Билл использовал собственное изображение, показывающее свое ценностное предложение.
Это также относительно доступно, особенно в сегодняшней экономике, где талантливые фотографы широко доступны по очень разумным ценам.
Тренд целевой страницы № 9: Пользовательские иллюстрации
В том же духе, что и пользовательская фотография, пользовательские иллюстрации — еще одна популярная тенденция на целевых страницах, которая позволяет вам пропускать стоковые фотографии и стоковую графику в пользу чего-то индивидуального.
Пользовательские иллюстрации обладают дополнительной гибкостью. Вы можете продемонстрировать идеи и процессы, которые невозможно запечатлеть с помощью камеры, а также настроить дисплеи в соответствии с тоном и восприятием вашего бренда.
Пользовательские иллюстрации — это наша вещь здесь, в Linear 😎
Обратной стороной является то, что делать плохие иллюстрации намного проще, чем делать плохие фотографии. Порог «хорошо» намного выше и, соответственно, немного дороже. Если вы можете найти отличного иллюстратора, который соответствует вашему бюджету, это, вероятно, лучшее из обоих миров.
Тренд целевой страницы № 10: Эффектные визуальные эффекты
Независимо от того, используете ли вы фотографию, графику, иллюстрацию или другой формат отображения, действительно важен не формат, а ощущение.
Вы хотите, чтобы визуальные эффекты влияли на зрителя. Вы хотите, чтобы они что-то значили. Вы хотите, чтобы они что-то сообщали.
Все больше и больше компаний начинают серьезно относиться к своим визуальным эффектам, и это одна из тех тенденций, на которые вам нужно ухватиться, иначе вы останетесь позади.
Возьмите этот пример, например, из puppyspot.
Давайте будем честными, в жизни нет ничего более значительного, чем щенок 🐶
Тенденция 11 целевой страницы: плоский дизайн
Хороший дизайн целевой страницы — чистый, смелый и часто минималистичный. Он фокусируется на сообщении, а не отвлекает посетителей яркими предметами или особенностями.
С момента своего создания плоский дизайн неотъемлемо включает в себя эти атрибуты, что делает его идеальным выбором для любого серьезного бизнеса, стремящегося к реальным конверсиям и реальной прибыли.
Плоский дизайн означает просто двухмерный дизайн, как вы видите ниже:
Без затенения, без третьего измерения, без каких-либо дополнений
Как видите, этот стиль дизайна очень прост, понятен и лаконичен.
Это не единственная современная тенденция в дизайне, которая работает, но, вероятно, это самый простой в реализации и самый надежный выбор независимо от отрасли или ниши. Я собрал все это сам, как не дизайнер и лишь ограниченный взгляд на эстетику. А благодаря простоте плоского дизайна, несмотря на мои недостатки, страница выглядит совершенно профессионально.
Тренд целевой страницы №12: Анимированные видео
Анимированные видеоролики — это то же самое, что иллюстрации к фотографиям. Они обеспечивают большую гибкость, помогая посетителям визуализировать идеи и процессы, которые управляют вашим бизнесом, и ценность, которую вы предоставляете.
С анимированными видеороликами можно делать все, что угодно. Это дает ему высокую способность к блеску и эффективности, а также высокую способность быть абсолютным мусором. Если вы выберете маршрут анимированного видео, убедитесь, что вы работаете с талантливыми людьми, например с людьми, которые работали над этим видео для Mint.com.
Тренд целевой страницы № 13: Анимированные элементы страницы
Анимированные элементы страницы предназначены для создания динамического визуального потока. Вместо того, чтобы просто прокручивать неподвижную страницу вниз, анимированные элементы могут улучшить движение глаз, привлекая внимание к одному разделу за другим.
Красивый пример анимации в действии ✨
При стратегическом использовании эти элементы могут улучшить общее впечатление от страницы.При неправильном использовании они просто отвлекают. Меньше обычно здесь больше, так что либо будьте действительно нацелены с помощью ваших анимированных включений… либо действительно редкими.
Тренд целевой страницы № 14: Интерактивный контент
Интерактивный контент берет на себя некоторые из целей анимированных элементов страницы и превращает их в огромную дозу лекарств, повышающих эффективность конверсии.
Интерактивный контент пытается захватить читателя и вставить его в повествование страницы. Это амбициозная цель, и для ее выполнения требуется технически опытная команда, но если вы это сделаете, вы сможете достичь абсолютной цели: ваши посетители никогда не забудут вашу целевую страницу.
Поймай единорога!
Один из моих любимых примеров интерактивного контента — это Huemor, нью-йоркская фирма, занимающаяся веб-дизайном.
При перемещении курсора по странице космонавт тоже перемещается 🚀
В этом случае интерактивный контент не только делает страницу и компанию более запоминающимися, но и демонстрирует набор навыков компании.
Тренд целевой страницы №15: стратегические всплывающие окна
Всплывающие окна, кажется, колеблются между любимым маркетологом и ненавистным бывшим, по крайней мере, раз в год.
Всегда есть новое тематическое исследование, чтобы показать, насколько они эффективны в привлечении потенциальных клиентов, и всегда есть новое тематическое исследование, в котором говорится о том, как первоначальное увеличение количества потенциальных клиентов не влияет на доход.
Раньше в моде были простые всплывающие окна. Тогда это было намерение выйти. Теперь это похоже на полноэкранные всплывающие окна, которые больше похожи на внезапную атаку целевой страницы, чем на всплывающее окно.
Полноэкранное всплывающее окно, АТАКА!
Единственное, что мы можем сказать определенно о всплывающих окнах, — это то, что они в тренде… и, вероятно, всегда будут.
Тренд целевой страницы №16: Параллаксная прокрутка
Параллакс-прокрутка заставляет элементы фона и переднего плана страницы перемещаться с разной скоростью. Это создает интересный динамический эффект, контрастирующий с традиционной прокруткой.
Параллакс в действии
Это одна из тех тенденций, которые, вероятно, не окажут заметного влияния на результаты поиска. Это может быть приятным изменением темпа, если его используют несколько сайтов из вашей ниши, но в остальном это просто выбор предпочтений.
Тенденция 17 целевой страницы: призыв к действию
Каждая целевая страница должна иметь единственную цель, и все на этой странице должно быть сосредоточено на достижении этой цели.
Ваш призыв к действию — вот где все это приходит в голову. В продажах говорят, что нужно всегда закрывать. Ваш призыв к действию — ваш конец. Здесь вы говорите: «Хорошо, хватит разговоров. Давай, сделай это ».
Каждой целевой странице нужен призыв к действию, поэтому убедитесь, что он есть у вас и убедителен.
Сильное ценностное предложение все равно не спасет их от Disney и Amazon, хотя
Тренд целевой страницы № 18: предложение творческой ценности
Стандартный формат ценностного предложения — это заголовок, за которым следует подзаголовок, за которым следует CTA.
В этом базовом формате нет ничего плохого, но компании становятся все более творческими со своими ценностными предложениями, привнося все больше и больше элементов, таких как видео, социальные доказательства, инструменты и т. Д., Как мы можем видеть в этом примере из Carrot.
1 ценностное предложение… 3 различных типа социального доказательства
Чтобы глубже погрузиться в этот сложный мир, ознакомьтесь с этим руководством о том, как написать ценностное предложение.
Тенденция 19 целевой страницы: тот или иной CTA
Как я упоминал ранее, мы действительно хотим, чтобы у нашей целевой страницы была одна единственная цель.
Тем не менее, поскольку сегментация становится все более и более распространенной, пересечение отдельных CTA и сегментации становится немного сложнее.Например, что вы будете делать, если один и тот же профиль аудитории потенциально может быть разделен на две разные последовательности?
Вот где может пригодиться «тот или иной» призыв к действию. По сути, вы говорите: «Либо сделай то, либо сделай то».
Тот или иной ⚖
На приведенной выше странице, например, я не знаю, почему люди, попавшие на эту страницу, заинтересованы в том, чтобы нанять меня, поэтому я даю им два варианта … в основном говоря: «Если вы здесь для копирайтинга, нажмите здесь. Если вы здесь, чтобы заниматься контент-маркетингом, нажмите здесь.”
Тенденция 20 целевой страницы: многоступенчатые формы
Когда дело доходит до продаж, информация — это все. Чем больше вы знаете о потенциальных клиентах, тем лучше вы готовы адаптировать свое предложение к их уникальным потребностям. Многоступенчатые формы — это своего рода скрытый способ получить больше информации, не отпугивая пользователя.
Представьте, как долго это было бы, если бы не было многошагового
Допустим, вы хотите собрать 9 единиц информации. Отображение формы с 9 полями вперед кажется немного пугающим и заставляет пользователя отказываться.С другой стороны, форма из трех полей появляется быстро и легко.
В многоэтапной форме вы можете отобразить для пользователя форму с 3 полями, а затем просто выполнить два дополнительных шага с 3 полями в каждом, что даст вам 9 полей информации, не отпугивая пользователя.
Тренд целевой страницы № 21: пронумерованные шаги
Одна из вещей, которую вы, возможно, заметили, — это то, что многие сайты любят проводить вас через свою презентацию в пронумерованных шагах.
Podium использует пронумерованные шаги, чтобы продемонстрировать преимущества использования своего программного обеспечения.
Людям действительно нравится мыслить линейно — сначала то, потом то, наконец, то, наконец, — а числа позволяют легко понять, что им предлагают.
Это несущественно, и во многих случаях числа можно удалить без каких-либо реальных недостатков, но для некоторых посетителей может быть полезна возможность контекстуализировать каждый шаг в пронумерованном порядке.
Тренд целевой страницы № 22: Экскурсии
Если вы действительно хотите перейти на новый уровень, держась за руки, вы можете создать управляемый опыт работы с вашей веб-страницей.Это очень часто бывает при подключении пользователей к новым программным инструментам, где элементы управления могут быть сложными, а удержание зависит от того, что клиент это выяснит.
Пример экскурсии с автопилота
Ту же концепцию можно применить и к целевой странице, но, как и в случае с видео с автоматическим воспроизведением, она, как правило, лишает посетителя возможности действовать, что не всегда приветствуется.
Если вы чувствуете необходимость создать экскурсию, это также, вероятно, означает, что ваша копия и UX-поток недостаточно ясны.Экскурсия с гидом не требуется. Это больше то, с чем вы можете поэкспериментировать, если пытаетесь добиться определенного пользовательского опыта.
Тренд целевой страницы № 23: Бесплатные инструменты
По мере того, как конкуренция продолжает расти, борьба за выделение себя становится все более сложной. Одна из стратегий, которые используют многие компании, чтобы выделиться из толпы, — это создание бесплатных программных инструментов, которые можно загрузить или использовать непосредственно через их веб-сайты.
Бесплатные инструменты Sumo используются более чем на 800 тыс. Веб-сайтов
Если функция достаточно полезна, инструменты могут снова и снова привлекать людей на вашу страницу.Их также можно использовать, чтобы напрямую вести к процессам захвата лидов или другим типам воронок.
Большинство компаний не желают вкладывать средства в создание инструмента, и именно это делает бесплатный инструмент таким эффективным.
Тренд целевой страницы №24: чат-боты
Чат-боты — отличный способ начать настоящую беседу с посетителями сайта. Моделируя работу агента по обслуживанию клиентов в реальном времени, он побуждает посетителей объяснять, что они ищут, что позволяет вам дать им именно это.
Чат-боты в действии
🤖Хотя более продвинутые чат-боты могут позволить вам продолжить разговор «без помощи рук», похоже, что большинство людей, успешно использующих ботов, используют их просто для того, чтобы вызвать настоящий разговор с реальным сотрудником.
Тренд целевой страницы № 25: Отзывы
Нет ничего более сильного в продажах, чем рекомендация друга, и, как оказалось, рекомендация незнакомца имеет аналогичный эффект, даже если он немного менее эффективен.
И не обязательно писать отзывы, вы можете использовать видео, чтобы показать посетителям, что ваши клиенты говорят о вашем продукте или услуге.
Monday использует видео-отзывы, чтобы показать своих счастливых клиентов
Отзывы позволяют вам быть действительно продавцами, не чувствуя себя продавцами. В конце концов, если ваши клиенты трудно продавать вам, может кто-нибудь виноват вы для обмена, что публично?
Хороший отзыв затронет решенные болевые точки и преимущества их решения.Это также подчеркнет вашу целевую аудиторию, исходящую от кого-то, кто выглядит и звучит точно так же, как люди, которым вы пытаетесь продать.
Тенденция № 26 целевой страницы: Оптимизация страницы благодарности
Что происходит после того, как люди откликаются на ваш призыв к действию? Если ответ — «немного», вы упускаете прекрасную возможность, особенно в отношении более низких инвестиционных конверсий, таких как подписка по электронной почте.
Эти люди только что сказали вам «да», и теперь они могут продолжить работу с вашим бизнесом.Вам следует определить следующий естественный шаг на этом пути и оптимизировать страницу с благодарностью, чтобы продвинуть их дальше по воронке.
Например, если кто-то только что загрузил вашу электронную книгу, вы можете побудить их поделиться ссылкой для скачивания со своими друзьями, предложив им еще одну бесплатную загрузку в обмен на долю.
Вы можете создать такую же целевую страницу с помощью бесплатного инструмента GoViral
.Тренд целевой страницы № 27: Брендовые панели
Панель брендов — это визуальная панель, на которой отображаются несколько логотипов известных брендов, с которыми вы работали в прошлом.
На сайте Каролы используются бары брендов, чтобы продемонстрировать все замечательные компании, с которыми она работала.
Цель панели брендов — проверить легитимность вашего собственного бренда, используя доверие или репутацию представленных брендов. По сути, вы говорите: «Мы не те люди, которые пытаются обмануть наших первых клиентов, заставив их рискнуть. Мы работали с этими брендами, о которых вы слышали, и это означает, что мы, вероятно, действуем на законных основаниях ».
Как и другие формы социального доказательства, это не всегда будет иметь значение, но это одна из тех вещей, которые могут сдвинуть иглу в чьей-то голове и заставить попробовать ваш бренд.
Тенденция 28 целевой страницы: больше белого пространства
Дизайн — это не главное для целевой страницы. Дело в сообщении, а цель дизайна вашей целевой страницы — выделить и облегчить это сообщение.
PhoneWagon отлично использует пустое пространство
Вот почему обширное белое пространство стало такой популярной тенденцией в дизайне целевых страниц. В прошлом дизайнеры часто пытались втиснуть на страницу как можно больше контента, поэтому переход на все больше и больше пустого пространства стал заметной тенденцией.
Белое пространство дает странице возможность дышать. Он приятен для глаз и позволяет им легко находить основное сообщение на странице и следовать ему.
Тренд целевой страницы № 29: жирный шрифт большого размера
Подобно большему количеству белого пространства, тенденция к более крупной и смелой типографике делает визуальный акцент именно там, где вы хотите: слова… сообщение.
Трудно пропустить сообщение на странице с большими жирными буквами, обрамленными обширным белым пространством… фактически, это единственное, на чем вы, , можете сосредоточиться.
Трудно пропустить это БОЛЬШОЕ ЖЕСТКОЕ СООБЩЕНИЕ
👀С одной стороны, опасность использования более смелой типографики заключается в том, что все остальные тоже, и вы не хотите, чтобы ваш сайт выглядел точно так же, как любой другой сайт. Но правда в том, что большинству клиентов все равно, выглядит ли ваш сайт как другие. Они действительно заботятся только о ценности, которую вы им предлагаете, и если жирная типографика помогает им понять эту ценность, на самом деле нет никаких недостатков.
Тренд целевой страницы № 30: Незаметное движение
Это тонкая тенденция… хе-хе… но, тем не менее, тенденция.
Дизайнеры начинают использовать легкие движения для создания атмосферы, не отвлекая при этом чрезмерно.
Посмотрите на эту тенденцию в действии здесь:
Легкое трепетание растений на ветру создает идеальную атмосферу
Цель аналогична цели анимированных элементов страницы. Это делает страницу более динамичной и интересной. Это тоже довольно легко сделать.
Используйте эту тенденцию, когда вы стремитесь к определенным ощущениям и хотите передать их посетителям, когда они будут знакомиться с вашей страницей.
Тренд целевой страницы № 31: падающие тени
Как мы уже несколько раз упоминали в этом посте, мы хотим, чтобы наше сообщение выделялось и выделялось дизайном и макетом страницы. В то же время мы также хотим использовать впечатляющие визуальные эффекты, в том числе отличные фоновые изображения.
Но что происходит, когда идеальный фоновый рисунок затрудняет чтение копирайтинга?
Что ж, вам нужен какой-то инструмент дизайна, чтобы сделать копию более четкой, а тени — один из нескольких инструментов, которые позволяют вам это делать.Используя тени, вы можете сделать текст, который в противном случае мог бы сливаться с фоном, действительно выделяющимся, гарантируя, что сообщение будет видно и прочитано.
ЗаголовокBill’s Comfort Systems выделяется тенями.
Тренд целевой страницы № 32: короткие, простые заголовки
Заголовки обычно являются наиболее важными частями текста на вашей странице. Посетители будут определять, читают ли они следующий раздел, исходя из качества заголовка.
Соответственно, описательные заголовки долгое время были нормой.Однако в последнее время, в соответствии с тенденцией к чистому, более минималистичному дизайну, стало тенденцией пытаться сжать текст заголовка в короткие, более резкие заголовки.
Всего 3 слова. Все еще делаешь работу.
Делать это, не жертвуя ясностью, — это своего рода искусство, поскольку вы рискуете упустить важную информацию, но если вы сможете это сделать, ваши заголовки и общая страница будут чище и четче.
Тренд целевой страницы № 33: диалоговое копирование
Маркетологам и владельцам бизнеса становится все более очевидным, что клиенты не хотят, чтобы их продавали.Они просто хотят, чтобы с ними общались, как с нормальными людьми.
Соответственно, за последнее десятилетие мы наблюдали сдвиг в компаниях, которые переходили от более формального копирования веб-сайтов к гораздо более разговорному тексту, который читается как личная беседа.
Это никоим образом не было скопировано и вставлено из реальной беседы
Удивительно, но писать в разговорной манере — одна из самых сложных задач для копирайтеров, не занимающихся копирайтингом, и даже копирайтеров более низкого уровня.Большинство из нас с юных лет были запрограммированы на то, чтобы связывать формальный язык с профессионализмом, и в результате отделить ненужные формальности от письма нелегко.
Решение состоит в том, чтобы либо нанять талантливого копирайтера, либо согласиться с тем, что вы, вероятно, не собираетесь создавать что-то полезное с первого раза. Сделайте столько ударов, сколько вам нужно, чтобы избавиться от формального языка и создать что-то разговорный.
Тренд целевой страницы № 34: Мобильные приложения
Ранее мы говорили о дизайне, ориентированном на мобильные устройства, но некоторые компании попытались пойти еще дальше, поощряя людей использовать приложение для продолжения взаимодействия с компанией, а не через браузер.
Единственный раз, когда это стоит проверить, если две вещи верны:
- Привлечение посетителей к вашему приложению дает значительное интуитивное преимущество.
- Единственная цель целевой страницы — увеличить количество загрузок приложений.
Если одно из этих двух утверждений неверно, не пытайтесь это сделать!
Отрасли, которым может быть полезно приложение
3Если ваша компания не относится ни к одной из этих сфер, вам не нужно приложение.
Тренд целевой страницы № 35: Макет карточек
«Карточки» целевой страницы — это способ организации содержимого страницы в пределах однородных прямоугольных областей, напоминающих карточки.
Карты сайта в действии
Эта тенденция, кажется, особенно популярна как функция премиум-шаблонов веб-дизайна, а не как средство индивидуального дизайна. Тем не менее, он имеет свои достоинства как инструмент для дифференциации, выделения и организации контента без ущерба для важного белого пространства, которое мы обсуждали ранее.
Следующие шаги
Спасибо за ознакомление с этим руководством.
Имейте в виду, что тенденции не являются показателем успеха вашего собственного уникального бизнеса.Единственный способ узнать, что найдет отклик у вашей целевой аудитории, — это поэкспериментировать и убедиться в этом самим. И, как вы видели в этом руководстве, нет недостатка в идеях целевых страниц для тестирования.
Вы уже пробовали что-нибудь из этого? Они улучшили или ухудшили производительность вашей целевой страницы?
Дайте нам знать в комментариях.
То, что думают эксперты, поразит вас
ПРИМЕЧАНИЕ РЕДАКТОРА: в этот пост добавлено больше тактик и ссылок для вас 🙂
Дата исходного сообщения: 26 октября 2016 г.
Что нужно, чтобы написать песню, получившую премию Грэмми?
Становятся ли популярными песня, прическа или другой тренд, потому что он следует интересной формуле? Или это случайные, мелкие, одноразовые чудеса?…
Теперь все тенденции не выдерживают испытания временем и входят в список лучших хитов.Но обычно они популярны в краткосрочной перспективе по определенной причине (надеюсь, хорошей).
Когда дело доходит до тенденций целевой страницы, лучший способ узнать, будет ли она успешной — это проверить ее .
Когда вы тестируете тенденции, вы можете с научной точки зрения выяснить, действительно ли они повышают ваши конверсии. Стоит ли каждый тренд держать в своем портфеле приемов оптимизации коэффициента конверсии (CRO)?
Имея это в виду, мы собрали 34 тенденций целевых страниц, чтобы опробовать их на себе .Не все они подходят для каждого бизнеса, но все они заслуживают внимания, если вы хотите повысить рентабельность инвестиций. Тенденции разбиты на шесть категорий:
- Базовая конструкция
- Изображения
- Анимированные элементы страницы
- Призыв к действию (CTA)
- Ценностное предложение
- Социальное доказательство
Тема 1: Базовый проект
Эти тенденции рассматривают всю целевую страницу как enchilada. Этот раздел должен дать вам общее представление о макете целевой страницы, от длины страницы и количества контента до навигации и заголовков.
Тенденция №1 целевой страницы: большая длина
Существуют тесты, показывающие как длинные, так и короткие целевые страницы, которые приносят больше конверсий. На заре CRO, когда большинство пользователей просматривали страницы на настольных компьютерах, целевые страницы имели тенденцию к более коротким «одностраничным страницам», где все было выдвинуто в первую очередь.
Сегодня мы переходим к целевым страницам более длинной формы. С появлением умных устройств и сенсорной прокрутки вам больше не нужно помещать все в топ, чтобы получить оценку конверсии.Пользователи интуитивно перемещаются по странице вниз, чтобы найти то, что им нужно.
Вот пример: Highrise провела A / B-тест, который дал на 37,5% больше конверсий на более длинной целевой странице:
Length также дает вам возможность стратегически включить несколько CTA ( подробнее об этом позже ). Только не забудьте разместить их аккуратно и протестировать, чтобы не отвлекать посетителей от главной цели.
Идея этой тенденции заключается в том, что люди хотят узнать больше о своих возможностях.Мир становится все больше покупателем, в котором люди ищут информацию и принимают обоснованные решения, в отличие от компаний, преследующих потребителей с помощью традиционных рекламных объявлений.
Мими Ан из Hubspot объясняет , как должны развиваться продажи :
«Современные коммерческие покупатели самостоятельно ищут информацию о товарах. На этапе повышения осведомленности покупатели полагаются на поиск, веб-сайты поставщиков и информационные бюллетени / электронные письма как на основные каналы поиска информации. Когда они будут готовы к покупке, они предпочитают связаться с торговым представителем.”
Нельзя сказать, что длинные целевые страницы всегда предпочтительнее — это тенденция. А главное, как мы знаем, чтобы всегда проходил тестирование.
Тенденция № 2 для целевой страницы: простой и минималистичный
Проще говоря, минималистский дизайн никуда не денется. Принципы дизайна, которые сохраняют ваши страницы чистыми и лаконичными, всегда будут иметь значение. Это способ снизить когнитивную нагрузку ваших посетителей ( совет по юзабилити-тестированию № 26 ) и не дать им подумать о том, как сделать конверсию.
Компании совершенствуются и берут на себя всю тяжелую работу за посетителей, делая вещи максимально удобными для восприятия.
Вот пример теста «беспорядок» и «чистый», проведенный British Gas:
Версия Cleaner B увеличила количество онлайн-бронирований на 50% — источник изображения
Тенденции простого и минималистичного дизайна включают такие вещи, как:
- Белое пространство
- Простая, прямая копия
- Четкие, прямые заголовки
- Четкие, прямые призывы к действию
- Меньше цветов
- Контрастные цвета CTA
- Инкапсуляция
- Высокая читаемость
Тенденция № 3 целевой страницы: разделение экранов на две колонки
Использование дизайна с разделенным экраном позволяет визуально разбить информацию на большие сегменты, что упрощает ее обработку.
В этом примере из Stitch Fix посетители могут смотреть влево, чтобы увидеть визуальное объяснение, и смотреть вправо, чтобы найти читаемый контент:
Ваш мозг умеет переваривать изображения слева и слова справа — источник изображения
Вот анимированный пример макета разделенного экрана из Typeform:
Двухколоночная структура упрощает обработку структурированной информации мозгом. Эта тенденция встречается реже, но, вероятно, она растет, поскольку снижает когнитивную нагрузку и выделяет заголовок.
Тенденция 4 целевой страницы: нет панели навигации
Исключение отвлекающих панелей навигации и нижних колонтитулов очищает целевую страницу визуально и приближает вас к цели по соотношению внимания 1: 1 (передовой опыт №2).
Брайан Харрис из Videofruit популяризировал эту идею и утверждает, что в результате количество его подписчиков на электронную почту выросло на 35%.
Bonus Trend: Предприятия пробуют полускрытую навигацию «если вы действительно этого хотите» на своих домашних страницах вместо традиционных меню.Панели навигации, также известные как «перевернутая целевая страница», находятся внизу страницы. Размещение навигации за пределами первого сгиба на домашних и целевых страницах помогает посетителям сосредоточиться на вашей цели.
Тенденция № 5 целевой страницы: заголовки с ответом «Я хочу…»
Времена уклончивых, продажных, эвфемистических заголовков давно прошли. Компании используют ясные и очевидные заголовки, которые отражают основные потребности своих посетителей.
Тенденция состоит в том, чтобы отвечать на вопрос «Я хочу…» в основном разделе заголовка, как если бы посетитель думает или произносит заголовок.Таким образом, вы напрямую объясняете свое уникальное ценностное предложение с точки зрения аудитории.
Посмотрите, что делает Close.io:
Вот еще один заполненный заголовок от наших друзей из Unbounce:
Тенденция №6 целевой страницы: простой, почти невидимый заголовок
Эта тенденция еще больше отличается от классических заголовков. Простой, не изящный (но модный) способ отобразить заголовок целевой страницы — сделать сообщение заголовка настолько четким, что оно не будет похоже на заголовок.
Вот пример из Даквака, где заголовок состоит из вопроса и прямого ответа о решении:
Заголовок и подзаголовок больше похожи на вопросы и ответы, чем на заголовки — источник изображения
Почти невидимый заголовок соответствует общей тенденции посетителей, которые больше не реагируют на глупые презентации. Вместо этого будьте правдивы и прямо в заголовках.
Тенденция 7 целевых страниц: мобильные приложения
Рост числа пользователей мобильных устройств невозможно игнорировать.Уловка для охвата этих посетителей заключается в том, чтобы ваши предложения транслировались там, где ваши посетители общаются на мобильных устройствах.
Так как сейчас у нас очень много людей, которые тусуются с мобильными телефонами…
… воспользуйтесь преимуществом и превратите предложение целевой страницы в специальную целевую страницу для мобильного приложения. — источник изображения
Выделение целевой страницы для вашего мобильного приложения — важная и эффективная тактика. Вот пример целевой страницы мобильного приложения Pearr:
После загрузки вы сразу же начинаете использовать приложение на своем мобильном устройстве — источник изображения
Почему люди ухватились за эту тенденцию? Согласно MarketingLand :
По мере того, как мы проводим больше времени с мобильными устройствами, мы, вероятно, будем чаще видеть такие легко загружаемые предложения.
Тенденция 8 целевой страницы: социальные сети
Становится популярным создание целевых страниц, специально предназначенных для охвата вашей аудитории в социальных сетях. Это неудивительно — ваши посетители чувствуют себя и ведут себя в социальных сетях по-разному, поэтому вам следует адаптировать свой дизайн и сообщение для этой аудитории.
Вот пример рекламы Plate в социальной сети:
И соответствующая им целевая страница в социальных сетях:
Совет : задействуйте цикл принятия решений вашими пользователями, их настроение, их местонахождение, их психическое состояние.Адаптируйте свою целевую страницу к этому этапу опыта вашего посетителя.
Тенденция 9 целевой страницы: выделенный мобильный телефон
Удобство использования имеет большое значение, и в наши дни необходимо убедиться, что ваша целевая страница работает на всех устройствах.
Большинство предприятий по крайней мере используют более адаптивный дизайн целевых страниц с более высокой производительностью, но мы обнаружили, что специальный мобильный интерфейс, оптимизированный для мобильного трафика, более эффективен.
Согласно Максимилиано Фиртману в Smashing Magazine :
«Люди конвертируют больше, потому что их опыт использования мобильных устройств теперь лучше и быстрее, чем любое решение, которое использовалось ранее (будь то грубая мобильная версия или забитый настольный компьютер).
«Итак, да, отзывчивость лучше, чем ничего, и лучше, чем старая мобильная реализация. Но отдельный мобильный веб-сайт с таким же дизайном или даже более умное решение, созданное с использованием других технологий, обеспечит такой же или лучший коэффициент конверсии ».
Тема 2: Изображения
Правильное размещение изображений на целевой странице может стать решающим фактором между успехом и неудачей ваших платных рекламных кампаний. Пользователи, совершившие конверсию, не будут зависеть от вашего заголовка или дизайна — изображения должны привлекать вашу аудиторию и поддерживать ваше сообщение.
Вот несколько способов заставить изображения работать на целевой странице:
Тенденция 10 целевой страницы: видео
Для тех, кто может себе это позволить, эта тенденция — эффективный способ общения с посетителями. Объясняющие видео, например, получают широкое распространение в компаниях, чтобы помочь клиентам использовать приобретаемые продукты и услуги. Вы также можете рассказать свою историю с помощью видеороликов с целевой страницы.
Тенденция процветает и в отношении устройств.Вот еще один пример теста, в котором видео и изображение были размещены на видном месте в центре целевых страниц Lostmy.name:
Результат? Версия видео A выиграла до 22% в зависимости от устройства — источник изображения
Тренд целевой страницы № 11: Автозапуск полноэкранного видео
Помимо стандартного видео, полноэкранное видео с автовоспроизведением стало недавним хитом.
Видеофайл зацикливается на заднем плане с наложением, поэтому содержимое целевой страницы может по-прежнему находиться наверху и быть в центре внимания.Полноэкранные видеоролики создают живую динамику на вашей целевой странице.
CoSchedule использует полноэкранное видео за наложенным закрашенным текстом:
Фоновое видео показывает вам систему CoSchedule в действии. — источник изображения
Это также называется контекстным видео. Фахад Мухаммад из Instapage описывает контекстное видео следующим образом:
«Контекстные видео помогают настроить настроение конверсии. Ваши клиенты эмоционально возбуждаются тонкими образами и убеждают их нажать кнопку с призывом к действию.
«С полноэкранными видео вы можете включить более одного изображения на свою страницу, что означает, что у вас будет более одной возможности преобразования, чтобы оказать влияние».
Тренд целевой страницы № 12: Пользовательская фотография
Дни использования стоковой фотографии уходят, и делает их реальными. настали. Люди хотят видеть уникальные, реальные изображения и впечатления, к которым они могут относиться. Имея это в виду, неудивительно, что нестандартная фотография становится все более популярной тенденцией на целевых страницах.
Вот что делает AutoPilot :
Мы все просмотрели достаточно сайтов, чтобы чувствовать, что мы снова и снова видели одни и те же стоковые изображения, особенно те, которые относятся к нашей отрасли. Персонализированная фотография — это способ быть совершенно другим, креативным и настоящим , поэтому ваш продукт и предложение будут выделяться среди остальных.
Тренд целевой страницы № 13: вызывающие воспоминания фоновые изображения
Еще один способ выделиться — вызвать эмоции.
Например, вызывающие воспоминания фоновые изображения на целевых страницах — еще одна развивающаяся тенденция. Это способ компании визуально общаться со своими посетителями, не вторгаясь в целевую страницу. Копия и другой письменный контент могут легко отображаться поверх фонового изображения.
Вот что делает Creatrix:
Тенденция 14 целевой страницы: сравнение иллюстраций и изображений
Пользовательские иллюстрации дают компаниям еще один шанс выразить уникальную личность и подчеркнуть вашу уникальную ценность.Эта тенденция представляет собой причудливую альтернативу стоковым изображениям, которые могут улучшить ваш бренд.
Вот пример того, как дизайнер KlientBoost Оливия Тейлор улучшила целевую страницу клиента:
По кадру героя изображение …
… в кадре героя иллюстрация .
Версия с иллюстрацией повысила коэффициент конверсии нашего клиента на 13%.
С фирменными иллюстрациями вы можете быть более игривыми и выделиться среди конкурентов, поскольку ваши иллюстрации, скорее всего, будут нестандартными и вычурными.Когда вы думаете об иллюстрациях, вы обычно думаете о художнике, стоящем за работой, что делает ее более человечной.
Тенденция № 15 для целевой страницы: плоский дизайн против материального дизайна
Согласно Кубе, плоский дизайн характеризуется устранением элементов реализма, оставляя после себя упрощенный дизайн.
Кроме того, некоторые плюсы плоского дизайна (помимо модного) включают простоту интерфейса и четкую, чистую графику. В плоском дизайне часто используются яркие цвета, вызывающие положительные эмоции, и строгая типографика, подчеркивающая ваше сообщение.
Плоский дизайн завоевывает популярность благодаря чистым и простым элементам — источник изображения
Согласно DesignModo, некоторые другие преимущества плоской конструкции:
- Понимание ограничений экрана и работа с ними вместо того, чтобы пытаться быть чем-то другим.
- Оптимизированный дизайн и уменьшенное количество графических и анимированных элементов, что сокращает время загрузки.
- Меньшее количество скевоморфных элементов также может ускорить просмотр вашего контента читателями.
- Более быстрый дизайн и обновления сайта благодаря упрощенной структуре.
Упрощенные сайты с плоским дизайном можно бесконечно адаптировать, и их очень легко сделать адаптивными. Плюс помните эту тенденцию?
Тенденция 16 целевой страницы: фотографии используемых продуктов
Помещение вашего предложения в контекст показывает вашим посетителям и потенциальным клиентам социальное доказательство с помощью изображений целевой страницы. Эта модная тактика позволяет легко продемонстрировать свое уникальное ценностное предложение, не используя текст, чтобы рассказать о нем посетителям.
Вот пример из магазина гольфа на eBay:
Вот еще один пример от Club Fix:
Тенденция 17 целевой страницы: использование карточек
Карточки популярны на целевых страницах как способ систематизировать информацию на странице с «инкапсулированным» содержанием. На сайтах электронной коммерции это особенно хорошо работает для отображения вариантов продукта и прямых ссылок.
Вот пример тематического исследования Clarks :
Результат? 17.Увеличение коэффициента конверсии на 5% с версией B — источник изображения
Юридическая фирма Quincy Requin использует карточки для отображения различных функций и опций в аккуратных коробках:
Какие есть варианты карт? ( подсказка: это на французском языке ) — источник изображения
Опять же, тестирование очень важно. Это может быть просто модная легкая для глаз причуда, которая может быть лучше, а может и нет. В конце концов, это отвлекает от отношения внимания 1: 1.
Тема 3. Анимированные элементы страницы
Большинство рассмотренных нами тенденций для целевых страниц относительно пассивны: фоновые видеоролики, выбор изображений, стили дизайна и т. Д.
С помощью анимированных элементов страницы вы переходите к более активному мышлению. Вместо того, чтобы полагаться исключительно на силу ваших элементов на странице, вы добавляете движение и интерактивность, чтобы привлечь посетителей.
Давайте начнем с…
Тренд целевой страницы № 18: всплывающие окна при входе
Всплывающие окна и приветственные коврики становятся все более популярными. Это анимированный способ привлечь внимание аудитории после того, как они перешли на вашу страницу.
В этом примере Behave использует всплывающее окно с простым стимулом и призывом к действию.Наложение размывает статью на заднем плане, поэтому пользователи должны взаимодействовать, прежде чем продолжить на странице:
Через несколько секунд это всплывающее окно присоединяется к вечеринке — источник изображения
Точно так же, после нескольких секунд просмотра веб-сайта Muse, появляется приветственный коврик и заполняет весь экран целевой страницы. Предложение по подписке выглядит так:
У вас нет другого выбора, кроме как сосредоточиться на предложении, даже если вы хотите щелкнуть, чтобы выйти из него — источник изображения
Совет: В зависимости от содержания вашей целевой страницы сделайте свое всплывающее предложение релевантным содержанию на этой странице.
Тенденция 19 целевой страницы: интерактивность
Мы видим больше интерактивного дизайна и интерактивных процессов подписки на целевых страницах. Это способ вовлечь людей, а затем глубже погрузиться в процесс подписки.
Согласно исследованиям Demand Metric и Ion Interactive, интерактивный контент может существенно повлиять на ваши конверсии:
Думаю, интерактивная тенденция сохранится — источник изображения
В LeadDoubler есть интерактивный калькулятор, чтобы в первую очередь привлечь посетителей:
Совет: Создайте интерактивную викторину, чтобы заинтересовать посетителей.
Согласно исследованию Скотта Бринкера MarketingLand:
«BuzzFeed собрал миллионы репостов в Facebook с помощью интерактивных викторин, таких как« В каком штате вы на самом деле находитесь? »И« Какая у вас должна быть карьера? », Которые побили рекорды обмена в социальных сетях.
Фактически, все 10 самых популярных новостей BuzzFeed в январе были викторинами ».
Тенденция № 20 для целевой страницы: Демонстрационные гифки продукта
GIF — это простой способ добавить анимацию, демонстрирующую ваш продукт, не требуя от пользователей просмотра полнометражного видео.Это также позволяет посетителям легко оценить свои ожидания.
Вот пример из iTranslate, который объединяет тенденцию мобильных приложений ( Landing Page Trend № 8 ) с демонстрацией продукта GIF:
Тренд целевой страницы № 21: 3D-прокрутка с параллаксом
Рассказывание историй в формате GIF может оживить ваше предложение на целевой странице.
Вот отличный пример со страницы Lix Pen:
Это также может использоваться как тренд изображения используемого продукта (тренд целевой страницы № 17 ) или тренд GIF-изображения для демонстрации продукта (тренд целевой страницы № 20 ).
Тренд целевой страницы № 22: Интересные загрузочные экраны
Эта тенденция становится все более необходимой, пока люди ждут загрузки целевых страниц, а модные интерактивные дизайны становятся все более популярными.
Вот пример из Food of the Food:
Развлеките посетителей с помощью «превью», чтобы они не отскакивали до загрузки целевой страницы — источник изображения
Так же, как добавление пользовательских иллюстраций на вашу целевую страницу ( Landing Page Trend # 14 ), пользовательская страница загрузки может выразить индивидуальность и стать сильной стороной, а не отнимающей время слабостью.
Тема 4: Призывы к действию
Призыв к действию (CTA) — это лучшая мерка вашей целевой страницы.
Если пользователям нравится то, что вы предлагаете, они нажимают на ваш призыв к действию. Если они этого не сделают, они этого не сделают.
Итак, давайте поговорим о нескольких способах повышения эффективности призывов к действию, начиная с…
Тенденция № 23 целевой страницы: ориентированный на опыт призыв к действию
Что получилось: Пустые, непонятные призывы к действию, например, отправить, нажать здесь, зарегистрироваться, зарегистрироваться.
Что в: CTA, которые обращаются к пользовательскому опыту и, как правило, ориентированы на действия и представляют собой целую фразу (даже короткие).
Вот хороший пример призыва к действию от Instapage (в котором также используется трюк с заголовком «Я хочу…» из Landing Page Trend # 5 , btw):
Вот что делает реселлер музыкальных инструментов Reverb:
Тенденция 24 целевой страницы: два призыва к действию
Эта тенденция идет вразрез с передовой практикой использования одной цели для каждой целевой страницы.Однако, если все сделано правильно, два тренда CTA могут иметь эффект черепахи и зайца .
Каждый призыв к действию представлен так, как будто он касается отдельного шага. Один предназначен для исследующего посетителя, который все еще изучает варианты. Другой — для посетителя, который готов участвовать.
Вот пример из LanderApp:
обращается к аудитории в двух разных циклах принятия решений — источник изображения
Тенденция 25 целевой страницы: призрачные кнопки с призывом к действию
Этот тренд хорошо сочетается с трендом с двумя CTA, описанным выше.В этом случае ваш готовый к действию CTA является доминирующей кнопкой, а исследовательский CTA отображается как менее заметная кнопка-призрак.
У Quill есть хороший пример кнопки-призрака на этой странице:
Призрачная кнопка зарезервирована для более «холодных» пользователей, которые не так близки к конверсии и нуждаются в дополнительной информации перед фиксацией.
Тенденция № 26 целевой страницы: многоступенчатые формы
Все больше компаний открывают для себя идею многоэтапных форм, в которых вы увеличиваете количество полей и шагов формы до того, как пользователь выполнит конверсию.
Вот как Даниэль Оливас описывает тенденцию:
Waitaminute… откуда она взяла это? 🙂 — источник изображения
Если посетитель сначала должен ответить на вопросы «с низким уровнем угрозы», это создает внутреннюю приверженность завершению того, что мы начали. Увеличивая уровень угрозы по мере продвижения по этапам, пользователи с большей вероятностью поделятся своей ценной информацией к концу формы.
Тема 5: Ценностное предложение
Ваше ценностное предложение — это, по сути, «предварительный договор» с вашей аудиторией.Вы обещаете им преимущества, которые дает ваш продукт или услуга, и они покупают их, конвертируя или, по крайней мере, продвигаясь в процессе конверсии.
Вот несколько способов привлечь внимание к ценностному предложению целевой страницы:
Тенденция № 27 для целевой страницы: Визуальные эффекты продукта
Не разглашая ферму, компании предлагают взглянуть на свои продукты и услуги через визуальные эффекты.
Изображения реальных людей, использующих ваши настоящие продукты, а еще лучше, изображение счастливых людей, получающих выгоду от использования ваших продуктов — это тенденция, которая может помочь вам привлечь больше пользователей.
Вот как это работает целевая страница WeWork в Санта-Монике:
Идея состоит в том, чтобы побудить пользователей захотеть увидеть больше.
Тенденция 28 целевой страницы: Пошаговая структура
Пошаговая структура может сделать ваше ценностное предложение очевидным и ясным. Обрисовывая в общих чертах, насколько легко вашим посетителям пользоваться вашим продуктом или услугой, пользователи с большей вероятностью будут вообразить, что пользуются преимуществами — и, опять же, с большей вероятностью совершат конверсию.
Чем проще и понятнее маршрут, тем лучше. Подумайте о раскраске по номерам, например:
Можете ли вы разбить свой UVP на три простых шага? — источник изображения
Это поможет уменьшить возражения посетителей и избавить их от опасений по поводу необходимости обучения.
Тенденция № 29 целевой страницы: Экскурсии по продукту
Эта тенденция говорит о нашей психологической потребности «попробовать, прежде чем покупать». Предлагая своим посетителям бесплатные объяснения того, как работает ваше предложение, вы можете склонить их к тому, чтобы им было проще его использовать.К тому же, проходя демонстрацию, они словно помогают с процессом адаптации и уже играют роль клиента. Ваша задача — поддерживать динамику этих отношений.
Hubspot использует формат интерактивного самостоятельного тура:
Hedvig использует формат видеотура:
Тренд целевой страницы № 30: Бесплатные инструменты
Использование чувства взаимности у посетителей оказалось полезным для конверсии.Вы можете увидеть, как компании уловили эту тенденцию, предлагая бесплатные инструменты. Бесплатные инструменты — отличный лид-магнит, если вы можете позволить себе затраты на разработку.
Mayo Clinic предлагает бесплатный калькулятор ИМТ на своем сайте:
Предлагая что-то бесплатно без каких-либо условий, мы, как пользователи, чувствуем необходимость вернуть эту услугу. У нас есть естественное желание ответить на нашу доброту взаимностью.
Таким образом, если вы предлагаете бесплатные инструменты на своей целевой странице, ваши посетители с большей вероятностью будут чувствовать себя обязанными зарегистрироваться, поскольку они воспользовались вашими бесплатными инструментами (и получили от них пользу).
Тренд целевой страницы № 31: Анимированный рассказ
Это забавная тенденция на подъеме. Нет лучшего способа выразить свои преимущества и ценностное предложение, чем рассказывать истории.
Еще лучше, сделайте это анимационным сеансом рассказывания историй. Таким образом ваши посетители будут вовлечены и им не придется много думать.
Вот пример InfoQuest с интерактивной анимированной страницей повествования:
Страница анимируется при прокрутке сюжетной линии — источник изображения
Может окупиться, когда начнется преобразование.Будьте откровенны в своем повествовании.
Тренд целевой страницы № 32: диалоговая копия
Тенденция состоит в том, чтобы быть более человечным и использовать разговорные элементы, когда у вас есть возможность на ваших целевых страницах.
Вот как Оливия Тейлор из KlientBoost увеличила еще один коэффициент конверсии, используя эту тенденцию:
Она перешла с указанной выше целевой страницы…
… на целевую страницу ниже, которая повысила коэффициент конверсии на 31% .
Незаметно, но имеет значение.
Вы можете вести диалог, представляя свое ценностное предложение, используя вопросы, придавая индивидуальность тексту, сокращая предложения или используя двусторонний диалог.
Тема 6: Социальное доказательство
Социальное доказательство существует уже давно. От сарафанного радио до статистики и Yelp, покупатели всегда ищут мнения других людей, чтобы подтвердить (или опровергнуть) свое собственное.
Имея это в виду, какой самый важный вывод для социального доказательства на сегодняшних целевых страницах?
Сохраняйте реальность.
Тенденция № 33 целевой страницы: Подробные характеристики свободного выгула
Использование реальных людей и реальных влиятельных лиц с реальными данными — гораздо более эффективный способ получить конверсию, чем одобрение знаменитостей с завышенной ценой и фальшивый энтузиазм.
Список отзывов можно продолжать и продолжать. я насчитал 49 — источник изображения
Элемент «свободный диапазон» дает вашим посетителям и потенциальным клиентам возможность увидеть реальные углы обзора пользователя с поля.С длинным списком отзывов от Basecamp обязательно появится опыт работы с клиентами из отрасли, к которой может относиться почти каждый посетитель.
Twitter — еще один способ представить достоверные отзывы клиентов о целевых страницах. Foundr Magazine размещает несколько твитов в строке соц. Доказательств на своей целевой странице:
Посетители с большей вероятностью ответят на реальные цитаты, основанные на реальном опыте пользователей, поскольку они, вероятно, сами столкнутся с подобными сценариями.Вы даже можете узнать о дополнительных преимуществах, которые обнаруживают пользователи, которые вы можете продвигать в будущих рекламных кампаниях.
Тенденция № 34 целевой страницы: Оптимизация страницы благодарности
Включение вашей страницы благодарности в цельную страницу — еще одна тенденция, на которой можно извлечь выгоду. Слишком часто компании забывают замкнуть цикл и думают, что тяжелая работа прекращается после того, как происходит преобразование.
Тот факт, что кто-то нажимает на ваше предложение, не означает, что пользовательский интерфейс завершен.На самом деле все наоборот. Теперь, когда вы убедили кого-то принять участие в вашем предложении, докажите, насколько вы классны, и покажите им, как здорово быть вашим клиентом.
Вот что делает Orbit Media Studios:
Вы точно знаете, чего ожидать и как часто. Кроме того, есть кнопки публикации в социальных сетях и панель навигации для более подробного изучения — источник изображения
Порадуйте своих клиентов своей страницей благодарности. Расскажите своим посетителям, чего ожидать, а также когда и как будет доставлено ваше предложение.
Кроме того, это место, где можно похвастаться дополнительными солнечными лучами. Вы можете включить публикации в социальных сетях, похожие предложения, навигационные ссылки, чтобы узнать больше о своей компании и т. Д.
Закрытие
Итак, какие тенденции сохранятся? Давай выясним. Воплотите эти тенденции целевых страниц и сообщите нам, какие из них лучше всего показали повышение коэффициента конверсии.
Затем мы можем определить, кто из победителей войдет в список лучших практик для целевой страницы, и добавить их в наш набор инструментов CRO.
Сообщите нам, что работает для вас (или нет) в комментариях ниже!
тенденций в дизайне посадочных страниц, которые будут править в 2020 году — агентство по дизайну посадочных страниц | Услуги по автоматизации бизнес-процессов
Придайте своему бренду стильный и современный вид с помощью этих тенденций дизайна целевых страниц.
Избавьтесь от нестандартных макетов сетки, статического фона и прямых призывов к действию. Вместо этого стратегически выделяйте бестселлеров, не указывая их открыто в дизайне целевой страницы, чтобы управлять всем 2020 годом.
При создании целевой страницы превращение вашей аудитории в потенциального клиента обычно является вашей главной целью. Многие маркетологи думают, что единственный фактор, который имеет значение для превращения вашей аудитории в клиента, — это то, что вы им предлагаете. Хотя это правда, дизайн вашей целевой страницы также играет очень важную роль в привлечении потенциальных клиентов. Интернет полон конкуренции с вашим бизнесом, и обычно есть сотни конкурирующих посадочных мест, поэтому для вашего успеха необходимо, чтобы вы сияли, как солнце в эта галактика планет.Если вы не уверены, этот пост расскажет вам, почему вам нужно следить за лучшими примерами целевых страниц и тенденциями дизайна в 2020 году.
Почему дизайн целевой страницы имеет значение?
Вы не поверите, но правильный дизайн — это решающий фактор для эффективной кампании по созданию целевой страницы. Успех вашей целевой страницы зависит от первых 2,6 секунды, потраченных посетителем , которые формируют первое впечатление о вашем бренде. Следовательно, если ваш дизайн не сразу убедителен, вы не сможете убедить потенциального покупателя своим предложением.Мы принимаем решения на основе эмоций, потому что наши мысли формируются эмоциями. Следовательно, ваш дизайн вызовет эмоции, которые будут диктовать решение, независимо от вашего предложения, и вызовут либо доверие, либо недоверие .
По данным Forbes, около 65% людей обучаются визуально, и мы запоминаем изображения с точностью не менее 90%. Таким образом, это доказывает, что ваши целевые клиенты — визуальные существа, а дизайн целевой страницы оказывает существенное влияние на пользователей.
Около 65% людей обучаются визуально, и мы запоминаем изображения с точностью не менее 90%
Идеальная целевая страница всегда будет держать ваш бренд на шаг впереди конкурентов . Ваша минималистичная целевая страница не только произведет сильное впечатление, но также убедит пользователей принять необходимые меры . Когда вы сосредотачиваетесь на четкой цели и согласовываете свой дизайн с ней, ваша целевая страница будет успешной, пока ваше предложение также соответствует дизайну.
Бренд должен предоставлять то, чем хотят стать его клиенты. Итак, будьте в курсе последних тенденций целевых страниц подскажет, как другие достигают этого. Итак, давайте рассмотрим последние тенденции дизайна в 2020 году.
Тенденции дизайна посадочных страниц в 2020 году
Как уже упоминалось, если вы хотите выделиться среди конкурентов, вы должны быть в курсе последних тенденций в дизайне посадочных страниц. Ни одна формула не подходит для создания идеальной целевой страницы, но вот 6 тенденций дизайна, которые могут сделать вашу целевую страницу более привлекательной и, таким образом, привести к привлечению большего количества потенциальных клиентов.
Минимализм
«Делайте это коротко и просто»
Минимализм — это не новая концепция, это проверенный способ выразить идею бренда в яркой форме . Доказано, что простые и минималистичные целевые страницы привлекают больше внимания и помогают быстрее достичь маркетинговых целей.
«Меньше значит больше» предполагает, что вы упрощаете все, что вы размещаете на своей целевой странице:
- Избегайте многословия.
- Выберите самый мощный образ.
- Имейте единый призыв к действию.
- Дизайн: Общайся, а не украшай. Сделайте это как можно проще.
- Минималистичный дизайн поможет пользователям легко получить доступ к вашей целевой странице с любого устройства.
- Простая целевая страница будет загружаться быстрее и тем самым повысит коэффициент конверсии.
Минималистский дизайн — ключевая стратегия для достижения выдающихся результатов . Итак, «ПОЦЕЛУЙТЕ» свою целевую страницу, чтобы привлечь больше потенциальных клиентов.
Геометрические фигуры
Вспомните свое детство, когда вы играли с разными фигурами, такими как квадраты, круги и треугольники — все мы привыкли к этим геометрическим фигурам. Элементарные формы и цвета играют в нашем подсознании особую роль . Вот почему формы и различные сочетания цветов могут играть жизненно важную роль на вашей целевой странице.
Все мы знаем, что мы сильно привязаны к эмоциональным воспоминаниям, и мы ранее упоминали, что принимаем решения на основе эмоций. Таким образом, использование эмоций в вашем маркетинге принесет вам самые сильные результаты, особенно геометрические формы.
«У людей геометрические формы ассоциируются с эмоциями» Джон Н.Bassili, 1978
Если говорить о геометрических формах, круг — это абстрактный символ счастья, а заостренный треугольник вызывает чувство страха у миндалины. Это не означает, что вы должны использовать только круги и никогда не треугольники в своем дизайне, но что вы, , должны использовать треугольник в контексте, где уместен страх , например, предупреждения или вызов FOMO (страх упустить).
Custom Illustration
Независимо от того, в какой вы области или отрасли, аудитория хвалит аутентичность, и это необходимо учитывать на вашей целевой странице.Если вы используете стоковые изображения, которые явно не представляют ваш бренд или организацию и в которые трудно поверить как свои собственные, значит, вы недостоверны. Вы можете выбрать индивидуальную иллюстрацию, которая привлекает больше внимания клиентов . Уникальные и индивидуальные иллюстрации могут не только придать аутентичности вашей целевой странице, но и укрепить послание вашего бренда.
Фактически, существует многих крупных многонациональных корпораций и брендов, которые используют собственные иллюстрации для достижения выдающихся результатов.Это делает вашу целевую страницу привлекательной и привлекающей внимание читателя. Применение пользовательских изображений или иллюстраций привлечет внимание пользователей, повысит ценность вашего бренда, а также предложит опыт в данной нише. Если вы прилагаете усилия для создания собственных иллюстраций и ваших конкурентов или используя стоковые фотографии, вы на шаг впереди них.
Видеоконтент и анимация
Видеоконтент — это ведущий маркетинговый ход, если вам нужно больше потенциальных клиентов и более длительное время взаимодействия.Размещение видеоконтента на целевой странице так же важно, как и минималистичный дизайн. В среднем более 90% сегодняшних посетителей веб-сайтов оценивают видеоконтент. В поисковой выдаче больше трафика проходит через видео и другой визуальный контент. Видеоконтент растет день ото дня, и это помогает в увеличении доходов более быстрыми темпами, чем текстовый контент.
В связи с растущим спросом на видеоконтент, целевые страницы с видео являются идеальным способом поделиться информацией о продукте с вашим клиентом. Mailchimp использует анимационные видеоролики на своей целевой странице для привлечения посетителей . С помощью видеоконтента и анимации рынки могут легко рассказать историю и привлечь посетителей убедительным повествованием и эмоционально привлекательным контентом.
Заключение
Мы надеемся, что описанные выше тенденции дизайна целевой страницы вдохновят вас на то, как сделать вашу целевую страницу привлекательной и вызвать у посетителей соответствующие эмоциональные отклики .Убедитесь, что ваши целевые страницы должны быть краткими и простыми. Вы также должны выбрать индивидуальные иллюстрации, чтобы отделить себя от конкурентов, и использовать видеоконтент, популярность которого по-прежнему быстро растет.
Быть в курсе последних тенденций в дизайне окажется полезным и даст вам выдающиеся результаты при правильном применении.
Мистер Ноэ ставит перед собой задачу возвышать человечество и согласовывать свои действия с предпринимателями, преследующими не меньшую цель, путем внедрения стратегий автоматизации.Мы создаем системы автоматизации, которые заменяют процессы, не требующие ни человеческого сочувствия, ни интеллекта.
FAQ
В. Что должна включать целевая страница?
Ваша целевая страница должна включать: броский заголовок, краткое описание, рассказывающее о вашем продукте и предложении, изображение или короткое видео (вы также можете использовать собственные иллюстрации, анимацию в соответствии с вашими потребностями), форму для сбора информации о пользователях, Кнопка призыва к действию (CTA) привлекательного цвета и дизайна.
В. Каковы последние тенденции в дизайне целевых страниц?
Некоторые из популярных тенденций дизайна целевой страницы включают минимализм, видеоконтент и анимацию, пользовательскую иллюстрацию, геометрические фигуры и многое другое, что поможет вам выделить вашу целевую страницу.
В. Какую роль дизайн играет в создании целевых страниц?
Дизайн вашей целевой страницы оказывается наиболее эффективным методом воздействия на поведение пользователей. Это поможет вам оставаться уникальным и опережать конкурентов.Это не только произведет сильное впечатление на пользователя, но и побудит его предпринять соответствующие действия, если ваш бренд заржавеет.
В. Вам нужен веб-сайт для дизайна целевой страницы?
Нет, вам не нужен веб-сайт для размещения целевой страницы. Вы можете легко создать хорошую целевую страницу с помощью различных приложений, таких как Unbounce, Leadpages, Sleeknote и многих других.
Разблокировка 5 основных тенденций развития посадочных страниц в 2021 году | Эвелина Адамчак
Фотография предоставлена Уильямом ИвеномВы можете в это поверить? Почти 2021 год !!! И вы знаете, что это значит … пришло время вдохновения для дизайна на 2021 год.Потому что какой лучший способ с нетерпением ждать нового года, чем некоторые тенденции в дизайне посадочных страниц (другие ботаники по дизайну пользовательского интерфейса поймут).
Но прежде чем я углублюсь в тенденции, позвольте мне кратко рассказать о целевых страницах. Я недавно узнал (и создал) некоторые из этих отличных страниц во время стажировки в Quze.
Итак, что такое целевая страница? Одноцелевая веб-страница, конечная цель которой — заставить пользователей выполнить обозначенное действие с помощью «призыва к действию» (CTA). Скажем, например, вы хотите, чтобы ваши пользователи покупали вашу новую электронную книгу.
Вы создаете объявления, электронные письма и ссылки, которые направляют пользователей на вашу целевую страницу, где они могут получить продукт, который вы создаете. Итак, теперь, когда у нас есть разъяснения по целевым страницам, давайте перейдем к сочному содержанию.
Все мы знаем, что тенденции и причуды приходят и уходят. Это верно для всех дизайнерских дисциплин, от искусства до моды и дизайна продукции. Без лишних слов, вот прогнозируемые основные тенденции для целевых страниц на 2021 год.
Изящный минималистичный дизайн и лаконичный текст означают более высокий коэффициент конверсии.
Добавить комментарий