Растяжение и корректировка шрифтов

Есть два свойства шрифтов, появившихся в CSS2, но отсутствующих в CSS2.1. В CSS2.1 они были опущены, потому что, несмотря на их многолетнее присутствие в спецификации, они не были реализованы в броузерах. Первое обеспечивает растяжение шрифтов в горизонтальном направлении, а второе – интеллектуальное масштабирование подставляемых шрифтов, когда недоступна первая возможность. Начнем с растяжения. Как можно ожидать из его значений, это свойство предназначено для того, чтобы делать символы шрифта шире или уже. Его поведение очень схоже с ключевыми словами задания абсолютных значений (например, xx -large) свойства font-size, оно имеет диапазон абсолютных значений и два значения, которые позволяют автору увеличивать или уменьшать разряжение шрифта. Например, автор решил воздействовать на текст элемента, выделяемого жирным шрифтом, растягивая его символы так, чтобы они были шире, чем символы шрифта родительского элемента:

strong {font-stretch: wider;}

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


Поскольку все шрифты выглядят по разному, один шрифт, имея определенный размер, может читаться хорошо, тогда как другой шрифт при таком же размере – с трудом или вообще никак.
Факторы, оказывающие влияние на удобочитаемость шрифтов, – размер и x-высота (высота глифов строчных букв). Результат деления x-высоты на font-size называют аспектом шрифта (aspect value).

Шрифты, имеющие большее значение аспекта, дольше сохраняют разборчивость по мере уменьшения размера, и соответственно шрифты с малым аспектом быстрее перестают читаться. Сказанное хорошо иллюстрирует сравнение обычных шрифтов Verdana и Times. размер обоих шрифтов равен 10px:

p {font-size: 10px;}
p.cl1 {font-family: Verdana, sans-serif;}
p.cl2 {font-family: Times, serif; }

Текст, написанный шрифтом Times, читать намного сложнее, чем текст Verdana. Частично дело в ограничениях растрового отображения, но еще и в том, что шрифт Times просто становится нечитаемым при малых размерах. Как выясняется, отношение x-высоты к размеру символа в шрифте Verdana составляет 0,58, тогда как для Times эта величина равна 0,46. В этом случае можно объявить аспект Verdana, и агент пользователя скорректирует размер фактически используемого текста.


Вот формула: Объявленный font size × (значение font-size-adjust ÷ аспект доступного шрифта) = скорректированный font-size

Таким образом, если шрифт Times применяется вместо Verdana, корректировка такова:

10px × (0.58 ÷ 0.46) = 12.6px

p {font: 10px Verdana, sans-serif; font-size-adjust: 0.58;}
p.cl1 {font-family: Times, serif; }

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

Оцените статью: (0 голосов)
0 5 0

Статьи из раздела CSS на эту тему:
Абсолютные размеры
Варианты шрифтов
Загрузка шрифтов
Задание семейства шрифтов
Интеллектуальное сопоставление шрифтов

Вернуться в раздел: CSS / 5. Шрифт