Слайд 2
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-1.jpg)
Слайд 3
![Варианты одной гарнитуры:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-2.jpg)
Варианты одной гарнитуры:
Слайд 4
![Разные гарнитуры, совпадающие по внешнему виду:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-3.jpg)
Разные гарнитуры, совпадающие
по внешнему виду:
Слайд 5
![Классификация шрифтов:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-4.jpg)
Слайд 6
![1. Шрифты с засечками (англ. serif):](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-5.jpg)
1. Шрифты с засечками (англ. serif):
Слайд 7
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-6.jpg)
Слайд 8
![1. Шрифты с засечками (англ. serif): Подтипы: А) Old Style](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-7.jpg)
1. Шрифты с засечками (англ. serif):
Подтипы:
А) Old Style («Старый стиль»,
гуманистическая антиква)
Та часть символа, которая расположена
под наклоном, делается тонкой
Использовались еще в 1400-х гг.
(Bookman Old Style)
Слайд 9
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-8.jpg)
Слайд 10
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-9.jpg)
Слайд 11
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-10.jpg)
Слайд 12
![1. Шрифты с засечками (англ. serif): Подтипы: Б) Modern serifs](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-11.jpg)
1. Шрифты с засечками (англ. serif):
Подтипы:
Б) Modern serifs (антиква нового
стиля)
Имеют сильный контраст между толстыми
и тонкими частями символов.
Использовались после 1700-х годов.
(Didot и Bodoni)
Слайд 13
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-12.jpg)
Слайд 14
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-13.jpg)
Слайд 15
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-14.jpg)
Слайд 16
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-15.jpg)
Слайд 17
![1. Шрифты с засечками (англ. serif): Подтипы: В) Transitional serifs](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-16.jpg)
1. Шрифты с засечками (англ. serif):
Подтипы:
В) Transitional serifs (переходная антиква)
Разница
между толстыми и тонкими частями букв более заметна, чем у Old Style,
но менее заметна, чем у Modern.
Использовались в 1700-х годах.
(Times New Roman, Georgia)
Слайд 18
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-17.jpg)
Слайд 19
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-18.jpg)
Слайд 20
![1. Шрифты с засечками (англ. serif): Подтипы: Г) Slab serifs](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-19.jpg)
1. Шрифты с засечками (англ. serif):
Подтипы:
Г) Slab serifs (брусковые шрифты)
Имеют одинаковую толщину всех линий
и крупные засечки на концах.
Слайд 21
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-20.jpg)
Слайд 22
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-21.jpg)
Слайд 23
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-22.jpg)
Слайд 24
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-23.jpg)
Слайд 25
![2. Шрифты без засечек (англ. Sans Serif) (рубленые шрифты)](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-24.jpg)
2. Шрифты без засечек
(англ. Sans Serif) (рубленые шрифты)
Слайд 26
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-25.jpg)
Слайд 27
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-26.jpg)
Слайд 28
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-27.jpg)
Слайд 29
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-28.jpg)
Слайд 30
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-29.jpg)
Слайд 31
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-30.jpg)
Слайд 32
![Times New Roman Arial Book Antiqua Verdana Garamond Century Gothic](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-31.jpg)
Times New Roman Arial
Book Antiqua Verdana
Garamond Century Gothic
Слайд 33
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-32.jpg)
Слайд 34
![2. Шрифты без засечек (рубленые, гротески) (англ. Sans Serif): Подтипы:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-33.jpg)
2. Шрифты без засечек
(рубленые, гротески) (англ. Sans Serif):
Подтипы:
А) Старый гротеск
Похожи на шрифты с засечками,
но без засечек
Слайд 35
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-34.jpg)
Слайд 36
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-35.jpg)
Слайд 37
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-36.jpg)
Слайд 38
![2. Шрифты без засечек (рубленые, гротески) (англ. Sans Serif): Подтипы:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-37.jpg)
2. Шрифты без засечек
(рубленые, гротески) (англ. Sans Serif):
Подтипы:
Б) Новый гротеск
Имеют упрощённый, по сравнению
со старыми гротесками, вид.
(MS Sans Serif, Arial)
Слайд 39
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-38.jpg)
Слайд 40
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-39.jpg)
Слайд 41
![2. Шрифты без засечек (рубленые, гротески) (англ. Sans Serif): Подтипы:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-40.jpg)
2. Шрифты без засечек
(рубленые, гротески) (англ. Sans Serif):
Подтипы:
В) Гуманистический
Более каллиграфичны,
чем все остальные рубленые шрифты (у них изменяется толщина линий). Их часто используют
в наполнении тела сайта.
(Tahoma, Verdana, Optima, Lucide Grande)
Слайд 42
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-41.jpg)
Слайд 43
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-42.jpg)
Слайд 44
![2. Шрифты без засечек (рубленые, гротески) (англ. Sans Serif): Подтипы:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-43.jpg)
2. Шрифты без засечек
(рубленые, гротески) (англ. Sans Serif):
Подтипы:
Г) Геометрический
Основаны
на правильных фигурах, например, «О» – это круг, и т.п.
(ITC Avant Garde Gothic, Erbar Grotesk, Eurostile, Futura, Kabel, Metro, Neuzeit Grotesk, Rodchenko, Spartan)
Слайд 45
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-44.jpg)
Слайд 46
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-45.jpg)
Слайд 47
![3. Рукописные (Script): Базируются на почерке:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-46.jpg)
3. Рукописные (Script):
Базируются на почерке:
Слайд 48
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-47.jpg)
Слайд 49
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-48.jpg)
Слайд 50
![3. Рукописные (Script): Подтипы: А) Формальные (Formal) Как будто написаны](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-49.jpg)
3. Рукописные (Script):
Подтипы:
А) Формальные (Formal)
Как будто написаны от руки.
Некоторые
шрифты основаны на почерках известных мастеров.
Не подходят для основного текста страницы.
Слайд 51
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-50.jpg)
Слайд 52
![3. Рукописные (Script): Подтипы: Б) Неформальные (Casual) Менее формальны, часто](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-51.jpg)
3. Рукописные (Script):
Подтипы:
Б) Неформальные (Casual)
Менее формальны, часто с жирной
обводкой и с эффектом мазков кисти.
(Mistral, Brush Script)
Слайд 53
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-52.jpg)
Слайд 54
![4. Декоративные шрифты (Display) Не пригодны для написания текста. Чаще всего они выполняют роль акцента.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-53.jpg)
4. Декоративные шрифты (Display)
Не пригодны для написания текста.
Чаще всего
они выполняют роль акцента.
Слайд 55
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-54.jpg)
Слайд 56
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-55.jpg)
Слайд 57
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-56.jpg)
Слайд 58
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-57.jpg)
Слайд 59
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-58.jpg)
Слайд 60
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-59.jpg)
Слайд 61
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-60.jpg)
Слайд 62
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-61.jpg)
Слайд 63
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-62.jpg)
Слайд 64
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-63.jpg)
Слайд 65
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-64.jpg)
Слайд 66
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-65.jpg)
Слайд 67
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-66.jpg)
Слайд 68
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-67.jpg)
Слайд 69
![5. Неалфавитные шрифты (Dingbats): Не содержат букв, но содержат символы и орнаменты.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-68.jpg)
5. Неалфавитные шрифты (Dingbats):
Не содержат букв, но содержат символы
и
орнаменты.
Слайд 70
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-69.jpg)
Слайд 71
![Моноширинные шрифты](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-70.jpg)
Слайд 72
![Толщина По толщине бывают шрифты: light, thin, regular, medium, bold, heavy, или black.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-71.jpg)
Толщина
По толщине бывают шрифты: light, thin, regular, medium, bold, heavy,
или black.
Слайд 73
![Стиль Есть три стиля шрифтов — italic, oblique, small caps. Small caps обычно используются для заголовков.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-72.jpg)
Стиль
Есть три стиля шрифтов — italic, oblique, small caps.
Small
caps обычно используются
для заголовков.
Слайд 74
![Шрифтовое оформление сайта](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-73.jpg)
Шрифтовое оформление сайта
Слайд 75
![1. Рекомендуется использовать одну гарнитуру шрифта для заголовков и подзаголовков](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-74.jpg)
1. Рекомендуется использовать
одну гарнитуру шрифта для заголовков и подзаголовков и
другую гарнитуру шрифта для основного текста.
Часто рекомендуется для заголовков использовать шрифты с засечками,
а для основного текста ‑ без засечек.
Слайд 76
![2. Не использовать те шрифты для сайта, которых нет по](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-75.jpg)
2. Не использовать те шрифты для сайта, которых нет по умолчанию!
3. Используемый шрифт достаточно большой, чтобы его можно было читать
с различным разрешением браузера.
Слайд 77
![4. Обеспечивать достаточный контраст между фоном и основным текстом. 5.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/155038/slide-76.jpg)
4. Обеспечивать достаточный контраст между фоном и основным текстом.
5. Заголовки визуально
должны отличаться от основного текста.
6. Исключается растягивание основного текста на всю ширину экрана с помощью текучей компоновки.