11 примеров карточного дизайна корпоративных блогов
В этой статье рассматриваются преимущества современного дизайна корпоративного блога с карточным интерфейсом. Контент необычайно важен при проведении маркетинговой кампании, поэтому корпоративному блогу часто отводят ключевую роль. Хорошо оформленный блог компании, в любом случае послужит фундаментом и дело не только в динамическом контенте или наборе SEO характеристик. User eXperience сегодня главная составляющая успеха в Сети. Современные пользовательские ожидания предполагают использование связно сгруппированных материалов, лаконично представляющих суть дела.
Грамотно выбранный стиль оформления блога оставит нужное впечатление от всего веб-ресурса и самой компании. Сегодня актуально создавать ориентированный на посетителя дизайн сайта или блога, когда в центре внимания пользовательский интерфейс. Карточный дизайн с успехом применяется в разнотематических порталах и деловой нише – почти плоский Metro стиль, блоки и плитки хорошо упорядочивают информацию. Замечено, что дизайн с карточками увеличивает глубину просмотра премиум-контента на сайте компании.
Применение карточек в дизайне сайта может быть как эффективным, так самым неудачным. Далее, 10 примеров хорошего оформления корпоративных блогов с описаниями выигрышной сути карточного стиля.
1. Help Scout
Пример 3-х колоночного корпоративного блога с броским дизайном в плоском стиле.
Flat-иллюстрации ярко представляют материалы блога. При структуре дизайна с 3 колонками максимально охватывается взглядом прокручиваемый контент. Крупные карточки не отвлекают, а наоборот усиливают эффектность мультяшных картинок. Разметка постов тут дает текстам «дышать» и премиум контент не выглядит агрессивной рекламой.
2. Sprout Social
Тип лейаута можно назвать комбинированным с карточками «по всей ширине». Такое оформление вытесняет другие блоки, но им не приходится конкурировать за пользовательское внимание.
Разметка блога побуждает к скроллу или свайпу (сдвигу пальцем), но заголовки при этом остаются в центре внимания. Достаточно мягкий зеленый оттенок делает интерфейс приятным, а призывы к действию максимально заметными. Иерархия шрифтов и чистый дизайн позволяют скользить взглядом по странице поста, легко усваивать содержимое. Для шрифтов используется темный, но не полностью черный цвет, что улучшает читабельность.
3. Sigstr
Компания разрабатывающая электронные подписи применяет карточный стиль дизайна для кейсов и блога. Двух-колоночная структура упрощает усвоение контента и позволяет избежать переизбытка месседжей на одном экране страницы. Для CTA, UI и заголовков, эффективно используются контрасты белого цвета на фоне зеленой шапки.
Использование разъясняющих изображений, выражающих или дополняющих смысл заголовка, побуждает к прокрутке с целью ознакомления. Чего недостает, так это длины анонсов статей. Их хорошая читабельность объясняется правильно подобранной высотой строки. Растянутые строки создадут напряженность при чтении, слишком сжатые приведут к неразборчивости текcта в слитных кусках абзацев. Так, визуальная привлекательность высоты текстовых строк удерживает пользовательское внимание.
4. InVision
В оформлении корпоративного блога компании можно рассмотреть немало интересных деталей. Большой плюс дает составление описательных заголовков, избавляющих от необходимости вывода анонсов. Это удачно обыграно с использованием широкоформатного слайдера.
Три-колонки и свободное пространство вокруг карточек – отличный способ обратить внимание посетителя сайта компании на блоговые статьи. Оригинальное решение в дизайне постов: при прокрутке всплывающая снизу панель с социальными кнопками и основным CTA-призывом.
5. Buffer App
В корпоративном блоге американской компании разработавшей сервис постинга в соцсетях, насчитывается более 900 разнотематичных статей.
Разнообразие в применении дизайн-элементов помогает адаптировать контент для задач. Под блоговые посты заведено два типа лейаута: ориентированный на статьи-советы и использующий разметку в магазинном стиле с полноэкранным фотобэкграундом (под ТОПовые записи).
6. Chase
На сайте американского банка, корпоративный блог сделан как надо – дизайн лаконичный и согласованный.
Под блог отведена отдельная секция на главной странице, поскольку банку важно компактно проинформировать клиентов о своих плюсах. Ради этого применяется карточный дизайн с фиксированным хедером и выдвигающейся панелью меню. Многоуровневая навигация с 6-ю фильтрами помогает сориентироваться, а оригинальная и стильная графика в постах – увлечь посетителя.
7. Draft
Сайт японской компании по дизайну интерьера: популярная сейчас нестандартная разметка предусматривает пересечение контент-блоков и текстов с карточками.
Веб-страницы оформлены в стиле самых модных современных трендов и привлекают микро-итерациями с эффектными переходами. Дизайн блога в виде карточек.
8. Marketo
Современный стильный блог компании по автоматизации маркетинга.
Блог оформлен в сиреневых тонах с блоками по 9 карточек, широкоформатными превью и заголовками на полупрозрачных подложках. Превью-картинки украшены эффектами осветления, боке, наложения сиреневого фильтра, двойной экспозиции.
9. Hootsuite
Компания занимающаяся маркетингом в социальных сетях, стильно и оригинально использует карточный дизайн для корпоративного блога. Интересный пример, даже среди лучших блогов.
В постах они делятся нематериальными ценностями, которые трудно выразить словами. И тут, как нельзя кстати, применяются карточки. Карточный интерфейс – это прежде всего понятность и доступность. Расширяя горизонты социальных медиа, делая углубленные оценки при больших объемах, блог компании просто нуждается в эффективном UI. Демонстрируя минималистичный, эстетически привлекательный дизайн, Hootsuite применяет карточки и внутри постов, объединяя фото или видео с социальными иконками, значками и CTA-призывом.
10. Etsy
Etsy предлагает аж 8 уникальных блогов для привлечения внимания глобальной аудитории. От рассказа про пряничный домик, до шоппинг-историй или руководства онлайн-покупателя — понемногу каждому.
Типично, посты Etsy имеют высокий уровень вовлеченности, некоторые с сотнями комментариев. Компания регулярно пополняет блог соблазнительными фотографиями и арт-произведениями. Неудивительно, что визуальное оформление тут на высоте.
11. Slack
Slack – корпоративный мессенджер, альтернатива Skype и внутри-корпоративной электронной почте. Запоминается эффектным плоским дизайном, флэт-графикой и иллюстрациями. Блог компании на отдельном домене. Красиво сочетая плитки с карточками / плоский и материальный стиль дизайна / анимацию и hover-эффекты, корпоративный блог не выглядит скучным.