Интерактивный справочник по типографике: сделайте текст на сайте красивым и удобным для чтения

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

Оцените:

Что такое типографика?


Типографика (от греч. τύπος — «отпечаток» и γράφω — «пишу») — это художественное оформление текста посредством набора и верстки. При этом для оформления текста используется размер и начертания шрифтов, интервалы между строками, абзацами, разные начертания заглавных букв, стили для заголовков и т. д. 


Сегодня типографикой в той или иной мере занимаются не только наборщики и верстальщики как раньше, но и графические дизайнеры, арт-директоры и даже обычные блоггеры, ведущие «ЖЖшечку» о своих личных делах и переживаниях (когда выбирают тип, вид и начертание шрифта в тексте своих постов). В эпоху до расцвета Сети типографика была прерогативой печатников и дизайнеров, а теперь стала привычной составляющей работы современного журналиста, онлайн-колумниста и блоггера.


Типографика глазами финского дизайнера



Именно поэтому финский дизайнер-фрилансер Томми Кайкконен (Tommi Kaikonnen) решил в своем блоге опубликовать быстрое практическое руководство с наглядными примерами для тех, кто хочет изменить текстовый облик своего сайта. 


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


Принципы типографики, которые надо учесть


Отображение текста


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


Расстояния и размеры в тексте


Расстояния измеряются в количестве символов, помещающихся в ту или иную строку. 50-80 символов — оптимальная длина строки на странице. Старайтесь соблюдать этот параметр при верстке и выборе визуальных стилей для своих постов и страниц.


Высота строки


Здесь финский дизайнер рекомендует использовать в качестве ориентира значение высоты строки в 150% от размера основного шрифта, используемого на странице сайта.


Другие важные компоненты типографики для вашего блога:


- Визуальная иерархия компонентов / блоков / разделов
- Заголовки
- Абзацы
- Шрифты и их начертания
- Размер шрифта
- Цвета


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


Изображение: Baloncici

Оцените:

Комментарии Facebook

Комментарии ВКонтакте