Типографика

Искусство расставить текст так, чтобы его читали: выбрать размер букв, расстояние между строками, длину строки и уровни заголовков. Не «красивый шрифт», а читаемость: 16 px, интервал 1.6, строка в 45–75 знаков.

Как это выглядит: h1 { font-size: 38px; line-height: 1.1; } p { font-size: 16px; line-height: 1.6; } .text { max-width: 65ch; } — четыре размера на всю страницу и строка в 65 знаков

Не путать: Типографика — не выбор гарнитуры и не «красивые шрифты». Гарнитура — это форма букв, а типографика — размеры, интервалы и ширина: с одной и той же гарнитурой можно сделать и читаемую страницу, и нечитаемую. И это не только заголовки: основной текст читают в сто раз чаще.

Откуда слово: От греческого typos — «отпечаток, знак» и graphein — «писать». Буквально — «письмо знаками». Слово пришло из типографии, где текст набирали металлическими литерами: каждая буква была отдельным отпечатком. Тот же корень у «типа» и «прототипа». Смысл сохранился: типографика — про то, как знаки стоят на странице.

Где это проходят: урок 10.1 «Кегль и межстрочный интервал: почему текст читается» · Интерфейсы и сайты с нуля

Связанные слова

Ещё слова раздела «Интерфейсы и браузер»

Весь словарь программиста — 135 слов с объяснениями, примерами и ссылками на уроки.

Что ещё есть на сайте

Учиться: Уроки · Программирование с нуля · Интерфейсы и сайты с нуля · Компьютер без страха · Если уже случилось · Какой компьютер нужен · Без кода: ставить задачу · Конструктор описания задачи

С чего начать: Гайды: с чего начать · Тест «с какого урока начать» · Профессии и языки

Потренироваться: Практикум: задачи из жизни · Игры-тренажёры · Симулятор: от задания до сдачи · Мастерская экрана · Колесо фортуны

Словари и юмор: Словарь программиста · Словарь руководителя · Корявые задачи

Сайт, оплата и помощь: Родителям · Инструкция пользователя · Сообщество · Подписка · Помощь и поддержка · Отзывы учеников · Профиль и пароль