Как автор блога, я каждый день вижу примеры хороших и плохих форматов. Хотя мне нравится думать, что содержание — это единственное, что привлекает людей в блог и заставляет их читать, я знаю, что макет и формат блога также играют огромную роль. Изображения, текст и ссылки должны быть правильно оптимизированы — в противном случае читатели могут отказаться от вашей записи в блоге, если она не будет привлекательной и простой или не вызовет большего интереса. Именно поэтому я собрал несколько лучших примеров формата блога, чтобы помочь вам создать идеальный блог для ваших читателей.
Советы по оформлению блога
Будучи автором и читателем блогов, я знаю, что оформление блога так же важно, как и его содержание. Оформление блога важно не только для удобства читателей, некоторые элементы также помогут вам оптимизировать блог для поиска и сделать его более доступным. Если вы хотите улучшить оформление своего блога, у меня есть несколько советов, как сделать его интересным и удобным для чтения.
1. Создавайте запоминающиеся заголовки.
Заголовок вашего блога — это первое, что видят люди. Независимо от того, пролистывают ли они результаты поиска или просматривают главную страницу вашего блога, заголовок должен быть достаточно сильным, чтобы вызвать у них интерес. Убедитесь, что название вашего блога не только интересно, но и точно описывает тему статьи. По моему опыту, обычно я придумываю не менее пяти вариантов заголовков, когда готовлю новую статью в блоге. И вот хорошая новость для тех, кто особенно многословен: Исследования показывают, что больше — лучше, когда речь идет о длине. Исследование, проведенное компанией Backlinko, показало, что наибольшее количество социальных акций получают заголовки блогов, состоящие из 14-17 слов.
2. Сделайте это наглядно.
Если вы написали длинную статью в блоге, разбейте большие куски текста изображениями, инфографикой, видео и диаграммами. Это не только визуально привлекает читателей, но и увеличивает время пребывания на странице благодаря интерактивным форматам блогов. Согласно данным Databox, среднее время пребывания на странице для записи в блоге B2B составляет 1 минуту 30 секунд. Среднее время пребывания на странице для записи в блоге B2C — одна минута и 26 секунд. Вот пример того, как это выглядит в одном из постов блога HubSpot:
Образовательный контент, например, посты, которые объясняют, почему/что, и включают различные медиа, также может стать источником обратных ссылок. Исследование контента, проведенное Backlinko и BuzzSumo, показало, что посты в блогах с инфографикой получили на 25,8 % больше ссылок, чем посты без нее. Не говоря уже о данных, подумайте, что вы предпочитаете при чтении статьи в блоге: 2 000 слов текста без визуальных пауз или длинный пост, в котором используется образовательная или интерактивная графика, помогающая рассказать историю.
3. Сделайте его доступным для просмотра.
Помимо использования сильных визуальных образов, вы также должны убедиться, что ваш блог легко читается. По моему опыту, если я не могу переварить основные тезисы одним быстрым прокручиванием, то, скорее всего, покину страницу. Вы можете улучшить формат своего блога, добавив в него больше структуры и организации. Начните с добавления оглавления или краткого резюме в верхней части поста. Затем добавьте много заголовков и подзаголовков, чтобы отделить каждый раздел или идею.
Быстрый SEO-совет: при оформлении статьи в блоге заголовок должен быть в формате H1, заголовки — в формате H2, а подзаголовки — в формате H3 и H4. Не забывайте также о интервалах и удобстве чтения. Чтобы разбить большой объем текста, добавьте много переносов между мыслями и используйте пулевые точки при перечислении.
4. Пишите длинный контент.
Если вы хотите увеличить количество постов в своем блоге, попробуйте сделать их длиннее. Брайан Дин из Backlinko обнаружил, что посты в блогах, содержащие более 1 000 слов, получают на 56 % больше акций в социальных сетях, чем контент, содержащий менее 1 000 слов.
По сути, чем больше вы пишете, тем больше информации покажется людям интересной, и они захотят поделиться ею в социальных сетях. Большее количество просмотров в социальных сетях может привести к увеличению трафика на ваш блог. Как человек, регулярно пишущий посты объемом 2 000 слов, могу сказать, что ключ к написанию длинных постов в блоге — это убедиться, что вы действительно предоставляете ценность. Посты в блоге, наполненные ценностью, более популярны и увлекательны, чем те, которые ничему не учат и ничего не дают читателю. Если вы можете поделиться чем-то оригинальным — например, собственными данными, опытом из первых рук или уникальными визуальными эффектами, — вы дадите читателю повод остаться в вашем блоге или совершить другое действие на вашем сайте. Это потому, что вы предоставляете что-то, чего они не могут найти в другом блоге.
5. Включите сильные CTA.
Частая ошибка, которую я вижу в блогах, — отсутствие призыва к действию (CTA). Вы можете написать самую интересную и информативную статью, но если вы не скажете читателю, что делать дальше, он просто уйдет. Очень важно включать CTA в каждый пост блога. CTA побуждает читателей сделать еще один шаг. Это может быть просмотр других постов, загрузка вашей последней электронной книги или подписка на вашу рассылку. В зависимости от ваших целей блог может занимать любое место в вашей маркетинговой воронке. Большинство блогов настроены на то, чтобы быть в верхней части воронки (TOFU), то есть они генерируют трафик, освещая темы, о которых люди хотят узнать. Тем не менее, я видел множество блогов, которые были созданы как мощные инструменты для генерации лидов. HubSpot, например, отлично умеет вплетать релевантные CTA в каждый пост. Как, например, в этом, призывающем читателей скачать бесплатные шаблоны:
Примеры формата блога
1. HubSpot
Блог HubSpot находит способ вместить в страницу много интересного контента, оставаясь при этом легким для глаз. Обратите внимание, что над сгибом размещена одна запись блога с большим изображением, заголовком и CTA, чтобы прочитать больше. Выделяющееся изображение уникально для бренда, с привлекательным сочетанием фотографии и графики, чтобы привлечь внимание. Справа находится список лучших постов, чтобы привлечь внимание читателей к разнообразному контенту блога. Это позволяет читателям легко связаться с HubSpot или узнать больше. Кроме того, это последовательность. При прокрутке страницы вниз каждый раздел будет визуально последовательным, независимо от того, какую тему, подкаст, видео или запись в блоге вы ищете. Эта стратегия поможет вам укрепить доверие к бренду.
2. Alloy
Когда я впервые зашел на блог Alloy, стало ясно, что формат блога был создан с учетом пожеланий пользователей. На главной странице я мог легко перейти к определенным темам с помощью тегов или воспользоваться функцией поиска, чтобы найти что-то конкретное. В отдельных статьях блога есть встроенная боковая панель, которая выполняет функцию оглавления. Эта функция улучшила мои впечатления от чтения, позволив плавно переходить к различным темам в статье.
3. Lendio
Компания Lendio, предоставляющая кредиты малому бизнесу, ведет активный блог, в котором освещает все, что нужно знать владельцам малого бизнеса о кредитах, финансах и ведении бизнеса. Одна из главных особенностей формата блога — использование релевантных CTA. В приведенном ниже примере записи в блоге Lendio интегрировала свой кредитный калькулятор для бизнеса в статью о получении кредита для бизнеса.
Калькулятор не только является интерактивным способом привлечения читателей, но и обеспечивает ценность и демонстрирует, что может предложить Lendio.
4. Pluralsight
Pluralsight — это отличное напоминание о том, что не обязательно использовать супермодный формат блога. Чистые шрифты, например, сочетаются с логотипом и соответствуют четкому, информативному голосу бренда. Структура сетки и заголовки для каждого раздела позволяют легко понять, о чем идет речь в блоге. Мне также нравится список тематических фильтров, который позволяет легко находить записи в блогах, которые вам интересно читать.
5. Pando
Важным аспектом хорошо оформленного блога является единая цветовая схема и стиль. В конце концов, 80 % потребителей утверждают, что цвет повышает узнаваемость бренда. Интересно наблюдать, как единство цвета может объединить самые разнообразные элементы дизайна. Pando, блог, посвященный циклу стартапов, использует палитру цветов — оранжевый, зеленый, бледно-голубой, лавандовый и темно-желтый — в нескольких разделах своего сайта. Эти цвета используются для фона, полос выделения и некоторых областей текста. Однако в нем также используется несколько разных шрифтов — все они смотрятся органично, если их объединить целостной цветовой гаммой.
6. Творческий круг
Если вы ищете формат блога, который увеличивает время пребывания на странице, то это функция оценки времени чтения. Каждый раз, когда я вижу в верхней части сообщения примерное время — в данном примере статья займет шесть минут — я могу принять решение, стоит ли продолжать чтение. Это также говорит о том, какой объем контента и информации я могу ожидать; более длительное чтение означает, что пост углубленно изучает тему. Добавив это в макет вашего блога, вы сможете улучшить впечатления читателей и увеличить время пребывания на странице. Хотя некоторые люди могут отсеяться, увидев это, читатели, которые останутся, помогут увеличить среднее время пребывания на странице. Кроме того, вы можете использовать эту метрику как индикатор интереса людей к теме.
7. Bit.ly
Я являюсь поклонником формата блога Bitly по нескольким причинам. Прежде всего, оранжевый акцентный цвет, используемый в изображениях, демонстрирует целостный брендинг. Этот мотив связывает воедино все записи блога на главной странице и показывает мне, что они серьезно относятся к своему блогу. Во-вторых, мне нравится, что компания органично интегрировала CTA-блок на главной странице блога. Это не только умный способ сразу генерировать лиды, но и помогает читателям понять, чем вы занимаетесь. Часто, когда я натыкаюсь на блог компании, увидев одну из ее статей в результатах поиска, я ухожу, не понимая, чем она занимается.
8. Golde
Мне нравится, как Голде использует изображения для эффективного общения. Используя название бренда в качестве отправной точки для своего блога «The Golden Hour», Golde делает главной темой каждого поста изображение. Увлекательные изображения, демонстрирующие продукт бренда, — отличный способ повысить посещаемость блога. В великолепных фотографиях используются желтые и зеленые тона. Это создает устойчивое, теплое и привлекательное ощущение, которое притягивает вас к каждой записи в блоге. Как только вы нажмете на сообщение, этот блог прекрасно использует пространство под текстом для выделения продуктов, рецептов и других полезных ресурсов.
Вдохновляющие примеры красивого дизайна домашней страницы блога
1. Help Scout
Иногда лучшие дизайны блогов — самые простые. Компания Help Scout, создающая программное обеспечение для обслуживания клиентов, использует в своем блоге уникальный, но минималистичный дизайн, который нам очень нравится — он ограничивает количество копий и визуальных элементов и использует негативное пространство. Что нам особенно нравится в этом блоге, так это использование тематических изображений для всех записей, включая раздел «Самые последние записи», в котором выделяются последние или особенно популярные записи. Эти изображения привлекают внимание читателя и дают понять, о чем будет пост. И это работает — все в дизайне этого блога чистое и читабельное.
2. Microsoft Work & Life
Полное раскрытие информации: мы уже восхищались микросайтами Microsoft. Ничего не поделаешь — что может быть лучше для оживления старого бренда, чем блог, который может похвастаться красивым, интерактивным и вдохновляющим фирменным контентом? Microsoft Work & Life — яркий пример того, как бизнес-блог может стать важным подспорьем для общего ребрендинга. В последние годы Microsoft работала над гуманизацией своего бренда, в основном в ответ на соперничество с Apple. Микросайт «Работа и жизнь» имеет простой лозунг: «Узнайте, как мы помогаем людям оставаться на связи, быть вовлеченными и продуктивными — на работе, в школе, дома и в игре». Это, так сказать, более мягкая сторона Microsoft. Когда вы пытаетесь донести определенную идею бренда, вы можете использовать свой блог для ее передачи — как с эстетической, так и с содержательной точки зрения.
3. Design Milk
Design Milk, онлайн-магазин современного дизайна, использует простой макет блога, чтобы выделить свои записи. Если стрелка рядом с надписью «Читать» в левом верхнем углу направлена вниз, вы можете пролистать изображения и тизеры для различных статей. Если стрелка рядом с надписью «Читать» направлена вверх, вы увидите идеальную витрину тем блога и выделенных записей. Это стратегия внутренних ссылок, которая помогает стимулировать читателей оставаться на сайте дольше. Социальные иконки в верхней части каждого поста — приятное дополнение к общему виду и атмосфере сайта. Их легко заметить, и они позволяют легко делиться контентом Design Milk.
4. Веб-дизайнер Depot
С таким названием, как «Webdesigner Depot», неудивительно, что этот сайт новостей дизайна визуально привлекателен. Особенно нам нравятся отзывчивые изображения в каждом отдельном посте. Едва уловимое движение изображения при прокрутке статей помогает привлечь внимание посетителей, что может повысить коэффициент кликабельности вашего блога. Обратите внимание на эффективное использование главного изображения для выделения самой последней статьи. Такой подход сразу же привлекает зрителя к последним материалам блога. Более того, цветовая схема, фон и шрифты выдержаны в едином стиле, что позволяет блогу выглядеть профессионально, но при этом отличаться от привычных шаблонов.
5. Mashable
Mashable разбивает свой контент на три заметных раздела на главной странице:
- Новые посты привлекают внимание благодаря большому главному изображению и трем выделенным блокам.
- Посты для каждого раздела привлекают внимание с помощью главного изображения в верхней части двух-трех колонок с кратким списком заголовков под ним.
- Справа отображаются посты «Trending» с жирным текстом поверх графики в виде теневого поля.
Такой многосторонний подход к отображению контента поможет читателям решить, какие новости для них важнее всего. Они могут быстро выбрать между привлекающими внимание топ-рассказами, самыми горячими сообщениями или рассказами на наиболее интересующую их тему. «Связанные истории», которыми завершается каждое сообщение, также являются отличной функцией, позволяющей связать читателей с другими материалами, которые они ищут.
6. Brit + Co
Все на главной странице Brit + Co говорит о чистоте, тепле и гостеприимстве. На ней нет беспорядка, что делает контент более удобным для восприятия, а макет блога чрезвычайно организован. Нам нравится и сезонность сайта — от фонариков из авокадо на первое октября до рецептов ужина на День святого Валентина. Они восхитительны и изобилуют красочными, веселыми фотографиями, иллюстрирующими содержание каждой истории. Тонкий заголовок «Истории этой недели» также служит прекрасным способом продвижения популярного контента, не выпячивая его на первый план. К тому же, благодаря таким замечательным визуальным эффектам, мы обратили внимание на значок Pinterest. Этот значок важно включить, когда в вашем блоге так много привлекательных изображений.
7. Food Love Stories
Нам нравится красочный, последовательный дизайн Food Love Stories от британской продуктовой сети Tesco. Помните, как мы постоянно твердим о последовательности бренда? Посмотрите, как этот бренд естественно включает логотип в свои фотографии и видеоролики. Tesco удалось добиться отличного баланса простоты и смелости. Макет минимален, но не скучен. Теплые и приветливые оттенки подчеркивают каждый выделенный контент и рецепт, а фотографии добавляют цвет по всему сайту. Это отличный пример того, как с помощью правильных изображений можно добиться привлекательного вида «меньше — значит больше», особенно если это соответствует общей концепции бренда.
8. 500px
Блог о фотографии 500px содержит одну тематическую статью и большие, жирные фотографии высокой четкости, чтобы привлечь читателя. Таким образом, становится ясно, о чем этот блог — он делится ценным контентом о фотографии в сочетании с захватывающими визуальными эффектами. Кроме того, как здорово, что социальные ссылки находятся прямо здесь, очевидно отображаясь над сгибом. Они удерживают читателей на контенте и позволяют легко делиться фотографиями. Кроме того, контент с изображениями получает более чем в два раза больше пользователей на Facebook, чем посты без изображений.
9. Wired
Чем больше тем в вашем блоге, тем более хаотичным может быть его восприятие читателями. Именно поэтому нам нравится освежающая простота дизайна блога Wired. В зависимости от размера вашего экрана, только над сгибом может быть восемь или более заголовков, но такой дизайн все равно легко отсканировать и вникнуть в суть. Каждое сообщение включает в себя главное изображение, чтобы привлечь внимание. Яркие шрифты позволяют быстро понять категорию, автора и заголовок каждого поста с первого взгляда. Если ваш блог начинался просто и вам трудно заставить его работать по мере роста, этот блог предлагает отличное вдохновение для редизайна. Вы также можете использовать эту рабочую тетрадь для редизайна сайта вашего блога.
10. Crayon
Многие блоги хотят показать читателям понемногу всего, что они предлагают. Но глубина может быть так же привлекательна для читателей, как и широта. Если вы хотите, чтобы ваши посетители погрузились в то, что говорят авторы вашего блога, этот дизайн блога предоставляет им легкий выбор — просто начните читать. С расширенным тизером в заголовке блог Crayon фокусируется на последней записи. Прокручивая страницу вниз, вы найдете сетку с другими материалами блога. Мне также нравится цветовое кодирование по темам, которое позволяет легко находить интересующие блоги с первого взгляда.
11. Black Travelbox
Black Travelbox производит средства личной гигиены для путешествий. Компания проделала огромную работу, чтобы соединить свои портативные бальзамы, кондиционеры и многое другое с радостью путешествий. Кроме того, ребята из блога «Travel and Slay» этой компании знают толк в согласованности бренда на разных каналах. Блог имеет простую цветовую схему и сочетающиеся шрифты, чтобы создать единый пользовательский опыт от магазина до общего контента. В то же время, чтобы привлечь внимание читателей, в блоге используются смелые, красочные изображения. Зайдите на сайт и пролистайте его — мы думаем, что это очень здорово, что изображения меняются, но каждая запись в блоге посвящена разным «увлечениям путешественников». И каждый пост наполнен яркими фотографиями, умными интервью и радостными историями.
12. Pixelgrade
Pixelgrade — это дизайн-студия, которая создает потрясающие темы WordPress для творческих людей и малого бизнеса. Формат их блога отлично подходит для выделения одной из самых последних или популярных записей, а также четкого CTA и короткого отрывка. Больше всего мне нравится то, что дизайн страницы на 100% соответствует их бренду. Если вам нравится дизайн их блога, скорее всего, вы также захотите попробовать одну из их умных и красиво оформленных тем WordPress.
13. BarkPost
Мы в HubSpot очень любим собак. Поэтому, когда на нашем радаре появился блог, посвященный жизни владельца собаки, он привлек наше внимание. BarkPost, блог компании BarkBox, занимающейся продажей коробок для собак, — отличный пример дизайна по многим причинам. Во-первых, посмотрите на крупный, веселый шрифт в каждом заголовке — он быстро и легко читается даже с мобильного устройства. Восхитительные изображения делают заметными посты по каждой теме — и, конечно же, все в фирменном, вызывающем доверие синем цвете. Нам также нравится, что BarkPost привлекает внимание к своим родственным компаниям. Если вас интересует уход за зубами собаки или лучший корм для вашего питомца, этот забавный дизайн блога позволит родителям и любителям собак легко найти последние новости и ресурсы.
14. Goodwill
Кто сказал, что некоммерческие организации не могут вести блоги? Нет, они должны. Ознакомьтесь с этим руководством по маркетингу некоммерческих организаций, чтобы сделать свой блог отличным. В этом примере чистая, красочная навигация Goodwill (опять же — вызывающий доверие синий цвет) привлекает читателя к важным элементам этого блога. Посты также аккуратно расположены и легко доступны для читателей. Посетители могут выбрать ту информацию, которая им наиболее важна, выбрав тему с помощью простых кнопок на графике над сгибом. Наконец, нам нравится акцент на личных историях в блоге Goodwill. В этом дизайне есть длинные тизеры, которые знакомят читателей с программами этой организации. Такой подход позволяет легко узнать, почему так много людей решили поддержать Goodwill.
15. Springly
Поезд некоммерческих блогов продолжает свой путь — компания Springly, которая отлично использует формат блога в редакционном стиле, выделяя популярные записи в блоге и включая боковую панель, которая предлагает CTA для подписки на рассылку новостей по электронной почте компании. Этот блог имеет упрощенный дизайн с лаконичным текстом и четкой цветовой палитрой для некоммерческих организаций, которые ищут полезные ресурсы. На карточке каждой статьи указаны имя и фамилия автора и его фотография, что позволяет привлечь внимание к ее авторам. Учет времени и людей на первом плане соответствует тому, на чем сосредоточено внимание большинства некоммерческих организаций. Такой подход делает блог более ценным для тех, кто, скорее всего, будет вносить свой вклад и использовать его.
Используйте эти примеры дизайна блога, чтобы создать свой лучший блог
Создать красивый блог — это не только внешний вид. Если вы хотите, чтобы ваши читатели действительно влюбились, дизайн вашего блога должен соответствовать потребностям и ожиданиям ваших пользователей. Что для них наиболее важно? И что ваш блог может предложить такого, чего нет ни у кого другого? Не просто просмотрите эти вдохновляющие дизайны блогов. Используйте их как трамплин, чтобы представить, как ваш блог может быть связан с вашей аудиторией и улучшить дизайн блога. А затем наблюдайте, как растет число ваших читателей.