Единицы измерения шрифта или «Как сделать шрифт нужного размера? Отзывчивый размер шрифта.

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

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

Шрифт представляет собой набор характеристик символов в одной гарнитуре (однотипного начертания), такой, как Arial, Times New Roman или Courier. Знаковый состав большинства шрифтов включает в себя прописные и строчные буквы, цифры, знаки препинания, а также дополнительные символы из расширенного набора.

Размер (кегль) шрифта измеряется в пунктах :1 пункт равен 1/72 дюйма .

Чтобы выбрать необходимый размер шрифта, нужно:

    В меню Формат выберите командуШрифт (рис. 10.8).

    Установите необходимый шрифт, размер, цвет, стиль начертания.

Изменение цвета текста

Выделите текст, который требуется изменить, и выполните одно из следующих действий:


В рамке Видоизменение можно установить флажки:

з

Рис. 10.9.

ачеркнутый – зачеркивание текста одинарной линией;

двойное зачеркивание – зачеркивание текста двой­ной линией;

верхний индекс – размер символов умень­шается, текст располагается выше;

нижний индекс – размер символов умень­шается, текст располагается ниже;

с тенью – рядом с символами появляется тень;

контур – показывается только контур симво­лов;

приподнятый – символы изображаются при­под­нятыми над поверхностью листа;

утопленный – символы изображаются уто­п­ленными в поверхность листа;

малые прописные – строчные буквы становятся заглавными, но меньшего размера;

все прописные – строчные буквы становятся заглавными;

скрытый – делает текст непечатаемым.

В поле Образец показан фрагмент текста с выбранными параметрами.

Если необходимо изменить межзна­ко­вый интервал , нужно:

В меню Формат выбрать командуШрифт , а затем перейти на вкладкуИнтервал и выполнить одно из следующих действий (рис. 10.10):

Кернинг регулирует интервалы между отдельными парами букв. При выборе параметровРазреженный илиУплотненный между всеми буквами устанавливаются одинаковые интер­ва­лы.

Изменение масштаба документа

Бывает нужно уменьшить масштаб документа таким образом, чтобы он весь помещался на экране. В этом случае с документом можно работать как с листом бумаги. И наоборот, часто бывает нужно увеличить масштаб изображения, например, чтобы рассмотреть или отредактировать мелкие детали графического объекта. При изменении масштаба изменяется только представление документа на экране, а не размер текста и графики, используемый для вывода на печать.

Основной инструмент изменения масштаба документа – окно диалога Масштаб . Открыть его можно, выбрав в менюВид командуМасштаб (рис. 10.11). При использовании окна диалогаМасштаб имеется возможность устанавливать большее количество параметров масштабирования.

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

Примерно те же параметры масштабирования (но быстрее) можно задать и с помощью поля Масштаб на стандартной панели инструментов (рис. 10.12).

Размер шрифта в CSS задается с помощью свойства font-size , например:

p {
font-size: 12px;
}

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

В табл. 1 приведены единицы, которые можно использовать для указания размера шрифта.

Рассмотрим применение каждого из них более подробно.

p {
font-size: 10pt;
}

Следует избегать использования пунктов и пик для оформления текста, предназначенного для отображения на экране. Эти единицы идеально подходят для задания размера шрифта для печати; измерение в пунктах пришло из полиграфии. Пункт составляет 1/72 часть дюйма, а пика – шестую часть дюйма. После печати текстовые документы, шрифт в которых задан в данных единицах, будут в точности соответствовать намерениям автора – в конечном счете шестая часть дюйма остается шестой частью дюйма как на листе формата А4, так и на ватмане. Однако компьютеры не в состоянии отобразить физические размеры с такой точностью, и они пытаются угадать – причем не слишком успешно – размер пункта или пики, из-за чего под различными платформами один и тот же документ может отображаться по-разному.

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

p {
font-size: 12px;
}

Многие дизайнеры любят использовать пикселы в качестве единиц измерения для задания размера шрифта, поскольку это позволяет добиться одинакового отображения в различных броузерах и под разными платформами. Однако при этом игнорируются настройки броузера пользователя; более того, при просмотре такой страницы в Internet Explorer пользователь не сможет изменить размер шрифта. Это представляет серьезные ограничения для пользователей со слабым зрением, для которых возможность прочтения зависит от наличия функции увеличения шрифта.

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

Em – относительная единица измерения размеров шрифта. Ее название пришло из области типографии, где оно соответствует размеру заглавной буквы М, которая, как правило, является самым широким символом шрифта. В CSS 1em соответствует размеру шрифта, используемому в системе пользователя по умолчанию, или размеру шрифта родительского элемента, если он отличается от используемого по умолчанию.

Если вы используете em (или другие относительные единицы) для задания размера всех шрифтов, пользователи смогут изменять размер символов текста в соответствии с настройками размера символов, установленными в их броузере. Для примера создадим описание стиля, задающее размер шрифта внутри элемента p равным 1em :

p {
font-size: 1em;
}

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

Значения в em можно задавать десятичными числами. К примеру, чтобы задать размер шрифта на 10 процентов меньше используемого по умолчанию (или размера шрифта родительского элемента), можно использовать следующее правило:

p {
font-size: 0.9em;
}

Чтобы текст стал на 10 процентов крупнее, чем при использовании значения по умолчанию или унаследованного значения, можно использовать следующее правило:

Еx – относительная единица измерения размеров, соответствующая высоте строчной буквы «х» шрифта по умолчанию. Теоретически, если присвоить свойству font-size абзаца значение 1ex , его заглавные буквы будут той же высоты, какую имела бы строчная буква x, если бы размер шрифта не был задан (при этом размер строчных букв рассчитывался бы относительно заглавных).

p {
font-size: 100%;
}

Как и в случае с em и ex , при задании размеров в процентах размеры будут соотноситься с настройками пользовательского броузера, и пользователь сможет самостоятельно изменять размер шрифта. Значение 100% размера шрифта для элемента p соответствует размеру шрифта, заданному настройками по умолчанию (так же, как и при задании значения 1em ). При уменьшении процентного значения размер текста уменьшается:

p {
font-size: 90%;
}

При увеличении процентного значения размер текста увеличивается:

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

Ключевые слова с абсолютными значениями

В распоряжении веб-разработчика есть семь абсолютных ключевых слов CSS:

  • xx-small
  • x-small
  • small
  • medium
  • large
  • x-large
  • xx-large

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

Измерения с помощью ключевых слов называются абсолютными, поскольку при этом отсутствует наследование от родительского элемента. Тем не менее в отличие от применения абсолютных значений, например в пикселах или пунктах, использование абсолютных ключевых слов позволяет посетителю сайта изменять размер шрифта вручную, а также не переопределяет пользовательские настройки броузера. Основной проблемой при применении абсолютных ключевых слов становится несоответствие отображения текста, оформленного с их помощью, в разных броузерах – текст с размером xx-small может быть отчетливо виден в одном броузере и совершенно нечитаем в другом.

Ключевые слова с относительными значениями

При задании размера шрифта с помощью относительных ключевых слов – larger и smaller – он определяется по отношению к размеру, установленному для родительского элемента, подобно тому, как это происходит при использовании em и % . Таким образом, если размер элемента p задан с помощью абсолютного ключевого слова small , и вы хотите, чтобы выделенный фрагмент текста отображался более крупным шрифтом, можно использовать следующую таблицу стилей:

p {
font-size: small;
}
em {
font-size: larger;
}

Данная разметка будет отображена, поскольку текст между тегами и отображается более крупным шрифтом, чем текст родительского элемента p :

Пример:

В данном примере размер шрифта устанавливается в классе copy . Текст, заключенный в тег

, печатается с отступом 2em . Размер заголовка третьего уровня больше, чем размер основного текста, установленный браузером по умолчанию.

Пример

CHAPTER II
The Pool of Tears

After Word has been installed on a network server, workstation users can select one of three options.

THE FOLLOWING TABLES DETAIL HOW WORD FILES AND DIRECTORIES
ARE DISTRIBUTED IN A NETWORK ENVIRONMENT-ON A SERVER, AT
A SINGLE-USER WORKSTATION, AND AT A SHARED-VERSION WORKSTATION.

Результат:

CHAPTER II
The Pool of Tears

After Word has been installed on a network server, workstation users can select one of three options.

THE FOLLOWING TABLES DETAIL HOW WORD FILES AND DIRECTORIES ARE DISTRIBUTED IN A NETWORK ENVIRONMENT - ON A SERVER, AT A SINGLE-USER WORKSTATION, AND AT A SHARED-VERSION WORKSTATION.

Комплект шрифта - это совокупность всех строчных и прописных букв, цифр и пунктуационных знаков, имеющих одинаковый размер и начертание (рис. 18.13). Шрифты могут быть прямыми и курсивными. К прямому шрифту относятся буквы прямой формы в отличие от курсивного шрифта, в котором буквы имеют наклонную форму. Латиница (Roman) обозначает группу шрифтов, имеющих засечки.

Семейства шрифтов объединяют два и более вида шрифтов, представляющих собой различные варианты шрифта, имеющие одинаковое начертание (рис. 18.14). Тем не менее каждый вид сохраняет неотъемлемые характеристики основной формы букв. Варианты могут включать курсив, узкий (thin), светлый, полужирный (semibold), жирный, средний (medium), узкий (condensed), широкий, контурный и другие виды шрифта. В некоторых семействах представлены только некоторые из этих вариантов, в то время как другие семейства предлагают больший

Рис. 18.13. Примеры двух вариантов начертания шрифта "Bookman", нормального и жирного

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

Размер шрифта

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

Пункт

Пункт (пт) используется для измерения размера шрифта (высоты букв). В одном дюйме (2,54 см) 72 пункта (0,351 мм). Полезно знать, что высота шрифта размером 36 пунктов составляет примерно полдюйма, а шрифта размером 18 пунктов - примерно 1/4 дюйма. На рис. 18.15 поясняются основные термины, используемые для обозначения высоты шрифта. Размер шрифта может составлять от 6 до 120 пунктов. Размер шрифта основного текста обычно находится в диапазоне от 6 до 14 пунктов. Для большинства изданий используются шрифты размером 9,10 или 11 пунктов. Шрифты, размер которых превышает 14 пунктов, называются выделительными шрифтами или шрифтами заголовка. Однако эти размеры - всего лишь условность: как правило, размер шрифта основного текста газетной рекламы составляет примерно 18 пунктов, кроме того, встречаются рекламные обращения, в которых размер заголовка примерно равен размеру основного текста. Рисунок 18.16 дает наглядное представление об основных размерах шрифта.

Наряду с измерением высоты шрифта пункты используются для измерения интервала между строками, линиями и кромками.

Как уже говорилось ранее, размер шрифта измеряется в пунктах. Она учитывается по размеру заглавных букв каждой гарнитуры. Вот поэтому разные шрифты одного размера выглядят неодинаково. Для большинства документов используется размер 12 пунктов, а для рефератов, курсовых и дипломных работ – 14 пунктов.

Диапазон размеров шрифта – от 1 пт до 1638 пт.

При этом 1 пункт (1/72 дюйма) = 1 мм.

Чтобы изменить размер уже набранного текста, его необходимо предварительно выделить.

Курсор ввода текста, стоящий перед словом или после него, не влияет на изменения этого слова!

Чтобы установить нужный размер шрифта, воспользуйтесь одним из способов, приведенных ниже.

1способ:

1 В окне открытого документа выделяем нужный текст и используем сочетание клавиш Ctrl+Shift+P.

2 В окне «Шрифт» на вкладке «Шрифт» в графе «Размер» задаем нужное значение шрифта. Кстати, после активации окна окошко размера уже выделено для ввода значения.

3 Закрываем окно кнопкой «ОК».

2 способ:

2 В группе «Шрифт» открываем окошко размера шрифта (рис. 3.14) и в списке значение выбираем нужное.

3 Или же, щелкнув в самом окошке размера, вручную набираем нужное значение, а затем закрепляем его нажатием клавиши Enter.

Примечание. Так можно задать любой размер шрифта, даже если его нет в списке размеров.

3 способ:

3 В автоматически всплывшей панели в окошке «Размер» открываем список размеров и выбираем нужный.

4 способ:

1 В окне открытого документа выделяем нужный фрагмент текста.

2 В окне открытого документа переходим к вкладке «Главная».


В группе «Шрифт» для увеличения размера щелкаем по кнопке «Увеличить размер» (рис. 3.15), а для уменьшения – по кнопке «Уменьшить размер».

Примечание. Щелкаем по данным кнопкам, пока не будет достигнут нужный размер.

1 В окне открытого документа выделяем нужный фрагмент текста.

2 Используем сочетание клавиш:

Ctrl+Shift+) – для увеличения размера шрифта.

Ctrl+Shift+(– для уменьшения размера шрифта.

Как сделать шрифт жирным?

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

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

Чтобы задать жирное начертание шрифта, воспользуйтесь одним из способов, приведенных ниже.

1 способ: в окне открытого документа выделяем нужный текст и используем сочетание клавиш Ctrl+B.

2способ:

1 В окне открытого документа выделяем нужный текст и переходим к вкладке «Главная».


В группе «Шрифт» щелкаем по кнопке «Ж» (рис. 3.16).

3 способ:

1 В окне открытого документа выделяем нужный фрагмент текста.

2 Наводим курсор на данное выделение.

3 Во всплывшей панели щелкаем по кнопке «Ж».


Похожая информация:

  1. III. Методика измерений и расчетные формулы. Деформация - это изменение формы и/или размеров тела без изменения массы под действием внешней силы

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

Давайте разбираться.

А то знаний маловато!

Физика и лирика

Когда–то давным–давно буквы отливались на металических или деревянных брусках, и их размеры были довольно статичными. Высота литерной площадки называлась кеглем, а измеряли ее в пунктах (в СНГ 1 пункт равен 0,376 мм).

Литера с лигатурой ſi. 12-й кегль, шрифт Клода Гарамона

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

Тут тебе и сантиметры, и дюймы и все те же пункты.

Полиграфическая линейка.

Однако, когда дело касается цифровой среды, на арену выходят виртуальные величины измерения.

Размер шрифта в векторе

Как правило, цифровые шрифты являются векторными, и все их метрики задаются в некоторых условных единицах, не имеющих размерности.

Основные метрики шрифта «Новая Гельветика Тонкая» в окне настроек шрифтового редактора «Фонтлаб 5».

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

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

Глиф G из шрифта «Новая Гельветика Тонкая» в окне глифа программы «Фонтлаб 5».

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

Окно настроек шрифта в редакторе «Фонтлаб 5». Обратите внимание, что параметр UPM является глобальным и влияет на все глифы в шрифте.

UPM (Units Per Em) - это количество условных единиц на кегельную (литерную) площадку.

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

Другими словами, UPM - это плотность тех самых единиц, в которых измеряются различные метрики векторного шрифта: размеры глифов, их полуапрошей, отступов для кернинговых пар и другие.

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

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

Прямо на процесс создания или хранения векторных шрифтов параметр UPM не влияет. Он становится важен только тогда, когда шрифт попадает в конкретную систему координат.

Например, в окно тестирования/предпросмотра шрифта или в Фотошоп.

Размер шрифта в Фотошопе

О, как обманчивы могут быть привычные вещи! Многие дизайнеры и простые обыватели годами работают в Фотошопе, но так никогда и не задумывались, а как измеряется шрифт в этой программе.

Чтобы понять, что происходит с векторными метриками шрифта в Фотошопе, давайте разберемся, а что же означают пиксели в параметре «размер шрифта»?

Окно настройки шрифта в программе Адобе Фотошоп.

Когда вы выбираете размер шрифта, например, в «16 px», на самом деле вы устанавливаете это значение для параметра PPM.

PPM (Pixels Per Em) - это количество пикселей на кегельную площадку.

Другими словами, это плотность все той же условной кегельной площадки, но в пикселях.

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

Шрифт Helvetica, PPM = 16 пикселей, сглаживание в режиме Strong. Высота прописных букв равна 12 пикселям, а строчных - 9 пикселей.

Так что же в действительности изменяет параметр «размер шрифта»? Вы уже догадались? Молодцы, совершенно верно.

Коэффициент масштабирования

Изменяя «размер шрифта» в Фотошопе, мы, ни много ни мало, изменяем коэффициент масштабирования при переносе условных единиц из безразмерного мира векторов в мир размерных пикселей. Он служит «мостиком» при переходе условных векторных метрик в пиксели.

Происходит это следующим образом.

Как вы уже поняли, величины UPM и PPM связаны между собой элементом «M», общим множителем - неопределенным размером условной кегельной площадкой. Отсюда получаем простую формулу:

Х у.е. в 1 пикселе = UPM / PPM

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

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

Живой пример

В процессе создания шрифта «5 копеек » (5 Cent Regular), было важно добиться абсолютной четкости линий при «размере шрифта» (PPM) в 5 пикселей в Фотошопе или в любой другой программе.

Шрифт «5 Cent Regular» - это, пожалуй, самые большие «5 копеек» в дело пиксельной типографики

Это требование предполагало точное попадание в пиксель - размеры и метрики в итоговом рендеринге должны были ровняться целому числу пикселей. А именно, исходя из минимально возможных значений, толщина линий при заданном PPM должна быть ровна одному пикселю.

Значение UPM для шрифта предполагалось стандартное, в 1000 единиц.

Дано:

PPM в Фотошопе = 5 пикселей
UPM шрифта = 1000 у.е.

Задача : Найти количество Х у.е. для рендеринга в 1 пиксель.

Решение:

X у.е. в 1 пикселе = UPM / PPM = 1000 / 5 = 200.

Ответ: 200 у.е.

Таким образом все линии, отступы и даже кернинг в шрифте были сделаны со значениями, кратными 200 у.е.

Все по 200!

Вывод о пользе

Понимая значение метрик PPM и UPM, а также формулу зависимости между ними, можно с требуемой точностью управлять метриками при разработке цифрового шрифта.