5 главных правил типографики в веб-дизайне

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

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

1. Используйте не более трех разных шрифтов

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

2. Не увлекайтесь верхним регистром

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

3. Соблюдайте правильный междустрочный интервал

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

4. Найдите оптимальную длину строки

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

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

5. Используйте цветовой контраст

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

Правил типографики для веб-дизайна намного больше. Мы остановились лишь на основных. Грамотно подобранный шрифт и аккуратная работа с ним способны привлечь читателя и добавить стиля вашему сайту. И наоборот, неудачные варианты типографики отпугивают пользователя. Главный принцип при работе с текстом: сделать его читабельным, понятным и разборчивым. Больше советов — в журнале Cart-Power.