Терминалы и окончания штрихов во многих знаках направлены вправо и немного вверх (например, в «а», «t», «e», «c») — это придает шрифту динамики. Затем стоит задать себе вопросы о том, где и как шрифт будет использоваться, какие у него будут функции в проекте. Насколько шрифт должен быть нейтральным или привлекающим внимание? Это только самые очевидные примеры требований к гарнитуре. Каждый конкретный проект будет задавать свои специфические условия. Большой плюс — в ней показывают только бесплатные шрифты от Google Fonts.
Непонятно, зачем оба гротеска использовались в макете, когда можно было обойтись только одним из них. Вообще сочетать гротески друг с другом довольно опасно, и многие не рекомендуют этого делать. Но лично я ничего не имею против подобных сочетаний, если они сделаны продуманно.
- Но, как обычно, решение зависит от конкретного проекта.
- Дизайнеры, которые работают с данным сервисом, демонстрируют, каким образом можно задействовать шрифты в своих проектах.
- Хотя все зависит от дизайна, и в некоторых случаях такой подход может быть оправдан.
- Но даже в этом случае, у нас присутствует большое разнообразие размеров, начертаний и задач среди выбранных шрифтов.
- По правде говоря, отличных результатов можно добиться, используя только шрифты из одного семейства.
- Этот проект для любого дизайнера — учебник по применению шрифтов и их комбинаций во всех областях.
Звучит немного размыто, но сейчас посмотрим на примерах. При этом для слова “with” (с) был выбран простой рукописный шрифт. Этот маленький акцент привлекает внимание к типографике и сообщению бренда в целом. Сдержанный рукописный шрифт не выглядит слишком женственным и делает брендинг согласованным, ведь он также используется в логотипе компании. Добавьте в интерфейс комбинацию наиболее контрастных стилей, чтобы различие между шрифтами было очевидным. Вы не ошибетесь, если используете сочетание жирного (bold) или сверхжирного (black) и обычного (regular) или тонкого (light) начертаний.
Типографика – это все же искусство, и в вопросе выбора шрифтов нужно доверять своему вкусу. С помощью этих инструментов можно не просто найти пару, но и определиться с основным шрифты для сайта шрифтом. Большинство этих инструментов очень просты в использовании, однако они не гарантируют, что предложенные варианты шрифтов идеально впишутся в ваш проект.
Примеры Готовых Комбинаций
Но если запастись терпением, всегда можно найти что-то подходящее. Сочетание двух антикв — своеобразное решение, которое не всем подходит. Преимущественно его можно встретить у каких-то креативных компаний или в проектах, связанных с искусством.
Если один из ваших основных шрифтов обладает сильным характером, то ему в пару может потребоваться дополнительный нейтральный. Чтобы пара получилась гармоничной, но контрастной, для начала можно проанализировать основные характеристики шрифтов. Существуют миллионы шрифтов, и из них можно создавать миллионы шрифтовых комбинаций.
А вот если бы настолько узким был шрифт основного текста, это было бы уже трудно читать. Эта шрифтовая пара будет эффективной, если интерфейс включает крупную типографику и минимальное количество слов и фраз. Следует помнить, что текст, который состоит из прописных букв, трудно читать, если его слишком много. Font Combinator By Typotheque – на этом сервисе можно наглядно посмотреть, как шрифты будут выглядеть в разных размерах и гарнитурах. Все, что нужно сделать пользователю, – это выбрать шрифт и перетащить его мышкой на заголовок или в основной текст. Выбор шрифтов небольшой, но зато все они хорошо сочетаются между собой.
Разные Начертания В Рамках Одной Гарнитуры
Еще один англоязычный ресурс, где можно найти шрифты из латиницы. Все примеры носят рекомендательный характер, окончательный выбор остается все же за дизайнером. Сервис Font In Use https://deveducation.com/ поможет найти множество интересных шрифтов и шрифтовых пар. Дизайнеры, которые работают с данным сервисом, демонстрируют, каким образом можно задействовать шрифты в своих проектах.
Мы сделали размер антиквы больше, чтобы буквально увеличить количество белого внутри. И в гротеске мы включили контекстную альтернативу для буквы «а», превратив ее из круглой одночастной в двухчастную, что сделало набор текста чуть менее воздушным. Теперь шрифты в сочетании смотрятся более гармонично.
Также с помощью разных шрифтов можно расставлять акценты и разделять смысловые блоки. А еще это очень хорошее упражнение, помогающее лучше понять, что такое шрифт и какое впечатление он оказывает на зрителя. Это огромное виртуальное хранилище разных дизайнерских материалов за последние десятилетия. Можно ввести в поиск нужный шрифт и увидеть, с чем его сочетают другие бренды. Все сервисы зарубежные, и у некоторых шрифтов может не быть кириллических версий.
В следующей картинке к посту с анонсом клиентских дней для даты и основной информации используется привлекающий внимание жирный шрифт. А для дополнительной надписи внизу — более простой, чтобы она не отвлекала внимание от главного. Вне всякого сомнения, это самый популярный прием шрифтового сочетания — антиква в заголовке и гротеск в качестве наборного текстового шрифта. Это классическое сочетание, и здесь практически невозможно ошибиться. Но самое важное правило подбора шрифтовых пар — учитывать контекст и задачи конкретного проекта.
Избегайте Сочетания Шрифтов, Принадлежащих Одной Группе
Из-за этого даже между абсолютно разными шрифтами можно найти сходства — в конструкциях знаков и в характере рисунка. То есть мы все так же работаем со сходствами и различиями двух шрифтов, просто подстраховываем себя, оставаясь в рамках определенного авторского почерка. Здесь, например, TT Ramillas и TT Commons хоть и отличаются по классификационной группе и конструкциям знаков, но все равно схожи пропорциями и общей изящностью рисунка. Все, что мы рассмотрели в предыдущем разделе, может относиться как к подбору одного шрифта, так и к выбору сразу нескольких шрифтов.
Пользоваться ей очень просто – выбираете шрифт по вертикальной оси и затем смотрите, с каким шрифтами его можно использовать. Может быть использован один шрифт, но с разной гарнитурой. Например, можно взять Helvetica Regular для основного текста и Helvetica Bold для заголовка. Шрифты в одной гарнитуре всегда хорошо смотрятся друг с другом – они для этого и придуманы.
Вот, например, контрастная антиква в заголовке и гротеск в основном тексте. Шрифты из одной группы, но различных шрифтовых семейств, могут легко создать диссонанс, если их поставить рядом. Их яркая индивидуальность не позволит им мирно ужиться и создаст типографическую грязь, если не уделить этому соседству достаточного внимания. В первом примере слева заголовок набран жирным начертанием Clarendon, который является брусковым рубленым (или египетским). Основной текст набран Officina Serif, который тоже брусковый рубленый шрифт. Шрифты этой группы обладают яркой индивидуальностью, и они занимают доминантную позицию везде, где их применяют.
Fontpair — это иллюстрированная библиотека пар и галерея популярных бесплатных шрифтов. Быстрая «примерка» шрифтов на компактном макете вёрстки. А вот если сильно уменьшить TT Hoves и отправить его в текст, он перестает подавлять TT Espina. В таком варианте он, с одной стороны, замечательно с ней контрастирует, а с другой — подставляет ей свое крепкое плечо. Использование разных размеров помогает выстроить типографическую иерархию, а также добиться разнообразия типографической цветности.
Попробуйте применить этот прием к короткому заголовку и второстепенному тексту, занимающему одну строку, как в нашем примере. Внимательно выбирайте слова и шрифт, чтобы прописные буквы не выглядели слишком массивно. Здесь подойдет обычное (regular) или среднее (medium) начертание. Мы рассмотрим трендовые сочетания шрифтов с примерами. Здесь вы найдете целую подборку разных гарнитур и красивых решений. Сервис The Art of Mixing Typefaces это своеобразная шпаргалка для дизайнеров, позволяющая быстро найти подходящие друг другу шрифты.
Соответственно, не сочетаются шрифты, которые слишком похожи друг на друга, и шрифты без понятной взаимосвязи. Сейчас самый распространенный тип шрифта — это гротеск, а второе место занимает антиква, так что в этой статье мы в основном будем рассматривать их. Однако видов шрифтов, конечно, существует намного больше. Подробную классификацию вы найдете в нашей статье «Классификация шрифтов». Прежде чем говорить о подборе и сочетании шрифтов, давайте пройдемся по основным шрифтовым понятиям.
В примере выше градиент напоминает жидкость, которая плавно перетекает из одной буквы в другую. Стоит обратить внимание, что большинство шрифтов подойдут для тех, кому нужна латиница. Но можно найти и много примеров для русскоязычных проектов. Смотрите и изучайте – сервис определенно заслуживает внимания. Здесь мы видим интересный заголовок и обычный шрифт в описании.
TT Hoves как будто подавляет своей основательностью хрупкий TT Espina. Сочетание с TT Commons в таком размере выглядит гармоничнее. Пропорции у шрифта равноширинные, текстура очень ровная, знаки не очень узкие, в них много белого. Это создает ощущение основательности и уверенности в себе. Здесь на левом примере шрифт должен быть комфортным для чтения текстов, но при этом в небольших заголовках тоже должен выглядеть опрятно. Справа шрифт используется только для крупных коротких надписей, поэтому вполне может быть более экспрессивным.
Они очевидно отличаются по графике, однако схожи по текстуре рисунка знаков, и это их объединяет. Вот еще один похожий пример, только антиква здесь работает в заголовке и шрифты уже не так похожи. Здесь сходство улавливается на уровне текстур набора.
Сочетание Гротеск + Антиква (или слаб, как в данном случае) можно назвать классическим. Самое главное условие, которое нужно соблюдать при сочетании шрифтов — между ними должны четко прослеживаться взаимосвязи. То есть должно быть понятно, чем они отличаются, а чем похожи.