Внешний вид блога

Настраиваем внешний вид блога

В прошлый раз мы рассматривали системы управления сайтом. Какие они бывают и чем отличаются друг от друга. Теперь у вас есть платформа для создания блога в виде «сырой» cms. Пришло время заняться настройкой.

Вариантов оформления блога – бесчисленное множество. И как говорится «на вкус и цвет товарищей нет». Поэтому сегодня вы не получите четких инструкций по тому, как должен выглядеть блог. Вместо этого вы получите чек-лист, который поможет в выборе и настройке темы.
Кстати выбрать и купить тему можно вот тут.

Идентификация бренда. Цвета

Блог должен ассоциироваться с вашим брендом. Чтобы ассоциация возникла в голове у читателя, нужно позаботиться о том, чтобы дизайн был построен на базе ваших фирменных цветов. Подавляющее большинство тем даёт редактировать цвета по умолчанию, но перед покупкой лучше в этом удостовериться.

Адаптивность

Доля мобильного трафика растет из года в год. Можно конечно возразить что-то вроде:

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

И пару-тройку лет назад это могло прокатить в качестве причины не думать про адаптивность. Но эти времена прошли. Плохо это или хорошо, но трафик уже никогда не вернётся на большие экраны. Перемещение всех сфер жизни в сторону мобайл нельзя не замечать.

Поэтому выбирая тему для своего блога проверьте её на адаптивность. Сделать это можно используя лишь окно своего браузера. Просто откройте демо страницу темы и нажмите кнопку «свернуть в окно». Сожмите окно до ширины в ⅕ — ⅙ экрана и посмотрите как на таком размере экрана ведёт себя вёрстка.

Проверка вёрстки на адаптивность
Проверка вёрстки на адаптивность

P.S. Когда вы уже развернёте блог и настроите тему, удостоверьтесь что гугл тоже считает ваш блог адаптивным. Для того воспользуйтесь вот этой ссылкой. Дело в том, что файлы, отвечающие за стили могут быть заблокированы файлом robots.txt. Если такое произойдёт, то вы будете видеть красивый адаптивный сайт, а гугл увидит белый лист с чёрным текстом близким к краям макета. Посмотрев на такую верстку, он признает сайт не адаптированным под мобильные устройства. А это в свою очередь чревато пессимизацией сайта в поисковой выдаче.

Шрифты и типографика

Представьте ситуацию: вам скидывают ссылку и вы открываете её со своего смартфона. По заголовку понятно, что эта та самая тема, которую вы искали. Но текст на странице такой мелкий, что легче себе глаза выколоть, чем прочитать его. Вы думаете «нафиг, прочитаю потом с компьютера» и успешно об этом забываете. Знакомо?

Люди будут приходить в ваш блог, чтобы потреблять контент. Не заставляйте их для этого напрягаться.

  • Используйте легко читаемые шрифты. Без курсива, подчеркивания и засечек;
Засечки. Вот они
Засечки. Вот они
  • По размеру шрифт лучше использовать от 14 до 16px. Текст с таким размером будет хорошо читаем на всех устройствах;
  • Не используйте светлый текст на тёмном фоне. Это всегда проигрышный вариант;
  • Структурируйте текстовой контент с помощью списков и деления на абзацы.

Навигация

Пользователь пришел на ваш сайт и прочитал пост. Это уже хорошо. Теперь помогите ему найти в вашем блоге и другую полезную информацию. Позаботьтесь о навигации:

  • Сделайте рубрикатор. Высасывать рубрики из пальца не нужно. Когда вы поймете что публикуемый контент имеет несколько четких направлений, тогда возьмите эти направления и на их основе придумайте рубрики;
  • Проверьте чтоб на всех страницах блога была форма поиска по сайту;
  • В конце каждого материала давайте ссылки на похожие материалы. В wordpress для этого можно использовать плагин related posts.
Вот так выглядят ссылки на похожие материалы
Вот так выглядят ссылки на похожие материалы

Призыв к действию

Ваш блог работает и приносит полезное действие. Пользователю удобно на вашем сайте и он получает на нем нужный и полезный для себя контент. Класс. А теперь подумаем наконец о выгоде для вашего бизнеса.

Call to action. Призыв к целевому действию
Call to action. Призыв к целевому действию

В боковых панелях сайта, под статьями или даже в подвале разместите Call-To-Action элемент. Кнопка или форма, которая призывает читателя совершить целевое действие. Это может быть:

  • подписка на рассылку. С её помощью вы будете в дальнейшем конвертировать подписчиков в покупателей;
  • форма заявки на расчет или консультацию. С её помощью вы получите контакты «тёплого» потенциального покупателя;
  • ссылка для перехода в интернет-магазин.

При выборе темы оформления вашего блога удостоверьтесь, что она позволяет всё выше перечисленное. Лучше потратить больше времени на выбор темы, чем потратить деньги и понять что тема вам не подходит.

Если же вы заказываете разработку темы или ваша cms предполагает только уникальный дизайн, то используйте этот чек-лист при составлении ТЗ для дизайнера и разработчика.

На следующей неделе мы вернемся к контент-стратегии и детально её разберём.
Все статьи из серии:

0.00 avg. rating (0% score) - 0 votes
Разработчик сервиса ContentPlan.pro
Записи созданы 35

Начните вводить, то что вы ищите выше и нажмите кнопку Enter для поиска. Нажмите кнопку ESC для отмены.

Вернуться наверх