Как это сделано Начальный

Компьютерные шрифты: математика, которую ты читаешь каждый день

Кривые Безье из автопрома, каллиграфия Стива Джобса, нейронаука зрения в субпикселях — карта открытий за каждой буквой на экране.

Длительность
чтение — 15–20 минут
Бюджет
0 ₽
Возраст
12–99 лет
Сложность
Начальный
#шрифты #типографика #кривые безье #tex #кнут #субпиксельный рендеринг #cleartype #opentype #восприятие #математика #джобс

Схема носит иллюстративный характер и может содержать упрощения. Если вы заметили неточность — воспользуйтесь кнопкой обратной связи.

Введение: буква — это математика

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

За этим стоят кривые из автопромышленности, каллиграфия брошенного студента, десять лет работы математика-перфекциониста и нейронаука зрительной коры.


✏️ От Гутенберга до пикселя: 570 лет за три минуты

1450 — Гутенберг изобретает наборный шрифт. Каждая буква — металлический брусок. Одна гарнитура = сотни кг свинцово-оловянного сплава.

1880-е — линотип Оттмара Мергенталера: строка набирается на клавиатуре и отливается целиком. Скорость набора выросла в 5 раз. Так печатались газеты до 1970-х.

1960-е — фотонабор: вместо металла — стекло с буквами и луч света. Шрифт стал бестелесным.

1982 — PostScript (Adobe, Джон Уорнок и Чак Гешке). Первый язык описания страницы: шрифт задаётся уравнениями, а не растром. Лазерный принтер вычисляет форму букв под нужный размер. Настольная полиграфия стала возможной.

1991 — TrueType (Apple + Microsoft). Открытый стандарт векторных шрифтов, альтернатива PostScript. Сегодня шрифты на всех устройствах мира — TrueType или его наследник OpenType.


〜 Кривые Безье: математика из Renault

Пьер Безье и Поль де Кастельжо, 1959–1962

В конце 1950-х два французских инженера независимо решали одну задачу: как описать кривую кузова автомобиля математически, чтобы передать чертёж на завод без искажений.

Поль де Кастельжо (Citroën, 1959) разработал алгоритм. Пьер Безье (Renault, 1962) описал и опубликовал метод — и дал ему имя.

Идея: кривая задаётся не уравнением, а опорными точками. Две крайние — на кривой. Одна или две средних — «притягивают» кривую, но сами на ней не лежат. Двигая контрольные точки, дизайнер лепит форму буквы интуитивно.

Кривая Безье третьего порядка (кубическая) — стандарт PostScript и PDF. Четыре точки. Бесконечно гибко.

Каждая буква в каждом шрифте — это десятки таких кривых, собранных в контур. Заглавная «Б» в кириллице: около 30 опорных точек.

👉 Связь: Фракталы и кривые — итерированные кривые, то же математическое пространство


🍎 Каллиграфия, которая изменила компьютер

Стив Джобс, Reed College, 1972

В 1972 году Джобс бросил Reed College, но остался вольным слушателем. Из всех курсов он выбрал каллиграфию у профессора Роберта Паладино — просто потому что это было красиво.

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

До Mac все компьютеры использовали моноширинный шрифт — как пишущая машинка. Каждая буква занимала одинаковую ширину. «М» и «i» — одна ячейка.

В речи в Стэнфорде (2005) Джобс сказал:

«Если бы я не посетил тот единственный курс каллиграфии, у Mac никогда не было бы нескольких шрифтов или пропорционального набора. А поскольку Windows просто скопировала Mac, вероятно, ни у одного персонального компьютера этого бы не было».

Красота — не украшение. Это функция.


🔢 Кнут и TeX: математик против типографии

Дональд Кнут, 1978–1989

В 1977 году Дональд Кнут — один из крупнейших математиков и программистов мира, автор «Искусства программирования» — получил гранки второго тома своей книги и пришёл в ужас. Новая цифровая вёрстка выглядела ужасно по сравнению с металлическим набором предыдущего издания.

Кнут решил исправить это сам. Планировал потратить год. Потратил десять лет.

Результат: TeX (1978–1989) — система набора, в которой алгоритм Кнута–Пласса переносит и выравнивает текст по абзацам целиком (не по строкам), добиваясь минимального «цвета» полосы. И Metafont — язык, в котором буква задаётся как движение пера с математически описанным наконечником.

TeX до сих пор является стандартом в математике, физике, экономике. Любая научная статья с формулами написана в нём или его наследнике LaTeX.

Кнут предложил: за каждую найденную ошибку в TeX — чек на 2.56 доллара (256 центов = один байт). За ошибку в Metafont — 5.12 доллара. По его словам, это самые прибыльные чеки, которые он когда-либо выписывал — люди их не обналичивали, а вешали на стену.


👁 Хинтинг: оптические иллюзии в шрифте

Глаз не измеряет — он сравнивает. Буква «О» с математически одинаковой высотой с «Н» кажется меньше. Почему? Потому что «Н» упирается в базовую линию и верхнюю линию плоскими засечками, а «О» касается их по кривой — площадь контакта меньше.

Чтобы «О» выглядела одинаковой высоты с «Н», её делают на несколько процентов выше. Это называется оверш (overshoot) — оптическая коррекция, которую дизайнер шрифта закладывает сознательно.

Хинтинг — более низкоуровневый процесс: при малых размерах шрифта (8–12 пикселей) кривые Безье дают неровные, «зазубренные» буквы. Хинтинговые инструкции корректируют округление контрольных точек к пиксельной сетке — вручную, для каждого размера. Это была многолетняя ручная работа до появления автохинтинга.

Типограф и нейробиолог думают об одном: как зрительная система строит образ из неполных данных.


🖥 Субпиксельный рендеринг: Хьюбел снова

ClearType — Microsoft, 2000

ЖК-экран состоит из пикселей. Каждый пиксель — три субпикселя: красный, зелёный, синий. Физически это три отдельных источника света вплотную.

Зрительная кора (те же нейроны Хьюбела и Визела) различает яркость с высоким разрешением, а цвет — с низким. Цветные субпиксели на близком расстоянии сливаются в один «серый» пиксель.

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

Это и есть ClearType (Берт Килей и Грег Чикопф, Microsoft, 2000). Тот же принцип, что в JPEG: алгоритм знает слабые места зрительной системы и использует их.

На современных Retina-дисплеях субпиксельный рендеринг отключён — пиксели настолько малы, что глаз их всё равно не различает. Но на стандартных мониторах он работает до сих пор.

👉 Связь: JPEG и зрение: нейронаука Хьюбела — та же зрительная кора, тот же принцип
👉 Связь: Цветовые оппонентные каналы


🔡 Переменные шрифты: один файл, бесконечно много начертаний

OpenType Variable Fonts, 2016

До 2016 года каждое начертание шрифта — тонкое, жирное, курсивное, узкое — хранилось отдельным файлом. Гарнитура из 6 начертаний = 6 файлов.

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

Это снижает вес страницы в браузере, позволяет анимировать типографику и точно подбирать начертание под конкретный размер отображения. Математически — линейная интерполяция в пространстве контрольных точек Безье.


Итог: карта открытий

КомпонентОткрытие / изобретениеСвязь с наукойГод
Векторный контурКривые БезьеПараметрические кривые, математика1959–1962
Пропорциональный наборКаллиграфия → Джобс → MacЭстетика восприятия1984
Математический наборTeX (Кнут)Вычислительная математика1978–1989
Оптические коррекцииХинтинг, овершПсихофизика зрения1980-е
Субпиксельный рендерингClearTypeНейронаука зрения (Хьюбел)2000
Переменные шрифтыOpenType VariableИнтерполяция, линейная алгебра2016

Шрифт — это точка пересечения математики, нейронауки и эстетики. Три дисциплины, которые редко разговаривают друг с другом, встретились в одной букве.

Что почитать

Книги

  • Кнут Д.. Всё про TeX (1984) есть на русском Оригинал — The TeXbook. Кнут описывает математику набора изнутри
  • Брингхёрст Р.. Элементы типографского стиля (1992) есть на русском Библия типографа. Почему шрифты выглядят так, как выглядят

Онлайн

Обратная связь
Тип обращения
Ваша оценка
Сообщение
Подтверждение
Загрузка...

без персональных данных