Лучшие статьи и кейсы стартапов
Включить уведомления
Дадим сигнал, когда появится
что-то суперстоящее.
Спасибо, не надо
Вопросы Проекты Вакансии
Студия мобильной и веб-разработки
Рекомендуем
Продвинуть свой проект
Лучшие проекты за неделю
32
Битрикс24

Битрикс24

www.bitrix24.ru

23
Отследить-посылку

Отследить-посылку

отследить-посылку.рф

13
WebResidentTeam

WebResidentTeam

webresident.agency

13
Логомашина

Логомашина

logomachine.ru

12
Devicerra

Devicerra

devicerra.com

12
Perezvoni.com

Perezvoni.com

perezvoni.com

11
Expresso

Expresso

www.expresso.today

11
Reader

Reader

Интернет-журнал о современных технологиях.

9
ADN Digital Studio

ADN Digital Studio

adn.agency

9
Aword

Aword

Приложение для изучения английских слов

Показать следующие
Рейтинг проектов
Подписывайтесь на Спарк в Facebook

7 трендов дизайна для корпоративных сайтов

728 0 В избранное Сохранено
Авторизуйтесь
Вход с паролем
Прошло то время, когда сайт компании был скучным и однообразным, а интернет-магазин был похож на простой перечень товаров с кнопкой «Купить» возле каждого из них.

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

Эксперты маркетинговой платформы HubSpot выделяют 7 ключевых трендов в дизайне сайтов для В2В- и В2С-компаний.

1. Типографика и шрифты

b_53e1ef7d28bf6.jpg
Как правило, компании в своих полиграфических материалах и печатной продукции (включая документы) используют единый шрифт и определенный набор стилей и верстки, прописанный в брендбуке. За прошедшие лет пять в состав брендбуков вошли и стили для сайтов и корпоративных блогов. Среди наиболее узнаваемых — конечно же, шрифты СМИ и периодических изданий: достаточно взглянуть на знаменитые «Нью-Йорк Таймс» или «Нью-Йоркер». Рекламодатели и читатели всегда узнают эти заголовки и верстку среди остальных сайтов и онлайн-СМИ.

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

2. Использование плоского дизайна

b_53e1efc5680cf.jpg
Тренд на использование такого дизайна на сайтах начался еще в 2013 году. Дизайнеры начали отказываться от объемных текстур, использовать крупные шрифты и яркие цвета в оформлении страниц. Причина для этого проста: так пользователя ничто не отвлекает от контента.

В чем польза плоского дизайна: Фокусирование внимания на контенте, что особенно ценно для интернет-СМИ, информационных и фото-блогов. Ускорение загрузки страниц и сокращение времени на обновление кэша, получение отклика от серверов и удобство навигации по сайту.

3. Hover-эффекты

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

Польза от «всплывающих» эффектов: Альтернативный инструмент дизайна и способ сделать его визуально понятным и удобным в использовании.

4. Динамический скроллинг

b_53e1f04b2187b.jpg
Этот механизм позволяет в результате клика по ссылке на странице перейти на определенную часть страницы или блок на сайте. Так упрощается навигация между основными массивами информации. По каждой ссылке вы переходите к той части информации, которая вас интересует в настоящий момент (альтернативный вариант — вы медленно прокручиваете всю страницу сверху вниз, постепенно просматривая опубликованный на ней контент).

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

5. Крупные фотоснимки

b_53e1f2a665606.jpg
Один из ключевых трендов в оформлении интернет-магазинов — это использование крупных фотоснимков, которые позволяют рассмотреть покупаемый продукт в деталях, «повращать» его и привлечь внимание к происходящему на сайте.

Крупные изображения лучше всего смотрятся при использовании на сайте адаптивной верстки (но на этом мы остановимся отдельно).

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

6. Размещение подробных видеообзоров

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

В чем практическая польза видеообзоров: Как сообщает журнал Inc., 92% покупателей в сегменте B2B регулярно просматривают видео в Сети, 43% B2B-клиентов смотрят видеообзоры и ролики с рекламой продукта в процессе выбора. Как видим, не только В2С-товары интереснее для покупателя, когда в дополнение к фотоснимкам есть и видео. Кроме обзоров, в видеоформате могут быть представлены и практические руководства пользователя.

7. Адаптивный дизайн

Крупные изображения, видео, типографика — всё это стоит применять в сочетании с адаптивной версткой, чтобы достигалось одинаковое удобство при просмотре контента и в настольной, и в мобильной версии сайта на различных устройствах.

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

Если хотите разработать интернет-магазин своей компании, отвечающий всем перечисленным выше трендам, обращайтесь: amelnik@componentix.com. Мы используем CMS собственной разработки с возможностью подключения к ней плагинов и модулей по желанию заказчика.
+1
Добавить в избранное Сохранено
Авторизуйтесь
Вход с паролем
Комментариев еще не оставлено
Выбрать файл
Читайте далее
Загружаем…
Блог проекта
Расскажите историю о создании или развитии проекта, поиске команды, проблемах и решениях
Написать
Личный блог
Продвигайте свои услуги или личный бренд через интересные кейсы и статьи
Написать