Uploaded by Алексей Аниканов

1. Типографика

advertisement
ТИПОГРАФИКА В ВЕБ-ДИЗАЙНЕ
ТИПЫ ШРИФТОВ
Аб
Аб
Аб
Аб
Антиква
С засечками
Sans Serif
Гротеск
Без засечек
Serif
Моноширинные
Monospaced
Декоративные
Аccident
Аб
Рукописные
Handwriting
Символьные
Symbol
ОСНОВНЫЕ ПОНЯТИЯ
Гарнитура
Название семейства шрифтов, с
различной степенью начертаний.
И все они объединены общим
стилистическим построением элементов
Futura Sans
Lato Sans
Geor gi a S er i f
Verdana Sans
Muller Sans
ОСНОВНЫЕ ПОНЯТИЯ
Насыщенность
Степень изменения толщины букв в рамках
одной гарнитуры. От очень тонкого до
жирного.
Muller Hairline
Muller Light
Muller Regular
Muller Bold Italic
Muller Heavy
ОСНОВНЫЕ ПОНЯТИЯ
Контрастность
Стиль шрифта напрямую зависит от его
контрастности. И определяется разницей
толщины между основным и
соединительным штрихом
Контрастные шрифты отлично подходят для
заголовков, а основной текст лучше
писать среднеконтрастным шрифтом
ОСНОВНЫЕ ПОНЯТИЯ
Вертикальный интервал между строками
текста. Измеряется расстоянием от
базовой линии одной строки до базовой
линии другой строки, расположенной над
ней.
Комфортность чтения зависит от того,
насколько хорошо сочетаются размер
букв, интерлиньяж и длина строки
Ч то такое
интерлиньяж
и базовая длиния
Базовая линия
Интерлиньяж
Интерлиньяж
ОСНОВНЫЕ ПОНЯТИЯ
Отличается от интерлиньяжа тем, что
измеряется расстоянием от базовой
линии верхней строки до верхней точки
строчных букв.
Более подробно про то, как работать с
интерлиньяжем вы узнаете в следующем
видео
Создавайте
сайты на T ilda
без знаний кода
Базовая линия
Интерлиньяж
Межстрочный интервал
СОЧЕТАНИЯ ШРИФТОВ
От того насколько ответственно вы
подойдёте к выбору шрифта для вашего
проекта зависит его успех.
Благодаря интересно подобранным
шрифтам ваш проект станет ярким и люди
будут его узнавать.
Сочетание шрифтов – это как выбрать
удачную пару в гардеробе (рубашка и
галстук).
Четких правил для выбора шрифтовой
пары нет. Вы должны опираться на ваши
вкус, опыт и понимание того, для каких
задач вам нужен шрифт.
Они могу быть одного фасона, или
наоборот. Но они должны гармонично
сочетаться. И тогда успех гарантирован.
Оформляя текст вы можете сочетать
разные шрифты, выбирая один для
заголовков, а другой для основного
текста.
Есть пара простых приёмов:
•
Вы находите пару, комбинируя разные
начертания одного шрифта (Light, Bold)
•
Или использовать два шрифта разного
типа. Заголовок антиква, основной текст
гротеск. Или наоборот
ПРИМЕРЫ ШРИФТОВЫХ ПАР
Почему возможна
художественная видимость?
Базовый тип личности, в первом приближении, многопланово
имеет сокращенный канон. Согласно теории "вчувствования",
разработанной Теодором Липпсом, комплекс агрессивности
просветляет сокращенный меланхолик.
Заголовок:
PT Sans
Основной:
PT Serif
ПРИМЕРЫ ШРИФТОВЫХ ПАР
Почему возможна
художественная видимость?
Базовый тип личности, в первом приближении, многопланово
имеет сокращенный канон. Согласно теории "вчувствования",
разработанной Теодором Липпсом, комплекс агрессивности
просветляет сокращенный меланхолик.
Заголовок:
Proxima Nova
Основной:
Palatino Linotype
ПРИМЕРЫ ШРИФТОВЫХ ПАР
Почему возможна
художественная видимость?
Базовый тип личности, в первом приближении, многопланово
имеет сокращенный канон. Согласно теории "вчувствования",
разработанной Теодором Липпсом, комплекс агрессивности
просветляет сокращенный меланхолик.
Заголовок:
Garamond
Основной:
Verdana
ПРИМЕРЫ ШРИФТОВЫХ ПАР
Почему возможна
художественная видимость?
Базовый тип личности, в первом приближении, многопланово
имеет сокращенный канон. Согласно теории "вчувствования",
разработанной Теодором Липпсом, комплекс агрессивности
просветляет сокращенный меланхолик.
Заголовок:
Lora
Основной:
Merriweather
ГДЕ БРАТЬ ШРИФТЫ
Бесплатные шрифты:
•
https://fonts.google.com – каталог шрифтов от Google
•
https://vk.com/ru_fonts - группа с бесплатными шрифтами
•
https://vk.com/shrift - ещё одна группа с кириллическими шрифтами
•
https://www.fonts-online.ru/fonts/cyrillic - большой каталог с различными шрифтами
•
http://allfont.ru/cyrillic/ - ещё один каталог
•
http://www.fontov.net/ - сервис для поиска шрифтов
•
http://ifont.ru/ - Огромный каталог шрифтов
ГДЕ БРАТЬ ШРИФТЫ
Платные шрифты
•
https://www.paratype.ru – один из самых интересных каталогов со шрифтами
•
https://fonts.adobe.com/fonts - каталог от Adobe. Должен быть платный аккаунт в Adobe.
С недавних пор объединился с Typekit.
•
https://www.myfonts.com/ - крупнейший зарубежный магазин шрифтов. Есть и кириллица.
Если вы делаете сайты на заказ, то за шрифты должен платить клиент. Озвучьте ему данную
информацию или включите в стоимость по умолчанию.
НА ЭТОМ ВСЁ!
ПЕРЕХОДИТЕ К СЛЕДУЮЩЕМ УРОКУ
Download