Как оформлять текст на блоге, чтобы было удобно читать

5 Трюков С Дизаном, Которые Сделают Блог Легко Читаемым

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

1. Крупные заголовки

2. Четкий контраст

3. Большие отступы

4. Минимум отвлекающих факторов

5. Простая навигация

Пару лет назад я услышал эти советы от парня по имени Rafal Tomal. Он стоит за дизайном многих проектов CopyBlogger Media. Для меня это веское основание верить тому, что он говорит.

С самого первого дня существования проекта Блог Тактика, я подстроил свой дизайн под эти советы. Еще ни разу не пожалел.

Почему тебе стоит прочитать эту статью очень внимательно?

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

Как оформлять текст на блоге, чтобы было удобно читать

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

И я покажу тебе, что значит каждый из этих пунктов в отдельности.

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

1. Увеличь заголовки

У людей есть привычка сканировать контент, воспринимать информацию лишь из подзаголовков и только если что-то в этих подзаголовках их зацепит они вникают в статью.

А раз так, то тебе стоит облегчить им задачу и увеличить размеры заголовков и подзаголовков.

Таким образом, твои посты не только будет легче читать, но и выглядеть они будут профессионально.

Как оформлять текст на блоге, чтобы было удобно читать

Если на картинке слева подзаголовки бросаются в глаза, то на картинки справа их сложно различить.

2. Добавь контраст

Глупость использовать на блоге светло-серый шрифт текста. Это выглядит красиво, но создает проблемы для людей с плохим зрением и тем, кто читает на мобильных устройствах и мониторах с низким разрешением.

Задай четкий контраст между задним фоном и содержанием страницы. У меня это белый фон и черные буквы. Выглядит опрятно и текст получается легким для поглощения.

Как оформлять текст на блоге, чтобы было удобно читать

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

3. Сделай большие отступы

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

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

Как оформлять текст на блоге, чтобы было удобно читать

Вот еще несколько советов, как и где разумно использовать отступ:

— вокруг изображений (не менее 20 px)

— до и после цитат

— отступ между параграфами может совпадать с высотой строки на странице.

— до подзаголовков

Рекомендации из этого пункта можно свести к одному совету — используй больше пустого пространства вокруг элементов блога.

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

4. Убери отвлекающие факторы

Какая главная цель блога? Знакомить посетителей со своим контентом, не так ли?

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

Уменьши число графических элементов вокруг основного контента. Это сильно отвлекает читателя. Оставь только то, что действительно необходимо.

Как оформлять текст на блоге, чтобы было удобно читать

6. Увеличь размер шрифта.

Какая основная задача которую должен выполнять шрифт? БЫТЬ ЧИТАБЕЛЬНЫМ. Какой самый лучший шрифт для блога? Который ЛЕГКО ЧИТАТЬ.Люди не должны ПЫТАТЬСЯ прочитать. Это должно получаться само собой.

И речь не о какой-то определенной категории шрифтов. Это не так важно, как РАЗМЕР шрифта.

Мне 31 год. Со зрением проблем нет. И на мониторе в 15″ мне тяжело изучать сайты с размером шрифта в 12 px.

Оптимальный размер шрифта сегодня — 16 px. 

Посмотри на свой блог. Какой у тебя размер шрифта? Не усложняешь ли ты жизнь своим читателям, используя слишком маленький шрифт?

Нужно ли менять шаблон блога?

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

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

Какой шаблон я использую на Блог Тактике?

Я предпочитаю использовать фреймворки, вместо стандартных шаблонов WordPress. Фреймворк — каркас из которого можно лепить свой дизайн. Мне нравится в них то, что управление элементами дизайна происходит в отдельной панели.

Что это значит? Не нужно копаться в коде!

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

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

Как оформлять текст на блоге, чтобы было удобно читать

Фреймворк, который я использую, называется Thesis. Но мне известны и другие: Genesis, Page Lines, Themify и др.

Рекомендую обзавестись такой вещицей. Использую уже больше 3-х лет и радости нет конца.

Что делать дальше?

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

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

Могу я узнать твое мнение?

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

2. Какой дизайн предпочитаешь лично ты: минимализм или же дизайн с обилием графики и картинок?

Пожалуйста, поделись своим мнением в комментариях.

Заранее благодарю.