Если вы не дизайнер и не верстальщик, то вам пригодится небольшой ликбез по основным типографическим терминам, которые могут означать совсем не то, что вы думали.
1. Гарнитура.
Большая итальянская семья
Гарнитуру часто путают со шрифтом, но это не одно и то же. Дабы понять разницу между ними, непосвященному в тонкости типографики читателю рекомендуем запомнить простую ассоциацию из детства: гарнитур. В смысле «набор мебели», где ключевое слово — «набор». Гарнитура — это набор группы шрифтов; семья шрифтов с общими стилистическими особенностями.
Строчные буквы не допускаются в текстовых сообщениях. Пример шаблона массива символов в переменном текстовом массиве. 
Кернинг Кернинг - это термин, который определяет изменение пространства между двумя конкретными буквами; следовательно, термин кернинг-пара. Чаще всего кернинг уменьшает свет между буквами, но иногда он ответственен за увеличение интервала. Керн-пары создаются, чтобы отрегулировать интервал между двумя буквами, когда стандартный индикатор неправильный. Кернинг, введенный для такой пары букв, определяет расстояние, дающее желаемое оптическое впечатление.
Классификаций гарнитур множество, самая общая — антиква, гротески, рукописные, акцидентные и тд. Существует великое множество гарнитур, обладающих собственным именем, произошедшим от эпохи создания (Таймс), от имени создателя (Гарамон), национальной принадлежности (Голландер) или какой-то технической особенности (Компакт). Фактически, это фамилия семьи.
Большинство шрифтов имеют от двухсот пятисот конкретных пар кернинга. У шрифта высокого качества может быть более тысячи. Вы можете задаться вопросом, где есть рациональная граница для добавления новых пар кернинга. Является хорошим шрифтом, который имеет тысячи пар кернинга для теоретически несмежных символов или один, интервалы которого были разработаны так немедленно, что интерференция кернинга минимальна? Это зависит, конечно, от характера самого скрипта. Очевидно, что моноширинные палочки не имеют кернинга, а «бисерные» орлы могут нуждаться в сложном и сложном управлении на разных площадках.
2. Шрифт.
Буква с характером
Шрифт — набор символов, составляющих единую стилистическую и композиционную систему. Если говорить проще, то разнообразные вариации с высотой, толщиной, наклоном, размером и расстоянием между буквами на тему одной и той же гарнитуры и есть шрифт. Соответственно, группа шрифтов разных видов и размеров, имеющих одинаковое начертание и стиль — это гарнитура. Если название гарнитуры — это фамилия семьи, то название шрифта — это имя каждого ее отдельного члена.
Мои шрифты нуждаются в помощи! Если у нас есть любимый шрифт, но интервал и кернинг в нем оставляют желать лучшего, мы не в безнадежной ситуации - мы можем что-то с этим поделать. Сегодняшние универсальные издательские программы имеют расширенные инструменты управления шрифтами, которые позволяют улучшить внешний вид вашей композиции даже при установленном «новом» шрифте.
Кернинг Цель кернинга - изменить интервал между двумя символами, которые кажутся слишком близкими или слишком далеко друг от друга. Большинство программ редактирования текста, в отличие от программ для профессиональных композиций и программ дизайна, не включают в себя наличие пар кернинга. Если наша цель - выглядеть профессионально в типографическом составе, нам нужно инвестировать в одну из самых сложных композиций и программ по разрыву. Каждая программа серьезных композиций обеспечивает возможность вручную изменять кернинг между парами букв в данном документе.
3. Кегль.
Размер имеет значение
Кегль — это не какая-то там кегля. Кегль в типографике — это всего лишь размер высоты буквы. От самой высоко выступающей палочки и плечика до самой низко свисающей закорючки и хвостика. 
Часто для этой функции используются сочетания клавиш, которые помогут вам внести ряд исправлений. Как правило, изменения кернинга применяются только к паре писем, которые были выбраны вместо файла шрифта. Чтобы получить унифицированный документ, вам нужно повторить операцию модификации кернинга, выполнив поиск всех экземпляров этой пары. Это особенно важно в названиях, где различия очевидны. Из-за трудоемкости такого решения ручное кернирование больших блоков текста должно быть сведено к минимуму.
Обучение правильному определению интервала и кернинга для шрифтов требует времени, терпения и опытного взгляда. Хорошим правилом в начале является правило «чем меньше, тем лучше». Будьте консервативны, если мы уже не знаем, что действительно важно. Люди сами понимают, что они постоянно ищут идеальные решения.
4. Интерлиньяж.
Читайте между строк
Красивое французское слово «интерлинья́ж» (от фр. interligne), похожее на конфеты «грильяж», переводится дословно как «написанное между строк» и означает расстояние между двумя строками. Обычно принято устанавливать интерлиньяж на 1/5 часть больше кегля — так, при наборе 10-м кеглем интерлиньяж составляет 12 пунктов. В художественных целях интерлиньяж может быть увеличен или уменьшен, но поскольку от него зависит читаемость текста, то небольшой интерлиньяж применяется нечасто — максимум, в заголовках.
Совместить шрифты
Аналогичная ситуация относится и к веб-типографии.
Укажите разумный размер текста
За последние годы резолюция наблюдателей резко возросла. Поэтому не бойтесь давать правильный размер шрифтам, используемым в основном тексте на странице, - абсолютный минимум составляет 12 пикселей, но рекомендуется использовать шрифты размером 13 или даже 14 пикселей.Сделайте больше света между линиями
Интерлайн - это пробел между строками текста.
Добавить интервал между абзацами текста
Чтобы было легко воспринимать текст на экране, он должен быть так же разделен, как и меньшие, согласованные элементы. Количество строк в строке и выравнивание текста. Избегайте пожара текста, заполняющего всю ширину монитора. Слишком длинные стихи - это риск потерять текст, который вы читаете.
5. Кернинг.
Профессиональный сводник
Кернинг (англ. kerning) — это интервал между двумя буквами в зависимости от их формы. Например, если в заголовке или логотипе рядом находятся две буквы со сложным характером — с сильно выступающими элементами, образующие слишком большое расстояние между ними, то рационально их немного сблизить, чтобы визуальная плотность была равномерной. Кернинг предусматривает, что в программу верстки заложен автоподбор расстояния между конкретными парами букв, как например AV, TA. Кернинг бывает как положительным (когда знаки раздвигаются), так и отрицательным, если знаки приближаются друг к другу.
Обеспечьте соответствующий контраст между цветом текста и цветом фона
Отрегулируйте ширину контейнера, содержащего текст, чтобы получить число, близкое к тому, которое вы указали. Ни при каких обстоятельствах текст не может быть объединен с фоном, на котором он был помещен! Цвет фона должен быть «нейтральным» для глаз, не должен утомлять их.
Воздержитесь от основных моментов, особенно в ссылках
Не помещайте текст на фоне повторяющегося изображения агрессивного цвета. Примеры оптимальных цветовых комбинаций. Определения ссылок по умолчанию портят визуальную согласованность текста, поскольку горизонтальные дефисы пересекаются с строчными буквами.
6. Трекинг.
Извини, подвинься.
Трекинг (от англ. tracking) — родной брат кернинга; но если кернинг сводит между собой определенные пары букв, то трекинг отвечает за дистанцию между буквами в целых строках, предложениях и абзацах. Трекинг — это изменение межбуквенных пробелов с определенной целью: сделать текст более разреженным и светлым, или более плотным и темным. Еще трекинг используется при верстке, чтобы увеличить или уменьшить количество строк, дабы избавиться от висячих предлогов, слов и строк. Хорошим тоном является числовое значение трекинга, не превышающее +/- 25.
Избегайте преувеличения в использовании курсива и жирного
Чрезмерная смелость и курсив означают, что текстовые столбцы теряют единый серый цвет для неравномерно распределенных темных и ярких фрагментов. Это негативно сказывается на простоте ввода текста, потому что наши глаза сначала подсознательно следуют выдержкам из отрывков, «отрывающих» от оптимальной линии считывания. Если вы хотите акцентировать слово или прописку, подумайте над такими заглавными буквами.
Помните основные правила пунктуации и орфографии
Конечно, вам не нужно отказываться от смелости и курсива - но лучше использовать это для акцента на одиночные слова, а не целые предложения. Вместо двойных кавычек используйте кавычки. . «Из приятной миски вы ее не понимаете» - это не все выглядит. Только интересный и существенный текст близок к идеалу.
7. Висячая строка.
Одинокий отщепенец
Висячая строка — это строка, которая оторвана от своего абзаца и «висит» в одиночестве на предыдущей или последующей странице. Дизайнерам и верстальщикам, стремящимся в прямоугольному совершенству полосы, она режет глаз и оскорбляет чувство прекрасного; кроме того, это ухудшает восприятие печатного текста. Висячай строка — отщепенец в типографском обществе и вышеупомянутый трекинг как раз-таки всячески с этим отщепенством борется.
Обычно используются шрифт-стиль, шрифт-вес, выравнивание текста, текстовое оформление, отступ текста и высота строки. Более экзотичными являются шрифт-вариант, текстовое преобразование, интервал между буквами, интервал между словами и пробел. Размер шрифта: 140%; высота линии: 200%.
Сокращенное имя должно быть последним. Следующий пример неверен. Спецификация семейства шрифтов. Самый надежный метод - ограничить шрифты, используемые для набора, указанного в таблице. Заменяя шрифты, мы предоставляем один шрифт для каждой платформы и добавляем в конце общее семейство шрифтов.
8. Графема.
Бит информации
Графема (от греч: γράφω — пишу) — это единица письменной речи. Проще говоря — буква, если письменность строится на алфавите, или иероглиф/слоговый знак — в неалфавитных системах письма типа японской. Графема — уникальный паззл, из которого построен алфавит. Вы никогда не спутаете графему буквы «А» с графемой буквы «Б» — ну кроме тех случаев, конечно, когда они написаны неразборчивым «почерком врача».
Шрифт-семья: Грузия, Палатино, Таймс, засечка. Доступные значения можно разделить на пять групп. Ключевые слова: более мелкие. . Используя эти единицы, вы можете написать. Лучший способ указать размер текста - это уже упомянутая техника Дэн Сидерхольма.
Размер текста по умолчанию на странице фиксируется в описании абсолютных единиц элемента тела в виде ключевых слов, размер текста отдельных элементов фиксируется в процентах. Ни один не подчеркивает сквозную линию. Обычно используются единицы. Использовать прописную букву в нижнем регистре.
9. Глиф.
Знаковая вещь
Если графема — это буква, то глиф — ее написание.
Еще глиф — это специальный символ, которого может не быть на клавиатуре. Например, разной длины тире или буквы-звуки, которые не предусмотрены на клавиатуре для тех, кто не знает шот-каты или вообще даже те, для которых шот-каты для не предусмотрены.
Сохранение пробелов в текстовых и оберточных линиях. Обычная предварительная предварительная упаковка. Эта документация была заархивирована и больше не поддерживается. Важным элементом любой веб-страницы является соответствующий выбор стилей для шрифта. Именно выбор шрифтов, цветов и украшений чаще всего влияет на то, будет ли посетитель нашего веб-сайта чувствовать, что ему нравится читать текст на нем. Поэтому в этой статье мы сосредоточимся на широкой теме форматирования текстовых свойств в каскадных таблицах стилей.
После прочтения этой статьи вы будете. Он знал, как влиять на внешний вид шрифта, он может изменять свойства текстовых блоков, он знал, как сделать текст более привлекательным. Все атрибуты в этом семействе имеют такой префикс и позволяют редактировать шрифт - его размер, тип и т.д.
10. Строчные буквы.
Дети
Строчные буквы — это обычные маленькие буквы в строке, которыми мы пишем все, кроме собственных имен, имен наших друзей и прочих Имен Собственных. Например, буква «а» — строчная, а «А» — заглавная (прописная). Строчные буквы используются в некоторых европейских алфавитах (греческом, латинском, кириллице и армянском), в некоторых алфавитах (в грузинском, иврите) разделения на прописные и строчные буквы нет вообще.
Другим семейством атрибутов является набор текстовых свойств в виде блока или выравнивание и интервал между символами. Давайте теперь посмотрим на атрибуты, связанные с редактированием шрифта. Он позволяет указать семейство шрифтов для отображения текста. Обратите внимание, однако, что эффект зависит от того, находится ли этот шрифт на вашем компьютере. Если его нет, эффект отображения на его компьютере может сильно отличаться от того, что мы намеревались. Чтобы предотвратить неожиданности, шрифт часто используется для указания нескольких семейств шрифтов, так что, если один из них не найден на конечном компьютере, следующий семейный шрифт выбирается по порядку.
11. Прописные буквы.
Взрослые
Если строчные буквы — это детвора, то прописные буквы — это взрослые, с которых, например, начинаются предложения. Часто такая взрослая буква обладает другой графемой, то есть, как и положено взрослым, выглядит немного по-другому. Очень большая и очень расфуфыренная первая буква в начале текста называется «буквица» (или «инициал»).
Просто дайте ему типографский тип: засечка означает шрифт с засечками, курсив - курсив, моноширинный - шрифт с одинаковой шириной символов и т.д. У нас также есть ключевые слова, определяющие высоту шрифта. Два дополнительных ключевых слова определяют его по отношению к родительскому шрифту: меньшее означает меньший шрифт, больший - больший. Этот атрибут определяет стиль шрифта.
Вес слова от английского веса. С точки зрения шрифтов, вы можете контролировать толщину линий, в которых написаны буквы. Автономный атрибут шрифта может использоваться для определения более одного свойства в строке. Мы не должны давать все свойства каждый раз. Мы можем дать вам 2-3 варианта, но мы должны помнить о том, чтобы поддерживать порядок и быть рядом друг с другом. Например, если вы хотите определить шрифт и стиль шрифта, вы всегда должны указывать между ними вариант шрифта.
12. Капитель.
Подростки
Капитель - это вариант прописных букв уменьшенного роста и чуть расширенных пропорций, несколько выше роста строчных. Если строчные буквы — это дети, а прописные — это взрослые, то «капитель» — это подростки: немного уменьшенная в размерах копия «взрослых» прописных букв. Капитель часто используется для заголовков — чтобы разнообразить типографику, если в работе участвует всего одна гарнитура.
Он также позволяет редактировать его свойства, такие как выравнивание всего блока текста, изменение межстрочного интервала и многое другое. Мы посмотрим на них прямо сейчас. Первый, очень простой и часто используемый атрибут - цвет. Это позволяет вам изменить цвет шрифта.
Это атрибут, отвечающий за выравнивание текста. Обоснование называется протяжением каждой строки текста, так что все имеют одинаковую длину. Этот тип выравнивания используется, например, в книгах. Он также наиболее часто используется для удаления подчеркивания из ссылок на код. Слово «нет» означает просто отсутствие украшения. Кроме того, текстовое оформление можно использовать четырьмя способами. Наряду с надстрочными значениями строки будут отображаться над текстом, строка - текст пересекается с горизонтальной линией, подчеркивание - текст подчеркивается и мигает - мигает текст.
13. Выключка.
Равнение налево!
Выключка — это ни что иное, как выравнивание текста; способ расположения неполной строки относительно вертикальных границ полосы набора. Выключка бывает влево, вправо, по центру и по формату (то есть по ширине).
К сожалению, последний атрибут не поддерживается большинством браузеров, поэтому его не рекомендуется использовать. С текстовым преобразованием мы можем повлиять на случай заданного текста. Принимая этот атрибут, значение в верхнем регистре позволяет вам изменить все буквы в верхнем, нижнем регистре для прописной буквы и заглавные буквы изменяет текст так, чтобы каждая первая буква слова была большой, а другая в нижнем регистре.
Это очень простой атрибут, который принимает только числовое значение отступа первой строки. С высотой строки мы можем изменить высоту текстовой строки. Этот атрибут позволяет изменить расстояние между символами. Он также принимает отрицательные значения, которые заставляют буквы перекрываться.
14. Леттеринг.
Модное увлечение
Леттеринг (от англ: letter — буква) это графический рисунок начертаний букв и знаков, составляющих единую стилистическую и композиционную систему; проще говоря — созданная шрифтовая композиция. Леттеринг нынче очень в моде: каждый день мы расшариваем огромное количество мотиваторов, выполненных леттерингом. Например, эта:
15. Полоса.
Полезная площадь
Полоса — запечатанная площадь страницы, на которой размещается текст и иллюстрации. Проще простого: страница — это мера счета, нумерации печатных единиц, а полоса — мера печатного объема величиной во всю страницу. Полосу заполняют с той или иной плотностью и регулярностью, так что внутри нее могут быть свои пробельные элементы - воздух, составляющий неотъемлемую принадлежность текста. С этой оговоркой полосу можно считать полезной площадью страницы - в отличие от окружающих ее полей.
Проверить же свои типографические знания вы можете с помощью
Я продолжу писать о разных свойствах, которые позволяют преобразовывать текст. Сегодня мы посмотрим, как прописать в css расстояние между буквами.
Межбуквенный интервал
Сама по себе настройка достаточно специфическая. Согласитесь, что межбуквенный интервал в обычном тексте и так всех устраивает, так зачем его менять? Но зато эта настройка может пригодиться для стилизации:
- Заголовков
- Пунктов списка
- Текста в цитатах и т.д.
Итак, в css за расстояние между буквами отвечает свойство letter-spacing . Его значение записывается любой единицей длины, которую можно применять в css. Но чаще всего задается в пикселах и относительных единицах em. Кроме этого, свойство имеет еще два значения:
- Normal – задает межбуквенный интервал по умолчанию
- Inherit – наследует значение родительского элемента. Если у родителя стоит 5 пикселей, то у дочернего тоже будет так
Letter-spacing в действии
Свойство можно применять для стилизации заголовков и других текстовых элементов. Например, так выглядит название с заданным интервалом в 7 пикселей.
Интервал увеличен до 25 пикселей
А это letter-spacing: -3px . Видите как сжались буквы.
Также его можно использовать совместно с плавными переходами и псевдоклассом:hover. Таким образом, можно достигнуть эффекта плавного сжимания/расширения слов.
Расстояние между словами
Есть еще одно очень похожее свойство, но оно задает расстояние между словами, а не отдельными буквами. Иногда и оно может вам пригодится. Называется word-spacing , а его значение задается аналогично.
Эти css-свойства поддерживаются всеми версиями браузеров, кроме самых-самых старых, которые уже никто давно не использует. Вот таким вот образом можно прописать в css расстояние между буквами и словами. Подписывайтесь на блог, если вам интересны статьи подобной тематики.