Шрифт на экране. Часть 1

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

Первые наборные шрифты для печати появились в Европе в середине XV века — до этого люди писали книги и документы руками или вырезали на деревянных досках в зеркальном отражении целые страницы. Технологию более или менее удобного тиражирования букв изобрёл Иоганн Гутенберг. Шрифт существовал в виде комплекта металлических или деревянных литер — в натуральную величину, больше литер для часто встречающихся букв, меньше — для редких.

На самом деле ещё в начале 1990-х годов встречались типографии, в которых большими тиражами печатали книги с металлических литер.

Литеры в XX веке, конечно, делались уже не так, как во времена Гутенберга или Гарамона, а механическим способом. Но тем не менее, это были физические объекты. То есть и процесс изготовления шрифта, и процесс его использования ещё 30–40 лет назад мог происходить без участия компьютера.

При этом те же 40 лет назад будущие основатели Adobe уже работали над языком PostScript и одноимённым шрифтовым форматом. А ещё тогда шрифты могли храниться в виде фотографий или цифровых растровых изображений.

А способ делать и хранить шрифты в векторной форме разработал и представил в 1975 году профессор Петер Каров из компании URW.

Это был IKARUS — программный пакет для автоматизированного проектирования шрифтов.

«Практически первой гарнитурой, спроектированной в 1979 году с помощью пакета IKARUS, был замечательный шрифт ITC Galliard Мэтью Картера в 8 начертаниях. <...> Дизайнеры, с которыми работала [студия] ITC, рисовали только основные буквы латинского алфавита, цифры и знаки препинания в нескольких основных начертаниях (обычно самых светлых и самых жирных), а остальные несколько сот знаков латиницы и промежуточные начертания гарнитуры разрабатывали сотрудники Карова. <...>

Расцвет IKARUS продолжался до широкого внедрения персональных компьютеров и настольных издательских систем, до изобретения сегодняшних шрифтовых форматов PostScript и TrueType. Пакет IKARUS оказался слишком дорогой и сложной системой для персональных компьютеров». (В. Ефимов. Предисловие к русскому изданию книги П. Карова «Шрифтовые технологии. Описание и инструментарий» М. Мир, 2001)

Тут важно понимать, что даже когда программы для разработки шрифтов начали работать на персональных компьютерах, а не только на больших промышленных, речь шла именно о разработке шрифта на экране, а не о его использовании на том же экране. Векторные шрифты, похожие на современные, были нужны для последующей печати (или, например, плоттерной резки). А для использования на экране, например, в интерфейсе, они не слишком подходили. У компьютеров Apple 1980-х были монохромные дисплеи 512×342 или 640×480 пикселей.

В их интерфейсе использовался пиксельный шрифт. Его высота от верха выносного элемента буквы b до низа выносного элемента буквы g составляла 12 пикселей, из них на строчную букву типа n или x приходилось 7 пикселей.

Этот шрифт называется Chicago, его спроектировала Сьюзен Кэр (Susan Kare) и он оставался системным шрифтом Apple до 1997 года.

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

Пиксели на ранних монохромных электронно-лучевых трубках были округлыми, довольно крупными и неделимыми.

Пиксель либо светился, либо нет. Сейчас этот режим отображения шрифтов на экране называется Black&White или Bitmap и используется довольно редко.

Когда векторная буква в режиме Black&White накладывается на растровую сетку экрана, алгоритм отображения по умолчанию такой: пиксель, центр которого оказался внутри контура буквы, становится чёрным, а пиксель, центр которого оказался снаружи — белым. Если контур совпал с растровой сеткой удачно, получится что-то вроде пиксельного шрифта. А вот если неудачно, то даже не всегда получится узнать букву.

Иллюстрации из статьи на сайте Microsoft:

Чтобы избежать этого эффекта, шрифтовые технологи встраивают в шрифт специальные инструкции для операционной системы — хинты (hints). Хинтинг улучшает отображение шрифта на экране в мелких размерах или при низком разрешении, когда размер пикселя сопоставим с размером буквы. Реально хинтинг помогает, когда высота строчной буквы (типа х или а) от 5 до 30 пикселей — мельче всё равно не прочитать, а крупнее операционная система справится сама.

В режиме хинтинга Black&White приходится для каждого размера букв контролировать положение пикселей вручную.

Размер букв при хинтинге ещё называют ppem — pixels per em, то есть количество пикселей на кегль — от верха выносных элементов в буквах типа h до низа выносных элементов в буквах типа g. На картинке пиксели расставляются для ppem 12, на основную часть буквы приходится шесть пикселей и ещё по три — на выносные элементы.

Когда Мэтью Картер проектировал шрифты Georgia и Verdana для Windows 95, он сразу учитывал и то, как буквы будут выглядеть на мониторе.

На этой фотографии 1993 года видны сразу три важные вещи: векторный контур буквы, то, как она будет отображаться на экране в режиме Black&White в 14 ppem и интерфейс MacOS с пиксельными шрифтами.

Ещё одна важная деталь для шрифтов, которые в первую очередь предназначены для использования в мелком размере на экране: у них обычно крупные строчные знаки, достаточно широкие буквы и — особенно важно — просторные межбуквенные расстояния. Классический пример — сравнение шрифтов Verdana и Tahoma. Рисунок у них одинаковый, но Verdana должна была работать на экране, а Tahoma — печататься на принтере.

Откуда берётся эта разница?

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

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

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

Иногда современные шрифты делаются с расчётом на то, чтобы хорошо ложиться на пиксельную сетку, как Input Mono Дэвида Джонатана Росса.

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

Где сейчас используются пиксельные шрифты или режим растрирования Black&White или Bitmap?

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

Обратите внимание на разницу между относительно старыми шрифтами (Calibri, Baltica), которые были к нему адаптированы, и новыми, которые в режиме Black&White уже никто не обрабатывал.

Продолжение следует

#дизайн #шрифты #типографика