May 11, 2023

Правила вёрстки

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

Шрифты для заголовков

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

Главное правило – подобрать шрифт так, чтобы он все же оставался читабельным.

Шрифты для основного текста

А тут уже наоборот: из-за того, что мы имеем большое количество информации, то шрифт стоит подобрать простой и читабельный. Это могут быть, например, Montserrat, Helvetica, Igra Sans, TT Prosto Sans и другие.

Пары шрифтов

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

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

Иерархия

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

Для разделения можно использовать размер и цвет, а также стиль и начертание шрифта.

Отступы

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

Грамотное разделение на абзацы поможет захватить внимание читателя.

Выравнивание

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

По центру можно выравнивать заголовки или фразы, не длиннее трех строк.

Кернинг

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

Трекинг

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

Интерлиньяж

Интерлиньяж — межстрочное расстояние. За этим расстоянием также нужно следить. При оформлении различной печатной или веб-продукции можно придерживаться таких правил:

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