Интерактивный справочник по типографике: сделайте текст на сайте красивым и удобным для чтения
Обычно советы по визуальному оформлению сайтов и блогов сосредотачиваются вокруг выбора шаблонов, компоновки элементов интерфейса, кнопок для публикации контента в социальных сетях. Незаслуженно мало внимания уделяется типографике. А совершенно зря: правильно выбранный шрифт, структура представления текста и выбор межстрочных интервалов наряду с версткой и сочетанием текста, заголовков и разметки даже без иллюстраций могут сделать страницу интересной и непохожей на аналогичные проекты.
Что такое типографика?
Типографика (от греч. τύπος — «отпечаток» и γράφω — «пишу») — это художественное оформление текста посредством набора и верстки. При этом для оформления текста используется размер и начертания шрифтов, интервалы между строками, абзацами, разные начертания заглавных букв, стили для заголовков и т. д.
Сегодня типографикой в той или иной мере занимаются не только наборщики и верстальщики как раньше, но и графические дизайнеры, арт-директоры и даже обычные блоггеры, ведущие «ЖЖшечку» о своих личных делах и переживаниях (когда выбирают тип, вид и начертание шрифта в тексте своих постов). В эпоху до расцвета Сети типографика была прерогативой печатников и дизайнеров, а теперь стала привычной составляющей работы современного журналиста, онлайн-колумниста и блоггера.
Типографика глазами финского дизайнера
Именно поэтому финский дизайнер-фрилансер Томми Кайкконен (Tommi Kaikonnen) решил в своем блоге опубликовать быстрое практическое руководство с наглядными примерами для тех, кто хочет изменить текстовый облик своего сайта.
Его практическое руководство выглядит как мини-сайт с интерактивными примерами, организованными последовательно, как книга. Каждый раздел этой онлайн-книги — это один из базовых принципов типографики.
Принципы типографики, которые надо учесть
Отображение текста
Комфортное чтение начинается с комфортного отображения текста на сайте. Пустое пространство можно использовать для визуальной разметки ничуть не хуже, чем разные шрифты и способы их начертания. Отображение текста в абзацах, списках и блоках поможет вашим подписчикам с первого взгляда выделить самое важное в тексте, визуально отделить разные части статьи от основного тела страницы на сайте или в блоге.
Расстояния и размеры в тексте
Расстояния измеряются в количестве символов, помещающихся в ту или иную строку. 50-80 символов — оптимальная длина строки на странице. Старайтесь соблюдать этот параметр при верстке и выборе визуальных стилей для своих постов и страниц.
Высота строки
Здесь финский дизайнер рекомендует использовать в качестве ориентира значение высоты строки в 150% от размера основного шрифта, используемого на странице сайта.
Другие важные компоненты типографики для вашего блога:
- Визуальная иерархия компонентов / блоков / разделов
- Заголовки
- Абзацы
- Шрифты и их начертания
- Размер шрифта
- Цвета
Если вы хотите правильно оформить свой сайт или блог, сделать его элегантным и стильным, советуем вам изучить полный интерактивный курс типографики Томми Кайкконена.
Изображение: Baloncici
Комментарии Facebook
Комментарии ВКонтакте