Грамотный владелец сайта постоянно стремится его улучшить. Поэтому он должен анализировать не только мнение своей аудитории, сведения веб-аналитики и отзывы посетителей, но и тенденции сферы его работы. Потому что в них присутствует много полезных вещей, которые улучшают взаимодействие клиентов с сайтом. Но их нужно применять с умом. Стоит использовать только подходящие направления, которые способны решить определенные проблемы сайта и принести пользу развивающемуся бизнесу.
Для желающих оптимизировать свой сайт, в статье приведены основные тенденции веб-дизайна, а также даны советы по применению этих трендов на вашей площадке.
1. Юзабилити станет товаром
Пример улучшения юзабилити сайта https://www.telemirspb.ru/
Привлечение большего количества людей и уменьшение количества звонков в службу поддержки происходит благодаря следованию основным правилам юзабилити. Много компаний занимаются проверками сайтов, потому что есть спрос на поиск ошибок. Все больше людей заказывают услуги через интернет и делают покупки, поэтому удобная организация сайта привлечет больше посетителей.
Многие берутся сами за создание сайтов, а потом приходят к нам с тем, что получилось и на это безобразие иногда трудно смотреть. Необходимо заранее продумать какие разделы будут добавлены сразу, а какие позже. Это важная составляющая создания сайтов: она отражает процесс взаимодействия с ресурсом. Предусмотреть все заранее нереально, но навигация (спланированная заранее) сэкономит ваше время и деньги. Не придется дорабатывать эту часть в будущем. Если ваша цели – продажи, то лучше не выбирать блоговый движок (например, WordPress). Внимательно отнеситесь к выбору движка для сайта, чтобы было проще делать страницы товаров/услуг.
Понятно, что важно отличаться от конкурентов, если вы работаете в высококонкурентной среде.
Поэтому, если вы собираетесь создавать сайт или улучшать существующий, взгляните на интерфейс глазами клиента, попробуйте определить проблемы, которые могут возникнуть у посетителя при восприятии.
2. Долой длинные тексты
Пример рерайта на сайте https://bazis-remont.ru/
Вы читаете длинные тексты? Вот именно, их никто не читает. Исключения – это книги и статьи, которые человек ищет целенаправленно. А клиента, который хочет что-либо заказать, интересует определенная информация: цена, условия доставки, срок выполнения, основные характеристики продукта/содержимое услуги. Её лучше подать в краткой форме и максимально структурированной, чтобы сэкономить время клиента и расположить его к заказу. Представьте, если клиент сравнивает несколько сервисов по предоставлению услуг или сайты с определенным товаром, то, естественно, он выберет сайт с наиболее лаконичным, точным и по существу описанием.
Кроме этого, практически каждый пользуется мобильными устройствами: длинные тексты – с них не совсем удобно просматривать.
Ознакомьтесь с аудиторией вашего сайта. Задача: определить процент посетителей, использующих телефоны и планшеты (например, в Яндекс.Метрике в отчете Сводка → Тип устройства). Это позволит направить все силы на оптимизацию мобильных версий, для большей читабельности.
Возможно, не обойтись без длинного текста (https://goo.gl/RfKuGU), тогда разделяйте его на абзацы, используйте изображения, выделяйте различные смысловые блоки. Ваша цель – добиться запоминания как можно большего количества информации клиента, даже если он смотрит ваш сайт по диагонали.
3. Распространение «разговорных интерфейсов» (Conversational Interfaces)
Большинство пользователей, желающих что-либо приобрести, заходят на ваш сайт уже с набором определенных требований к товару либо услуге. Естественно, у них могут возникнуть проблемы или вопросы, мгновенное решение, которое поможет быстрее определиться с выбором товара в вашу пользу. Это значит, что, зайдя на сайт, клиент сразу будет искать номер телефона или форму обратной связи, чтобы получить ответ на интересующие вопросы, не тратя время на поиск и прочтение информации. Поэтому речь пойдет о сервисах, обеспечивающих взаимодействие с клиентом, – это всевозможные формы, онлайн-чаты, мини-приложения и т.д. Данные функции лучше размещать в первом экране, чтобы уменьшить время их поиска.
Применяйте callback-системы для общения с клиентом, при этом используйте их с умом, не раздражая посетителей неожиданно всплывающими окнами на весь экран. Пример:
Достаточно ненавязчивой ссылки на чат в шапке сайта или внизу страницы. Не используйте консультантов-роботов, они раздражаю посетителей, так как не способны решить все проблемы с клиентом. Роботы не знакомы с многообразием услуг и товаров, продаваемых вашей компанией, они не знаю тех нюансов и мелочей, касающихся каждого отдельно взятого продукта. Этим вы обманываете людей, надеющихся на решение своей проблемы. У ваших посетителей появляется негативный опыт взаимодействия. «Avito-помощник» уже давно вызывает негодование у посетителей сайта:
4. 3D-модели стаут популярнее
Использование 3D-моделей уместно для сайтов по продажам недвижимости, мебели и техники. К сожалению, эти модели не особо популярны среди людей, занимающихся бизнесом в этих сферах, хотя в данном случае их применение просто необходимо. Каждому клиенту важно видеть наглядно то, что он покупает. Удачный пример для понимания – это квартира в строящемся доме. Данный объект еще может не существовать, а 3D-моделирование даст необходимые представления о будущей покупке. Понять чертеж или текст намного тяжелее, чем увидеть все своими глазами.
Кроме этого 3D-визуализация делает сайт презентабельней и надёжней в глазах покупателя. Сайты, использующие такие модели, хорошо запоминаются и надолго остаются в памяти. Например, посмотрите, как удобно представлены квартиры на сайте компании «Горстрой».
5. Анимирование микровзаимодействий
Каждый клик по кнопке, ссылке и т.д. – это микровзаимодействия. Следовательно, если сделать их анимирование на вашем сайте, то это даст ощущение контроля при выполнении этих операций и сделает интерфейс интереснее.
За поведение покупателя на сайте отвечает большое количество взаимодействий. Если удачно и понятно их представить, то это обязательно сделает лучше юзабилити сайта. Например, хорошо представлено анимирование микровзаимодействий на сайте нашего клиента.
Также необходимо разумно использовать анимацию на сайте. Она не должна быть медленной. Необходимо сделать ее предельно аккуратной и быстрой. В качестве примеров наиболее часто используемых микровзаимодействий, которые 100% помогут вашим пользователям быстрее определиться с покупкой, можно привести следующие: увеличение изображения, если по нему кликнуть, появление всплывающего окна, оповещающего о том, что товар добавлен в корзину, индикаторы прогресса – наглядные сигналы ожидания результатов, изменение цвета кнопок и ссылок после нажатия.
6. Использование синемаграфий или «живых» изображений
Синемаграфии – изображения с движущимся одним элементом. Они уже начинают вытеснять высококачественные видео. Лучшим вариантом размещения, чтобы привлечь внимание клиентов, является размещение на первом экране. Также пользователь оценит оригинальность данного эффекта.
Если такая гифка будет соответствовать тематике сайта, то это добавит еще больше крутости вашему сайту. К примеру, вы можете использовать синемаграфии основных продуктов на баннерах с акциями либо на главной странице.
В России синемаграфию в основном используют в соц. сетях, поэтому приводим примеры иностранных сайтов – сайт защиты воды и аренды автомобилей.
7. Типичные стоковые картинки уже не в моде.
Согласитесь, уже надоели всевозможные изображения человечков, фотографии улыбающихся семей и картинки девушек в наушниках. При том, что существуют ресурсы (https://pixabay.com/) с огромным количеством бесплатных прикольных и интересных картинок, но их, к сожалению, используют не часто, а зря. Типичные стоковые картинки представлены ниже:
Важно отметить, что, если вы ищете изображения товаров, представленных на сайте, необходимо использовать только реальные фотографии. Лучше сделайте их сами, если, конечно, товар имеется в наличии и есть что фотографировать. При отсутствии такой возможности, используйте фото с сайта производителя продукта, убедившись заранее в его качестве, потому что каждый клиент хочет получить именно то, что заказал, не стоит пытаться его обмануть, вы рискуете потерять хорошую репутацию. Также это касается изображений сотрудников и рабочего процесса. Не размещайте фото чужих людей. В наше время не сложно сделать снимки отличного качества используя камеру обычного мобильного телефона.
Также есть тренды, появившиеся уже давно, но они не теряют актуальности и в 2017 году. Поговорим о них отдельно.
8. Материальный дизайн (Material Design)
Такой дизайн был презентован компанией Google еще в 2014 году. Основной «фишкой» материального дизайна является использование глубины и тени для показа активных объектов. Это значит, что создается некоторая подсказка в виде объема. Стоит отметить, что применение анимации для выделения функциональных элементов также играет не самую последнюю роль (смотрите пункт 5). И, если в плоском дизайне основная цель была – это показать элементы как можно проще, то материальный дизайн ставит перед собой задачу показать их еще и понятно.
Чтобы понять, как правильно использовать принципы материально дизайна на вашем сайте, рекомендуем ознакомиться с официальным документом от Google. Примеры – сайт онлайн-университета «Нетология» и мобильного банка «Тинькофф».
9. Мобильные устройства в первую очередь (Mobile First)
Ранее уже говорилось о важности адаптации сайта под мобильные устройства. На эту тему написано много статей и книг. Удачным примером является книга Люка Вроблески «Сначала мобильные»
Как известно, мобильный трафик растет и даже есть пользователи, у которых нет опыта работы с настольными компьютерами. Поэтому оптимизация мобильных версий должна стать приоритетом в разработке вашего сайта.
Таким образом, в статье представлены только основные направления веб-дизайна. Посмотрим, что нас ожидает еще впереди, ведь до конца года еще немало времени. Если данная статья натолкнула вас на мысли о том, что дизайн вашего сайта уже не актуален или прочитали статью и нашли устаревшие элементы – специально для вас у нас имеется услуга редизайн. Помните, что удобная организация сайта – это путь к успешному бизнесу.
Если хотите сделать свой сайт лучше, получите консультацию от наших UX-специалистов — они проанализируют ваш ресурс и подскажут, с чего начать путь к продажам.
