Типы и виды шрифтов. Классификация шрифтов и особенности их использования в веб дизайне

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

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

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

Но, разные издатели всё же хотели хоть чем-либо отличаться от своих (тогда ещё немногочисленных) конкурентов. Поэтому каждый при формировании набора печатных символов привносил в них свои индивидуальные особенности. Так появились первые шрифты ...

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

Основные характеристики шрифтов

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

Основных инструментов (а, соответственно, и характеристик) - три:

  1. Гарнитура шрифта - название одного из установленных в системе шрифтов.
  2. - размер литер выбранного шрифта в типографских пунктах (1 пункт равен 0,376 мм по системе Дидо или 0,3528 мм по системе от компании Adobe).
  3. Начертание шрифта (при наличии) - вариации внешнего вида литер шрифта со сменой их толщины и/или наклона.

Кроме основных существует ещё и ряд дополнительных инструментов, позволяющих, например, настроить междустрочный (интерлиньяж) и межбуквенный интервалы. Однако, первые три характеристики являются всё же наиболее востребованными, поэтому разберёмся с ними более детально.

Начнём немного не по порядку, поскольку о гарнитурах нужно будет поговорить отдельно. мы обычно называем его размером. Стандартом при работе с официальными документами считаются кегли 12 и 14 pt (пункты). В книгопечатании и газетном издательстве разброс кеглей может быть значительно больше. Например, для заголовков иногда используют размеры 20 и более, а для незначительного текста различных сносок вплоть до 8 pt:

Что касается начертания , то всего в наборе конкретной гарнитуры шрифта может существовать до 9 его типов. Начертание принято обозначать либо цифрами (от 100 - самое тонкое, до 900 - самое жирное), либо словесно (ultra-light (100), light (200), thin (300), normal (400), medium (500), semi-bold (600), bold (700), black (800), heavy (900)).

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

Виды шрифтов

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

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

Засечками (англ. "serif") называют небольшие декоративные штрихи, которые добавляются к выступающим краям символов шрифта. Шрифты с засечками имеют более "книжный" вид и используются в основном в печатной продукции (книги, журналы, газеты и т.п.). Считается, что такие шрифты больше подходят для восприятия длинных текстов без каких-либо рисунков.

Шрифты же без засечек (англ. "sans serif" или просто "sans" от фр. "без") с ровными концами символов традиционно являются основными в Интернете. Наиболее вероятно это связано с тем. что изначально мониторы компьютеров имели не очень высокое разрешение и засечки на буквах смотрелись не очень эстетично. Сегодня даже дисплеи мобильных устройств могут отображать изображения высокой чёткости, но большинство веб-мастеров и дизайнеров всё же использует онлайн именно шрифты без засечек, позволяя себе, разве что, заголовки оформлять serif-гарнитурами.

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

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

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

Изначально моноширинные шрифты широко употреблялись в печатных машинках (поэтому их иногда по-английски называют "typewriter" или сокращённо "tt") для упрощения форматирования текстов. С появлением компьютеров такие шрифты стали использоваться для вывода текста на дисплеи, которые в то время имели кластерную структуру и физически не могли отображать символы разной ширины. С развитием техники такое ограничение пропало, однако, за моноширинными шрифтами закрепилась роль консольных, поэтому большинство интерфейсов командной строки и Блокнотов для программирования по умолчанию используют именно их:

Наконец, шрифты можно классифицировать по их внешнему виду и стилю . Таких классификаций существует несколько, но, если обобщить, то можно выделить следующие их типы:

  • антиква - гарнитуры с засечками, имитирующие староевропейские или античные шрифты (Times New Roman, Antiqua, Bodoni);
  • готические - контрастные часто острые шрифты с неярко выраженными засечками (или вообще без них), имитирующие средневековые рукописные почерки с характерным утончением в местах сочленений и утолщением основного штриха (Textur, Rotunda, Schwabacher);
  • брусковые - шрифты с крупными ровными (или слегка закругленными) засечками, которые слабо контрастируют с толщиной основных штрихов (Courier, Memphis, Century);
  • гротески или рублённые - большинство шрифтов без засечек (Arial, Tahoma, Verdana);
  • рукописные (англ. "script") - шрифты, имитирующие символы, написанные от руки или даже почерком реальных людей (Monotype Corsiva, Alexandra Script, Anastasia Script);
  • акцидентные - шрифты, которые имитируют какие-либо древние или ныне существующие национальные алфавиты (исторические, славянские, восточные), несут в себе дополнительные декоративные элементы (вензеля, иконки, пиктограммы и т.п.) или представляющие собой определённые стилизации (граффити, перфорированные шрифты, контурные шрифты и т.п.);
  • символьные или иконочные - шрифты, которые вместо обычных букв алфавита содержат набор определённых символов или иконок (Wingdings, Font Awesome, Glyphicons).

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

Форматы шрифтов

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

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

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

Говоря о форматах векторных шрифтов, стоит в первую очередь выделить две технологии: PostScript и TrueType. PostScript изначально был творением компании Adobe и разрабатывался в качестве платформонезависимого языка описания для издательских систем. Это довольно сложный язык, ориентированный на хранение информации не только о шрифте, но и обо всём печатном издании. Конкретно со шрифтами связаны реализации Type 1-3 (форматы файлов: .pfa, .pfb, .pt3 и.cff).

Фактически ни один из PostScript-шрифтов (кроме OTF, в основе которого лежат команды PS) не поддерживается в Windows без установки дополнительного софта и драйверов. Поэтому такие шрифты используются в основном профессиональными издателями и верстальщиками. Для более широкой публики существует технология TrueType , созданная ещё в 80-х годах компанией Apple. Эта технология изначально была ориентирована именно на компактное хранение шрифтов, поэтому сегодня именно она поддерживается большинством операционных систем.

Основным форматом шрифтов TrueType является .ttf , который может хранить в себе от 256 до 4 294 967 296 символов (зависит от версии формата). Также, в зависимости от версии, файл шрифта может хранить в себе как одно, так и сразу несколько типов начертания (обычно 4: нормальное, курсивное, полужирное и полужирный курсив). Кроме TTF, шрифты TrueType могут также иметь расширения.tte или.dfont (шрифты для MacOS).

Однако, с форматом TTF, увы, не всё так однозначно. Дело в том, что такой же формат могут иметь шрифты, основанные на технологии OpenType . Эта технология изначально была нацелена на хранение расширенной таблицы символов с поддержкой Юникода с более эффективным, нежели у TrueType, сжатием. Данный контейнер шрифтов может содержать в себе описание символов как в формате TrueType (.ttf или.ttc), так и PostScript (.otf или.otc). Благо, что Windows поддерживает все форматы OpenType, поэтому Вам необязательно слишком глубоко вникать в технические нюансы.

Формат TTF является наиболее распространённым. Его даже поддерживает большинство браузеров. Однако, для применения в веб-разработке у отдельных TTF-шрифтов может быть очень большой недостаток - размер, который может составлять несколько мегабайт! Поэтому для применения на Интернет-страничках были придуманы специальные технологии сжатия шрифтов. На сегодняшний день самыми распространёнными являются.eot (Embedded OpenType), .woff и.woff2 (Web Open Font Format).

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

Наиболее яркими (во всех смыслах) представителями данного типа шрифтов являются шрифты для Фотошопа. Они могут поставляться в виде PNG -изображения с набором букв на прозрачном фоне, либо в формате .PSD (стандартный формат Photoshop) с буквами-картинками на разных слоях. Набирать текст в привычном понимании при помощи данных шрифтов у Вас, конечно, не выйдет. Но Вы вполне сможете составить нужные надписи, копируя фрагменты алфавита и размещая их в нужной последовательности:

Думаю, с форматами теперь тоже более или менее ясно. И теперь мы перейдём к вопросу об их установке и использовании (речь, естественно, пойдёт о векторных шрифтах TTF и OTF).

Установка и работа со шрифтами

Для установки шрифтов в Windows существует специальная папка "Fonts" (или "Шрифты"). Получить к ней доступ можно из Панели инструментов (одноимённый раздел), либо через строку "Выполнить" (WIN+R) командой "%windir%\fonts" (без кавычек). Чтобы новый шрифт был добавлен в систему его достаточно просто перетащить в эту папку. Аналогично, для удаления нужно удалить файл шрифта из общей директории:

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

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

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

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

Заключение

После того как мы со всем разобрались (надеюсь:)), у нас остался ещё один вопрос, который, возможно, возник у Вас в процессе чтения: а где скачать шрифты для Windows? Тут однозначного ответа, увы, нет. Дело в том, что многие качественные русскоязычные шрифты могут быть платными и, качая их с многочисленных сайтов со шрифтами, Вы рискуете нарушить авторское право. Если же брать широкодоступные шрифты, то не факт, что они будут иметь хорошее качество исполнения всех символов (нередки случаи неправильной отрисовки больших и маленьких букв или отсутствия альтернативных начертаний шрифта).

В принципе, для личного использования всего, что есть в Интернете, будет достаточно, но, если Вы задумались о профессии, например, веб-разработчика и дизайнера, всегда проверяйте лицензию облюбованного Вами шрифта, дабы не нарушить закон!

P.S. Разрешается свободно копировать и цитировать данную статью при условии указания открытой активной ссылки на источник и сохранения авторства Руслана Тертышного.

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

1. Какие различают виды шрифтов?

Существует огромное разнообразие шрифтов, включая те, что не поддаются никакой классификации. Мастера типографики и дизайнеры скажут вам, что выделяют не одну классификацию со своими историческими и техническими особенностями. Вы, возможно, слышали о таких классификациях, как Old Style, Blackletter и Humanist. Но это не предмет нашей статьи. (Если вы хотите узнать больше, то без труда найдете интересный контент на эту тему в интернете). В этой статье мы рассмотрим четыре основные категории, знать которые будет полезно для того, чтобы удачно подбирать, комбинировать несколько шрифтов и грамотно аргументировать свой выбор.

2) Sans-serif : В категории «санс-сериф» буквы не имеют засечек на концах, что придает им более современный, «чистый» вид. Считается, что шрифт «сериф» облегчает визуальное восприятие больших фрагментов печатного текста, помогая глазам скользить по строкам. Но поскольку большинство шрифтов с засечками – мелкие и тонкие, они не лучшим образом отображаются на пиксельных экранах. Они выглядят не четко, создавая искаженную и «шумную» картинку. По этой причине для экранов или сайтов (особенно компактных) дизайнеры предпочитают использовать текст без засечек.

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

4) Decorative : Декоративные шрифты призваны привлечь внимание аудитории. Их нельзя назвать практичными, поэтому используются они осторожно или только для определенного эффекта или цели.

2. Почему выбор шрифта так важен?

Некоторые дизайнеры сравнивают выбор шрифта с выбором одежды. Надо признать, что такое сравнение как нельзя более удачное. Подумайте о том, что может рассказать о вас ваш образ. Глядя на вашу одежду, люди судят (верно или неверно) о вашем стиле, личных качествах, социально-экономическом положении, возрасте (или том возрасте, на который вы стремитесь выглядеть) и впечатлении, которое вы хотите произвести. Более того, разные события и обстоятельства обязывают вас выбирать определенную одежду: ведь вы не придете на собеседование в купальнике, а костюм с галстуком — едва ли хороший вариант для пляжного отдыха. Иными словами, вам приходится думать об уместности и целесообразности той или иной одежды.

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

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

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

3. Как правильно выбрать шрифт

Основы

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

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

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

Учитывайте контекст и аудиторию.Где и как ваша аудитория будет видеть ваш дизайн? Это еще один важный фактор, влияющий на выбор. Например, для визитной карточки нужен текст, который остается легко читаемым даже в маленьком размере. А если вы работаете над графическими изображениями для социальных сетей, которые будут просматриваться преимущественно с мобильных устройств, вам следует отдать предпочтение буквам, которые четко отображаются на экране (html странице).

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

Ваш шрифт уместен?

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

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


Декоративные (о них мы упоминали в самом начале этой статьи), напротив, не предназначены для объемных отрывков текста. Притягивая все внимание на себя, такие шрифты используются для разных целей. Например, шрифты с жирными заглавными буквы подходят для заголовков. Шрифты с запорошенными снегом буквами это идеальный вариант для Рождества; а буквы, словно сплетенные из веток деревьев, укажут на связь вашего бренда с окружающей средой и деятельностью на открытом воздухе. Тем не менее, для профессионального, делового контекста нужны более строгие и лаконичные решения.

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

Ваш шрифт универсальный?

Каждый дизайнер должен иметь в запасе несколько нейтральных универсальных шрифтов. Они настоящая палочка-выручалочка, когда времени катастрофически не хватает, а другие варианты не подходят. Обычно это «Serif» и «Sans-Serif», которые можно с успехом использовать практически везде. Наиболее функциональными являются варианты, имеющие разную насыщенность (светлые, нормальные, средние, жирные и тяжелые) и стили (узкие, сжатые, растянутые или малые заглавные буквы).

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

Но как выбрать такую «рабочую лошадку»? В прошлом году более 40 ведущих дизайнеров поделились своим любимыми универсальными шрифтами. И хотя предпочтения значительно разнились, наиболее часто эксперты упоминали Avenir (и Avenir Next – его версию, адаптированную под веб-страницы). Если вы решите купить его, то сразу предупреждаем, что это не дешевый вариант.

Но не беспокойтесь: вы не разоритесь на универсальных шрифтах. В интернете и операционных системах доступно большое разнообразие бесплатных шрифтов. Может, они и уступают профессиональным вариантам, но они прекрасно подойдут для повседневных нужд. Если вы ищите вариант в категории «Serif», обратите внимание на Crimson Text , Georgia , Droid Serif , Andada , Merriweather и Heuristica . Из категории «Sans-Serif» мы рекомендуем Franklin Gothic , Roboto , Clear Sans , Source Sans , Lato и Merriweather Sans .

Ваш шрифт читаемый?

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

  • Размер : Подберите такой размер, который бы гармонично смотрелся в вашем контексте. Например, для визитки и постера нужны шрифты разных размеров. Если аудитория будет просматривать ваш дизайн с мобильных устройств, откройте любой текстовый редактор, напечатайте несколько строк выбранным вами шрифтом и уменьшите его размер. Если вы по-прежнему без труда читаете текст, то он, скорее всего, подойдет для небольших экранов. Поищите Google информацию об определенном шрифте, чтобы узнать, оптимизирован ли он под веб-страницы.
  • Расстояние : Расстояние между знаками может играть большую роль в улучшении читабельности текста. Обычно чем оно больше, тем легче воспринимается текст. Но если вам не хватает места, стоит поэкспериментировать с разными комбинациями размера шрифта и расстояния. Практически в любом графическом редакторе вы можете отрегулировать спейсинг (расстояние между целыми группами букв в строках или фрагментах текста), кернинг (расстояние между парами букв) и лидинг (вертикальное расстояние между строками).
  • X-высота : Это высота строчных букв. Достаточная X-высота улучшает читабельность, сохраняя ее даже при уменьшении масштаба. Однако не стоит приближать X-высоту к высоте заглавных букв, поскольку это затруднит различие между нижним и верхним регистрами.
  • Тест I/l/1 : Если вы выбрали шрифт для фрагментов текста, которые содержат и буквы, и цифры, проведите один простой тест. Напечатайте заглавную букву I, строчную букву L и цифру 1. Если они получились похожими, то он может ввести читателей в заблуждение.

Как сочетать разные шрифты

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

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

  • Найдите общую характеристику: шрифты, которые выглядят по-разному, но при этом имеют что-то общее, как правило, хорошо смотрятся вместе. Например, у них одинаковая ширина или высота букв или одинаковая структура. Даже незначительная схожесть способна придать комбинации единство.
  • Отдавайте предпочтение шрифтам от одного дизайнера: Дизайнеров можно узнать по их уникальному стилю, неповторимой эстетике. Шрифты одного и того же автора похожи (по внешнему виду или структуре), поэтому их легко комбинировать. Поищите так называемые суперсемейства. В них входят комплементарные шрифты с засечками и без засечек, с разными степенями насыщенности и разными стилями. Попробуйте, например, бесплатные суперсемейства Alegreya и Alegreya Sans (каждое из них содержит 40 вариантов насыщенности/стиля) или Merriweather и Merriweather Sans, которые мы также рекомендовали в качестве универсальных решений.
  • Определите цель каждого шрифта: они должны быть достаточно разными, чтобы создавать четкую визуальную иерархию и подсказывать аудитории, на что обращать внимание и что является важным. Для этого обычно хватает одного варианта с засечками и одного – без засечек.

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

Где найти бесплатные шрифты

Ищите интересные шрифты для экспериментов, но пока не готовы открывать свой кошелек? К счастью, существует огромное количество сайтов (разного качества) с бесплатными шрифтами. Когда будете их скачивать обязательно проверьте наличие лицензии. Мы еще остановимся на этом подробнее, ну а пока вот несколько ресурсов, где вы можете найти прекрасные коллекции:
1) Font Squirrel : Это, наверное, лучший сайт с бесплатными шрифтами, лицензированными для коммерческого использования (все до единого!). Здесь вы найдете обширную коллекцию качественных, отобранных вручную вариантов. Поиск можно осуществлять по категориям или тэгам (обычные, ретро, гранж).

2) Google Fonts : Это каталог бесплатных шрифтов для веб-сайтов и других веб-проектов и приложений. Коллекция содержит сотни общедоступных шрифтов, которые можно редактировать, распространять и т.д. Все они оптимизированы под веб-страницы и сопровождаются инструкциями о том, как добавить соответствующий html код на свой веб-сайт или интегрировать его в свой CSS. Более того, вы можете скачать шрифты на свой компьютер и использовать их на печатных носителях.

3) DaFont : На данный момент этот ресурс предлагает 25 000 бесплатных общедоступных демо-шрифтов. Но поскольку свои работы в эту базу может добавить любой пользователь, то здесь встречаются шрифты совершенно разного качества. Многие варианты бесплатны только для личного использования.

4) 1001 Fonts : Сейчас в базе доступно 7 000 бесплатных шрифтов разного качества. Здесь вы найдете специальный раздел с бесплатными шрифтами для коммерческого использования. Поиск можно осуществлять по типу/стилю/настроению, временным эпохам и даже праздникам.

5) Другие ресурсы: они предлагают довольно скромные коллекции, но там тоже можно найти вполне приличные варианты.

Lost Type Co-Op: Трендовые, уникальные и винтажные шрифты, доступные для личного использования на основе «заплати, сколько считаешь нужным». Вы даже можете не платить ничего, но почему бы не поддержать дизайнеров?

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

FontShop: Здесь почти все доступно на платной основе, но некоторые вариации с насыщенностью и стилями вы получите бесплатно. Для скачивания необходимо зарегистрировать аккаунт.

Pixel Buddha: На этом сайте есть скромный раздел с оригинальными, нарисованными вручную шрифтами. Они хоть и бесплатные, но, чтобы их скачать, придется зарегистрировать аккаунт.

Лицензирование шрифтов

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

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

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

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

Структура символа

Давайте начнём с рассмотрения структуры символа:

1. Строка основания - воображаемая линия, несущая на себе все символы, их "насест".

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

3. Линия строчных - горизонтальная линия, прочерченная по макушкам большинства строчных букв, таких как “a”,”c”, “e”, “x”.

4. Подстрочный (нижний выносной) элемент - часть букв “g”, “j”, “p”, “q”, “y”, расположенная ниже строки основания.

5. Надстрочный (верхний выносной) элемент - противоположность подстрочного. Венчает строчные буквы “b”, “d”, “f”, “h”, “k”, “l”, “t”.

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

6. Засечка - дополнительный штрих в изображении буквы. Шрифт без засечек, как можно догадаться, их лишён; края его символов не имеют "ограничителей".

7. “x”-высота - высота строчной буквы “x”. На первый взгляд, это значение может показаться, как бы, лишним, однако, в CSS-программировании оно принято за единицу измерения (главным образом, потому, что у строчной буквы “x” нет ни верхних, ни нижних выносных элементов).


01. Шрифты "старого стиля" или "Альдине"

Эти шрифты были разработаны печатниками эпохи Возрождения, и содержат множество элементов, заимствованных из древнеримского письма. Ряд специалистов считают "старый стиль" синонимом "Альдине", другие причисляют "Альдине" к разновидностям "старого стиля" (вместе с гуманистическими шрифтами). Их отличительные характеристики: слабый/средний контраст между широкими и узкими штрихами, а также округлые, как правило, засечки. Отчётливость этих шрифтов в текстах для чтения великолепная.

Наиболее популярные шрифты этой группы: Garamond, Minion Pro, Palatino, Centaur и Bembo.


02. Шрифты промежуточного типа

Как следует из её названия, эта группа совмещает в себе элементы "старого стиля" и современных шрифтов. Шрифты этого типа характеризуются следующими отличиями: высота прописных букв равна высоте строчных с верхними выносными элементами, стыки штрихов покатые или плоские, осевые компоненты тоже слегка смещены или уплощены. Округлые засечки отчётливы более, чем у шрифтов "старого стиля", но менее, чем у современных.

Самый широкоиспользуемый шрифт данного семейства - однозначно, Times New Roman.


03. Современные или дидотовские шрифты

У этих шрифтов очень заметные особенности: тонкие горизонтальные и массивные вертикальные штрихи, резко контрастирующие между собой, а также лишённые округлости вертикально направленные засечки. Современные шрифты появились в восемнадцатом столетии, их разработчиками были семья французских печатников Дидо (Didot) и итальянский издатель Джамбаттиста Бодони (Giambattista Bodoni).

Наиболее значимые представители этой группы шрифтов: Century, Bodoni, Didot и Bookman.


04. Шрифты с прямыми засечками

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

Примеры шрифтов с прямыми засечками: Rockwell, Memphis, Figaro и Excelsior.


05. Шрифты без засечек

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

Самые значимые представители этой группы: Helvetica, Arial, Futura, Century Gothic и Gill Sans.


06. Готические рукописные шрифты

Они словно вышли из-под пера усердного каллиграфа где-нибудь в Европе времён Гутенберга, что помогает очень легко установить их происхождение. Готические рукописные шрифты отличаются изысканной витиеватостью букв и применяются, в основном, при оформлении дипломов, приглашений и прочих официальных бумаг/документов. Лучше всего использовать только их строчные символы, без заглавных букв. Другие названия шрифтов данной группы - Старинное английское письмо (Black Letter) или Староанглийская готика (Old English).

Наиболее известные среди этих шрифтов: Cloister Black Lite, Black Forest и Linotext.


07. Рукописные шрифты

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

Удачные образцы таких шрифтов: Rage Italic и Cristopherhand.


08. Декоративные или "галантерейные" шрифты

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


09. Значки или шрифты-комплекты типографских пометок

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


Заключение

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

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

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

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

Все материалы были опробованы мною - не зря же назвал свой сайт "СТАРАТЕЛЬ ИНТЕРНЕТА" .
После короткого отзыва по их использованию - кнопка для скачивания.
Вы можете совершенно спокойно (вирусов нет ) и бесплатно скачать себе нужные красивые шрифты, нажав вот на такой рисунок-кнопку.

Файлы шрифтов взяты из открытых источников.

Шрифты

Для наглядного сравнения текста на картинках образцов, шрифты применял разные, но размер шрифта устанавливал единый: 30 px .
Размер розоватой фоновой области сделал: 740*60 px .

Сразу видно, какому шрифту сколько места нужно при одинаковых(!) установках .

BancoDi

Мой самый первый и любимый шрифт. Хорошо подходит для нанесения градиентной заливки и разного типа стилей.

Ametist

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

Belukha

Идеально подходит для заголовков. Имеет только заглавные буквы. Также очень хорош для градиента.

Стилизован под "письмо от руки". Оригинально оформляет поздравительные открытки.

Flash_Bold

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

FuturaEugenia Italic

Позволяет очень красиво написать текст на любом объекте.
Выглядит строго, стильно. Своим присутствием украсит что угодно: упаковку, логотип, рекламу, баннер, сайт и т.д..
Не зря его использует одна известная кондитерская фабрика для надписей на своей продукции.

Monplesir

Название шрифта полностью соответствует его внешнему виду. Такая надпись сделает красивее любую фотографию.

Radar

Оригинальный шрифт с необычным, высоким начертанием части букв.

Topaz

Один из моих самых любимых шрифтов. Чем-то похож на BanckoDi , но более гладкий.

Tauern

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

VivaldiD

Необычному начертанию букв этого шрифта легко найти применение где угодно.

ZapfChancery

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

Arlekino

Ещё оригинальный русский шрифт для фотошоп. Хорошо подходит для написания текста поздравлений, оформления рекламных баннеров, флаеров.

Monte_Carlo

Очень оригинальный, стильный, объёмный шрифт. Им можно красиво написать текст на шапках сайтов или заглавиях их блоков.

Lena

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

Больше русских шрифтов

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

Гораздо больше красивых русских шрифтов для фотошоп Вы найдёте в подразделе специальной страницы, посвящённой дизайну сайтов.

Так его и назвал: "Инструменты и сервисы" (в новом окне) .

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

Да и, кроме бесплатного скачивания, он-лайн сервис, куда Вы попадёте, очень удобен для выбора подходящего шрифта.
Там есть "Полигон", на который можно загрузить свой текст, и посмотреть, как(?) он будет выглядеть. Это здорово помогает красиво написать текст.

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

Узнать, как подключить любой оригинальный, красивый шрифт к своему сайту, Вам очень поможет раздел "Веб-шрифты" (откроется в новом окне) .

Полезная информация (для поиска шрифтов)

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

Всего 2 файла.
Слева они (их иконки) представлены в формате GIF . Для получения 100% размера кликните по иконкам (откроются в новом окне ).

Справа, в архиве для скачивания, те же файлы, но в формате PSD с (!)не слитыми слоями .

Размер шрифтов: 24 px .
В каждом документе: слева - написано шрифтом, справа - название шрифта.

** В PSD-формате каждые 2 слоя имеют одинаковые имена: самый первый от фона - рисунок шрифта, следующий с таким же именем - его название.

И последнее: мне удобнее работать с PSD-форматом, что чаще всего делаю. А формат GIF использую, если приходится искать какие-то новые шрифты - сразу перед глазами полный список - не загружаю лишнее.
Кроме того, открытые рисунки не требуют столько системной памяти, как запущенная программа "Фотошоп".

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

Основные группы шрифтов

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

Serif (с засечками)

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

Slab serif (прямоугольные засечки)

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


Script (пропись)

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


Blackletter (готический шрифт)

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


Sans serif (без засечек)

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


Handwriting (рукописный шрифт)

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


Decorative (декоративный)

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


Подборка и совмещение шрифтов

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

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

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

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

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

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

Как смешивать и использовать шрифты в тексте

Рассмотрим несколько принципов совмещения шрифтов, которые позволят добиться красивого оформления текста.

Сайт должен быть читабельным

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

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

Не используете большое количество разных шрифтов

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

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

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

    Применяя не более трех шрифтов, вы экономите свое время, но при этом веб-сайт выглядит отлично.

Не используйте неподходящие сочетания

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

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

Примеры объединения шрифтов

Для примера рассмотрим страницы нескольких сайтов, где грамотно подобраны шрифты.

Заголовки:
Sentinel (serif slab)

Параграфы:
Gotham Narrow (sans-serif)

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

Заголовки и параграфы:
Freight Text Pro (serif)

Остальное:
Freight Sans Pro (san-serif)

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

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

Заголовки:
PMN Caecilia (slab serif).

Параграфы:
Gill Sans (sans-serif)

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

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

Заголовки и параграфы:
Skolar (serif)

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