Начертание и насыщенность: почему жирным выделено всё, а главного не видно
Вы выделили жирным главную мысль. На следующем слайде ещё одну, потом цифру, потом заголовок таблицы. К концу презентации жирным набрана половина текста, и взгляду больше не за что зацепиться. Насыщенность ведёт себя как громкость в зале: пока говорит один, его слышно. Когда говорят все, получается ровный гул.
Выделяйте жирным по одной строке
Слайд один и тот же. Меняется только количество жирных строк.
Жирный тут единственный инструмент: кегль, цвет и расстояния во всех положениях одинаковые.
Что такое начертание и насыщенность шрифта
Начертание задаёт конкретный рисунок букв внутри одного семейства: прямой или курсивный, узкий или широкий, тонкий или жирный. Насыщенность отвечает за толщину штриха и записывается числом от 100 до 900 с шагом 100. На 400 набирают основной текст, 700 прячется за кнопкой «Ж» в редакторе.
Названия ступеней у шрифтов разъезжаются: в одном семействе 100 зовут Thin, в другом Ultralight, а Thin там стоит на 200. В меню редактора вы увидите слова, в Figma и в вебе число. Число и берите за ориентир: «заголовок 700, текст 400» понимают одинаково все.
Проведите вес от 100 до 900
Обе строки набраны одним весом. Следите за мелкой: она сдаётся первой.
Шкала под бегунком набрана своими весами: подпись «100» нарисована весом 100. На мелком кегле тяжёлые ступени читаются сразу, лёгкие приходится угадывать.
Вес даёт иерархию и не занимает места
Заголовок не выделяется, первый рефлекс поднять кегль. На слайде, где четыре блока и график, лишние восемь пунктов съедают строку, двигают соседей и ломают сетку. Вес делает ту же работу и не забирает ни одного пикселя: буквы остаются на прежних местах, меняется только плотность.
Расстояния собирают элементы в группы, за это отвечает закон близости. Вес расставляет старшинство внутри группы: что читать первым, что вторым, а что можно не читать вовсе.
Соберите иерархию двумя способами
Один бегунок растит заголовок, второй утяжеляет. Внизу видно, сколько места ушло.
Между соседними ступенями разница не меньше 200
400 и 500 рядом не читаются как акцент. Глаз видит, что строки чем-то отличаются, но не понимает чем, и списывает разницу на сбой при выгрузке в PDF. Рабочая пара для слайда 400 и 700. Нужно три уровня, берите 300, 500 и 800, а не 400, 500 и 600.
Счёт идёт по акцентам. Разводить на 200 надо веса, которые обязаны читаться как разные уровни. Подпись, уходящую на второй план, можно опустить и на одну ступень: это не акцент, а шаг назад.
Разведите две строки по весу
Нижняя строка держит вес 400. Верхнюю утяжеляйте бегунком.
Два-три веса на слайд, больше не нужно
Каждый новый вес обещает читателю, что тут другая важность. Четыре обещания подряд он проверить не успевает и перестаёт верить всем сразу.
На разборах в школе повторяется одна и та же картина: студент приносит слайд, где жирным набраны заголовок, вывод, три цифры и подпись к графику. Мы снимаем жирный со всего, кроме вывода, и слайд начинает читаться, хотя ни один другой параметр не тронут.
Добавляйте ступени веса по одной
Текст и кегли зафиксированы. Меняется только число разных весов на слайде.
Мелкий текст не тоньше 300
Тонкая линия теряет контраст быстрее толстой. Штрих в один пиксель на проекторе размывается и смешивается с фоном, а толстый штрих остаётся тёмным пятном. Заголовок в 40 пунктов на весе 200 выглядит собранно, подпись в 12 пунктов на том же весе исчезает уже с третьего ряда. Чем мельче кегль, тем толще нужен штрих. Разговор тот же, что и про контрастность, только вместо цвета толщина. И отдельный вопрос, каким этот кегль вообще должен быть: границы разобраны в статье про кегль, интерлиньяж и трекинг.
Утоньшите подпись и включите проектор
Заголовок держит вес 700 и не меняется. Бегунок управляет весом нижней подписи.
Имитация: реальная потеря зависит от лампы и света в зале. Направление честное, тонкие штрихи тают первыми. Как считается сам контраст, разобрано в статье про контрастность текста и фона.
Курсив ставят там, где он нарисован
Настоящий курсив рисуют заново. У букв меняются формы, появляются связки, оси уходят вправо: строчная «а» получает другой рисунок, у «т» вырастают три ноги. Поддельный наклон делает сама программа: берёт прямые буквы и заваливает их вправо. Отличить легко по штрихам: у настоящего курсива тонкие и толстые части остаются на своих местах, у наклонённого они разъезжаются, а круглые буквы превращаются в овалы с острыми углами.
Курсив работает как тихая пометка: цитата, подпись к иллюстрации, латинское название. Для главной мысли он слаб, там нужен вес. Курсив вместе с жирным и подчёркиванием на одной строке даёт три сигнала сразу и ни одного акцента.
Включите курсив у двух шрифтов сразу
Слева шрифт, у которого курсив нарисован. Справа шрифт, у которого его нет.
Слева взят системный Georgia, потому что у шрифта сайта в вебе есть только прямое начертание. Справа тому же шрифту сайта разрешено подделать наклон: ровно так поступает редактор презентаций, когда в семействе нет курсива. Какие шрифты приходят с настоящим курсивом, видно в карточке на сайте-источнике, подборка таких сайтов собрана в разделе «Шрифты» базы ресурсов.
Где насыщенность ломается чаще всего
- Жирным набрано целое предложение вместо двух слов, которые несут смысл
- Подпись к графику тяжелее самого текста: старшинство перевёрнуто
- Вес 200 на сноске в 11 пунктов, которую и так почти никто не читает
- Заголовок 500 при тексте 400: разницу видит только автор макета
- Курсив, жирный и подчёркивание на одной строке
Где сломана насыщенность?
Нажмите на слайд, у которого веса расставлены неверно. Кегли и цвета везде одинаковые.
Почините слайд
Веса на этом слайде расставлены наугад: заголовок легче текста, подпись тяжелее всех. Раздайте каждому элементу свой вес так, чтобы три индикатора стали зелёными. Кегли и текст не трогаем, меняется только насыщенность.
Готово: заголовок старше текста на две ступени, подпись не спорит с текстом, лишних весов на слайде нет.
Три правила насыщенности
Три карточки ниже про вес. Курсив в них не попал намеренно: он не раздаёт старшинство, а помечает, и правило у него своё. Что читатель прочитает после самого заметного, решают уже расстояния и размеры, эти термины разобраны в Учебнике.
Шаг 200
Соседние веса разводите минимум на две ступени. 400 и 700 рабочая пара, 400 и 500 не пара.
Два-три веса
Один вес даёт плоский слайд, четыре и больше дают шум. Между ними всё живое.
Мелкое не тоньше 300
Тонкие штрихи исчезают на проекторе первыми. Подписи и сноски держите от 300.
Чек-лист самопроверки слайда
Отметьте то, что выполнено на вашем слайде.
Одно правило в неделю
Подпишитесь на рассылку: каждую неделю присылаем разбор одного правила дизайна и материалы, которые можно применить сразу.
Те же разборы выходят в телеграм-канале школы. Другие термины разобраны в Учебнике.