ݺߣ

ݺߣShare a Scribd company logo
Основные понятия типографики
для веб–дизайнера
Часть 1-я: восприятие шрифта
skillupdesign.ru | Herman K. Tishkin
Восприятие (часть 1-я)
 Кегль
 Строчные, прописные, капитель,
моноширинный шрифт;
 Апрош, трекинг, интерлиньяж, кернинг;
 Курсив (italic), толщина (weight);
 Гарнитура;
 Антиква (serif), рубленный (sans-serif),
гротеск;
 Контраст;
 Дефис, минус, короткое и длинное тире;
 Кавычки.
Композиция (часть 2-я)
 Сетка;
 Ритмическая структура;
 Внешние и внутренние поля;
 Длина строки;
 Правила переноса;
 Висячие строки и предлоги.
Основные направления
skillupdesign.ru | Herman K. Tishkin
Восприятие > Кегль
Кегль (point size) — по сути это размер шрифта в рамках кегельной площадки.
В компьютерном наборе она приблизительно равна сумме высот строчных букв, верхних и
нижних выносных элементов. А высота строчных составляет в среднем половину высоты
кегельной площадки.
Кегль измеряется в пунктах.
skillupdesign.ru | Herman K. Tishkin
Восприятие > Строчные, прописные, капитель, моноширинный шрифт
1. Строчные (lowercase) — в просторечии «маленькие» буквы, принятые для набора
сплошного текста;
2. Прописные / заглавные (uppercase) — в просторечии «большие» буквы, они выше
строчных и отличаются от них по рисунку;
3. Капитель (small caps) — буквы чуть выше строчных, но с рисунком прописных (в
качестве капители нельзя использовать прописные меньшего кегля, т.к. они
заметно отличаются по насыщенности, контрасту и ширине);
4. Моноширинный шрифт (monospaced face) — шрифт, у которого все кегельные
площадки одной ширины. Разрабатывались для пишущих машинок. В
графдизайне используется для создания определённой стилистики.
skillupdesign.ru | Herman K. Tishkin
Восприятие > Апрош, трекинг, интерлиньяж, кернинг
1. Апро́ш (letterspace) — расстояние между соседними буквами
или другими шрифтовыми знаками. Апрош составляется
из 2-х полуапрошей соседних букв;
2. Трекинг (tracking) — процесс глобального изменения межбуквенных интервалов в
куске текста называют трекингом. Положительный трекинг называется разрядкой.
skillupdesign.ru | Herman K. Tishkin
Восприятие > Апрош, трекинг, кернинг, интерлиньяж
3. Кернинг (letterspace) — избирательное изменение интервала
между буквами в зависимости от их формы;
4. Интерлиньяж (leading) — расстояние между базовыми линиями соседних строк.
Базовый интерлиньяж равен кеглю, т.е. расстояние между базовыми линиями при таком
интерлиньяже равно кегельной площадке. Интерлиньяж определяют, исходя из кегля
шрифта, длины строки и сетки страницы.
skillupdesign.ru | Herman K. Tishkin
Восприятие > Курсив, насыщенность и контраст шрифта
1. Курсив (italic) — рисунок шрифта как правило наклонный вправо, более близкий к
рукописному. Одно из главных средств выделения в тексте. Не следует путать с
наклонным начертанием шрифта, в котором не меняется рисунок знаков.
2. Насыщенность шрифта (weight) — отношение толщины основного шрифта к высоте
буквы.
Изменения этого отношения образуют сверхсветлое (Ultra Light, Extra Light,
Thin), Светлое (Light), нормальное (Book, Regular, Roman), Полужирное
(Medium Demi Bold, Semibold), Жирное (Bold, Heavy), сверхжирное (Extra Bold,
Black, Ultra Bold) начертания.
skillupdesign.ru | Herman K. Tishkin
Восприятие > Курсив, насыщенность и контраст шрифта
3. Контраст шрифта (contrast) — соотношение толщин основного и соединительного
штрихов.
По контрасту шрифт может быть:
a) неконтрастным (monoweight) — если основные и соединительные штрихи
визуально одинаковые;
b) малоконтрастным (low contrast) — если соотношение толщины основных и
соединительных штрихов меньше чем 2:1;
c) контрастным (contrast) — если соотношение больше;
d) сверхконтрастным (high contrast) — если соединительные штрихи в шрифте
ощутимо толще основных, это явление называют обратным контрастом, а шрифт
— итальянским.
skillupdesign.ru | Herman K. Tishkin
Восприятие > Антиква, рубленый (гротеск) шрифт
1. Анти́ква (serif) — контрастный шрифт с засечками.
2. Гроте́ск, ру́бленый шрифт (sans–serif) — шрифт без засечек,
как правило, неконтрастный.
skillupdesign.ru | Herman K. Tishkin
Восприятие > Дефис, минус, короткое и длинное тире
1. Дефис (hyphen) — короткая горизонтальная чёрточка. Служит для связи частей слов
(кто-либо), для присоединения префиксов (во-первых, по-русски), в качестве знака
сокращения (физ-ра, г-ца), а также в качестве знака переноса.
Дефис ничем не отбивается от соседних знаков.
2. Короткое тире (en-dash) — можно поставить между цифрами, например: 20–50.
Оно не отбивается от предыдущего и последующего знака.
Комбинация клавиш: Alt+0151 (в Windows) и Alt+Shift+hyphen (в Mac OS).
3. Длинное тире (em-dash) — это и есть настоящее тире, к которому мы привыкли.
Вместо него обычно набирают дефис с пробелами вокруг.
Комбинация клавиш: Alt+0150
(в Windows) и Alt+hyphen (в Mac OS).
skillupdesign.ru | Herman K. Tishkin
Восприятие > Кавычки
Кавычки (quotes) — в первую очередь следует запомнить, что вот это «"» не кавычки, а
диагональ, например: 17 ". В кириллице принято использовать:
a. «ёлочки», которые набираются так:
 Alt+0171 для « (в Windows)
 Alt+0187 для » (в Windows)
 Alt+: и Shift+Alt+: для « (в латинице на Маке)
 Alt+= и Shift+Alt+= для » (в кириллице на Маке)
b. „лапки“ набираются так:
 Alt+0132 для „ (в Windows)
 Alt+0147 для “ (в Windows)
 Shift+Alt+W и Shift+Alt+/ для „ (в латинице на Маке)
 Alt+[ и Alt+/ для “ (в кириллице на Маке) skillupdesign.ru | Herman K. Tishkin
Используемые источники:
 Википедия;
 «Живая типографика» Александры Корольковой;
 Советы из Ководства Артемия Лебедева.
skillupdesign.ru | Herman K. Tishkin
Спасибо за внимание!
Herman K. Tishkin
+7 (916) 160–45–45
gershmit@gmail.com
http://skillupdesign.ru

More Related Content

Основные понятия типографики для веб–дизайнера (Часть 1-я)

  • 1. Основные понятия типографики для веб–дизайнера Часть 1-я: восприятие шрифта skillupdesign.ru | Herman K. Tishkin
  • 2. Восприятие (часть 1-я)  Кегль  Строчные, прописные, капитель, моноширинный шрифт;  Апрош, трекинг, интерлиньяж, кернинг;  Курсив (italic), толщина (weight);  Гарнитура;  Антиква (serif), рубленный (sans-serif), гротеск;  Контраст;  Дефис, минус, короткое и длинное тире;  Кавычки. Композиция (часть 2-я)  Сетка;  Ритмическая структура;  Внешние и внутренние поля;  Длина строки;  Правила переноса;  Висячие строки и предлоги. Основные направления skillupdesign.ru | Herman K. Tishkin
  • 3. Восприятие > Кегль Кегль (point size) — по сути это размер шрифта в рамках кегельной площадки. В компьютерном наборе она приблизительно равна сумме высот строчных букв, верхних и нижних выносных элементов. А высота строчных составляет в среднем половину высоты кегельной площадки. Кегль измеряется в пунктах. skillupdesign.ru | Herman K. Tishkin
  • 4. Восприятие > Строчные, прописные, капитель, моноширинный шрифт 1. Строчные (lowercase) — в просторечии «маленькие» буквы, принятые для набора сплошного текста; 2. Прописные / заглавные (uppercase) — в просторечии «большие» буквы, они выше строчных и отличаются от них по рисунку; 3. Капитель (small caps) — буквы чуть выше строчных, но с рисунком прописных (в качестве капители нельзя использовать прописные меньшего кегля, т.к. они заметно отличаются по насыщенности, контрасту и ширине); 4. Моноширинный шрифт (monospaced face) — шрифт, у которого все кегельные площадки одной ширины. Разрабатывались для пишущих машинок. В графдизайне используется для создания определённой стилистики. skillupdesign.ru | Herman K. Tishkin
  • 5. Восприятие > Апрош, трекинг, интерлиньяж, кернинг 1. Апро́ш (letterspace) — расстояние между соседними буквами или другими шрифтовыми знаками. Апрош составляется из 2-х полуапрошей соседних букв; 2. Трекинг (tracking) — процесс глобального изменения межбуквенных интервалов в куске текста называют трекингом. Положительный трекинг называется разрядкой. skillupdesign.ru | Herman K. Tishkin
  • 6. Восприятие > Апрош, трекинг, кернинг, интерлиньяж 3. Кернинг (letterspace) — избирательное изменение интервала между буквами в зависимости от их формы; 4. Интерлиньяж (leading) — расстояние между базовыми линиями соседних строк. Базовый интерлиньяж равен кеглю, т.е. расстояние между базовыми линиями при таком интерлиньяже равно кегельной площадке. Интерлиньяж определяют, исходя из кегля шрифта, длины строки и сетки страницы. skillupdesign.ru | Herman K. Tishkin
  • 7. Восприятие > Курсив, насыщенность и контраст шрифта 1. Курсив (italic) — рисунок шрифта как правило наклонный вправо, более близкий к рукописному. Одно из главных средств выделения в тексте. Не следует путать с наклонным начертанием шрифта, в котором не меняется рисунок знаков. 2. Насыщенность шрифта (weight) — отношение толщины основного шрифта к высоте буквы. Изменения этого отношения образуют сверхсветлое (Ultra Light, Extra Light, Thin), Светлое (Light), нормальное (Book, Regular, Roman), Полужирное (Medium Demi Bold, Semibold), Жирное (Bold, Heavy), сверхжирное (Extra Bold, Black, Ultra Bold) начертания. skillupdesign.ru | Herman K. Tishkin
  • 8. Восприятие > Курсив, насыщенность и контраст шрифта 3. Контраст шрифта (contrast) — соотношение толщин основного и соединительного штрихов. По контрасту шрифт может быть: a) неконтрастным (monoweight) — если основные и соединительные штрихи визуально одинаковые; b) малоконтрастным (low contrast) — если соотношение толщины основных и соединительных штрихов меньше чем 2:1; c) контрастным (contrast) — если соотношение больше; d) сверхконтрастным (high contrast) — если соединительные штрихи в шрифте ощутимо толще основных, это явление называют обратным контрастом, а шрифт — итальянским. skillupdesign.ru | Herman K. Tishkin
  • 9. Восприятие > Антиква, рубленый (гротеск) шрифт 1. Анти́ква (serif) — контрастный шрифт с засечками. 2. Гроте́ск, ру́бленый шрифт (sans–serif) — шрифт без засечек, как правило, неконтрастный. skillupdesign.ru | Herman K. Tishkin
  • 10. Восприятие > Дефис, минус, короткое и длинное тире 1. Дефис (hyphen) — короткая горизонтальная чёрточка. Служит для связи частей слов (кто-либо), для присоединения префиксов (во-первых, по-русски), в качестве знака сокращения (физ-ра, г-ца), а также в качестве знака переноса. Дефис ничем не отбивается от соседних знаков. 2. Короткое тире (en-dash) — можно поставить между цифрами, например: 20–50. Оно не отбивается от предыдущего и последующего знака. Комбинация клавиш: Alt+0151 (в Windows) и Alt+Shift+hyphen (в Mac OS). 3. Длинное тире (em-dash) — это и есть настоящее тире, к которому мы привыкли. Вместо него обычно набирают дефис с пробелами вокруг. Комбинация клавиш: Alt+0150 (в Windows) и Alt+hyphen (в Mac OS). skillupdesign.ru | Herman K. Tishkin
  • 11. Восприятие > Кавычки Кавычки (quotes) — в первую очередь следует запомнить, что вот это «"» не кавычки, а диагональ, например: 17 ". В кириллице принято использовать: a. «ёлочки», которые набираются так:  Alt+0171 для « (в Windows)  Alt+0187 для » (в Windows)  Alt+: и Shift+Alt+: для « (в латинице на Маке)  Alt+= и Shift+Alt+= для » (в кириллице на Маке) b. „лапки“ набираются так:  Alt+0132 для „ (в Windows)  Alt+0147 для “ (в Windows)  Shift+Alt+W и Shift+Alt+/ для „ (в латинице на Маке)  Alt+[ и Alt+/ для “ (в кириллице на Маке) skillupdesign.ru | Herman K. Tishkin
  • 12. Используемые источники:  Википедия;  «Живая типографика» Александры Корольковой;  Советы из Ководства Артемия Лебедева. skillupdesign.ru | Herman K. Tishkin
  • 13. Спасибо за внимание! Herman K. Tishkin +7 (916) 160–45–45 gershmit@gmail.com http://skillupdesign.ru