Категории: Веб-дизайн

5 шагов по упрощению дизайна блога

Хотите простой дизайн для своего блога? Хотите чтобы он был элегантный и привлекательный?

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

И вы не должны быть гуру дизайна или работать в Apple, чтобы осуществить это!

Эти шаги проще, чем вы думаете. Те, кто не любят простоту могут спросить: зачем это мне?

Вот три убедительных причины, которые могут работать на многих блогах:

  1. Ваш блог будет проще для чтения и навигации, и посетители это оценят.
  2. Простота означает сильный брендинг. Как чистый офис, простой блог дает посетителям хорошее впечатление о вас и может привести к новых подписчиков, клиентов или посетителей.
  3. Ваш блог просто станет круче =)

Убедились, что простой дизайн лучше для вашего блога? Отлично. Тогда давайте начнем.

1. Располагайте контент спереди и по центру

Контент расположенный в центре имеет больший приоритет.

Следуйте правилу 80/20. 20% материала на странице составляет 80% важности информации. Зачем посетители приходят на ваш блог? Что вы хотите достичь? Вы хотите заставить посетителей читать и подписываться на блог, купить продукт или приобрести на услугу?

Важные элементы должны составлять 20%, а все остальное 80%. Разместим эти 20% в центре; дадим ему приоритетное размещение, и сделаем его видимым на каждой странице, потому что это самое главное.

Итак, как сделать контент важным? Вы можете делать это в любом количестве и способами, в зависимости от того, что подходит для вашего блога. Вот некоторые способы:

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

Затем удалите как можно больше из 80% (т. е. несущественные элементы).

Как? Следующие четыре шага помогут Вам.

2. Избавьтесь от ненужных элементов

Возьмите только важные элементы вашего поста и избавитесь от остальных.

  • Размещен ли контент на время? Удалите даты.
  • Вы единственный автор блога? Удалите подписи.
  • Большинство ваших посетителей приходят из одного или двух социальных источников (например, Twitter и Facebook)? Тогда сохраните эти значки и удалите другие.
  • Не хотите получать какие-либо комментарии? Тогда не надо писать «Комментарии закрыты».

При беглом просмотре, ваш блог будет легче читаться.  Также возрастает вероятность ретвита или лайка сообщения (т.к. акцент непроизвольно идет на 2 кнопки).

Подумайте об этом: когда в последний раз, вы нажали на один из тех десяти социальных значков, которые стоят у Вас в блоге? Разве не проще когда есть только одна кнопка «Retweet»?

3. Избавьтесь от ненужных элементов сайдбара

Чем больше материала, находится в боковой панели, тем больше вероятность того, что посетители будут отвлекаться от основного содержания (важные 20%). Сайдбар должен быть максимально ненавязчивым.

Удалить все некритичные виджеты и элементы, например:

  • Владелец и мета-информация
  • Ссылки
  • Последние сообщения
  • Лучшие комментарии
  • Последние твиты

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

4. Сократите высоту заголовка

В фокусе окажется больше контента за счет сокращения высоты заголовка.

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

Несколько простых способов сократить высоту заголовка:

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

5. Уменьшить количество цветов

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

Вот одна из возможных схем три цвета:

  • Фон: белый
  • Первичный (логотип, ссылки, призыв к действию кнопки): синий
  • Вторичные (иконки, подсветка): зеленый

Если вы сомневаетесь, используйте меньше цветов.

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

Обратите внимание, как Apple придерживается только белого и серебряного. Это может показаться скучным, но это стильный, простой и привлекательный дизайн для большинства людей.

Обобщение 5 шагов

Простота это искусство, и эти пять шагов это только начало. Это легко. Измените 20% в блоге, и вы прошли 80% пути к более простому дизайну:

  1. Располагайте контент спереди и по центру
  2. Избавьтесь от ненужных элементов в ваших сообщениях.
  3. Избавьтесь от ненужных элементов боковой панели.
  4. Сократите высоту заголовка.
  5. Уменьшите количество цветов.

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

Поделиться

Посмотреть комментарии

  • Конечный вариант похож на мой бложек :oops:
    Хотя у меня всё таки больше элементов.

    Вообще главное - выкинуть большинство так любимых блогерами виджетов и не лепить повсюду баннера.

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


  • Junglers:

    в спереди – это что такое?

    что, что? опчепятка. Ну бывает ведь) не будем придираться к автору. Такие моменты лучше в личку )

  • Действительно, простые, но эффективные правила!
    Насчет цветов понравилось! И правда, часто читаешь чей-то блог, и начинает рябить в глазах...
    У меня только вопрос насчет значков социальных сетей. Сколько их должно быть в идеале? мне кажется, два слишком мало..... У некоторых посетителей блога может быть страница только в одной соц. сети, и если они захотят перепостить материал, не факт, что будет значок именно их соц. сети.

    • Мне кажется тут нужно спрашивать у самих посетителей, какими соцсетями они пользуются.

Последние посты

Дайджест ABOUT FACE #5: дизайн-принципы хороших продуктов, Sketch + AE, правильная иконка шаринга

Хорошей среды! Пришло время нового выпуска дайджеста. (далее…)

% дней назад

Дайджест ABOUT FACE #4: агенство или продукт, After Effects в код, 100 книг для дизайнера

Хорошего понедельника! Давно не было свежего выпуска дайждеста, а материала накопилось порядочно 😍 (далее…)

% дней назад

5 современных альтернатив WordPress

Это рекламная статья. Многие считают, что WordPress — одна из наиболее популярных open-source систем для…

% дней назад

Дайджест ABOUT FACE #3: новая книга Бюро, CSS в Скетче, дизайн для нескольких языков

Хорошего понедельника! Надеюсь все отлично отдохнули, потому как я собрал для вас новую порцию интересных…

% дней назад

Дайджест ABOUT FACE #2: книги по типографике, одновременная работа с макетом, дизайнер-cатана

Хорошего понедельника! Приветствуем второй выпуск дайджеста. Для тех, кто не в теме, дайджест просеивает тонны…

% дней назад

Дайджест ABOUT FACE #1: редизайн Хрома, сколько зарабатывают дизайнеры, каким должен быть VR интерфейс

Хорошего понедельника! Как я писал в паблике, я решил немного изменить формат выхода новостей. Поэтому всё…

% дней назад