Шрифт montserrat с чем сочетается
Дизайн для недизайнеров: 10 идеальных шрифтовых пар
В VistaCreate этот параметр настроить легко: Еще в оформительной типографике часто используются рукописные и акцидентные шрифты, но антиква, гротеск и брусковый шрифт самые распространенные.
Шрифты рукописный Lemon Tuesday и акцидентный Ruslan Display
Принцип объединения №2. Контраст
Избегайте конфликта
10 шрифтовых сочетаний в дизайнах VistaCreate
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5bd2dbf078e1194aa6ff06c3/» background=»red»/]
2. Oswald + Playfair Display
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5bf7ec838caf671e1c9f2da7/» background=»red»/]
3. Cookie + Josefin Sans
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5a96bfa1f07aee6977cd50bf/» background=»red»/]
4. Montserrat + Playlist Script
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5bc09ae978e1194aa64837af/» background=»red»/]
5. Arapey + Josefin Sans
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5aa69a03f07aee69774a652a/» background=»red»/]
6. Grand Hotel + Podkova
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5b6c55011cc8aa54292895f7/» background=»red»/]
7. Abril Fatface + Raleway
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5b891c9418654940f7ca946c/» background=»red»/]
8. Graduate + Montserrat
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5b891a5c18654940f7beb452/» background=»red»/]
9. Abril Fatface + Raleway
[button text=»Использовать шаблон» url=»https://crello.com/artboard?template=5b6d9d2f1cc8aa54291cd948/» background=»red»/]
10. Bangers + Contrail One
Шрифтовые пары для сайта
Сайт – это текст!
Если открыть страницу выбранного сайт, то увидим, что львиную долю ее занимает текст. По-разному организованный, но текст. Выделение цветом, размерные буквы, шрифты… Иногда надпись даже выполняет роль изображения. Когда это в балансе, то сайт смотрится читабельно и удобен для пользователя. Как этого добиться?
Правила подбора шрифтовых пар
Со времен первой печатной книги создано много шрифтов. Как прекрасных так и ужасных. Поэтому не все годятся для страниц вашего проекта. Давайте разберемся почему?
Правило 1: «Мы с Татьяной ходим парой»
Одним шрифтом, одного кегля и одного цвета, даже используя форматирование, не добиться выделения фрагментов текста и визуализации, и визуальной же гармонии. Главному шрифту нужен, как минимум, один напарник-противовес.
Однако шрифтовая абракадабра на странице не дизайнерский моветон, а сложности для того, кто смотрит страницу. Если используется более двух шрифтов, то внимание посетителя рассевается, из-за неодинаковости начертания букв текст визуально рассыпается на фрагменты, что затрудняет восприятие.
Чтобы убедиться в этом, поэкспериментируйте со шрифтами на страничке того же Word.
Как показал мировой опыт, лучше, когда используется только пара шрифтов.
Никто не заставляет вас ограничиваться этим числом, но использование большего оправдывается только: информационно, функционально, визуально.
Правило 2: «Гармония в контрасте»
Шрифты одной пары обязаны быть в равной мере как непохожими, так и похожими друг на друга. Добивайтесь гармонии в контрасте. Удачное сочетание образуют шрифты, у которых общие черты. На практике добиться гармонии сложно: признаков несовместимостей шрифтов много. Главная причина… в их слишком большом сходстве.
Правило 3: «Размер, начертание, цвет – разве товарищей нет?».
Исходя из правила 2, как шрифтовую пару можно использовать один и тот же шрифт! Контраст создадут размер кегля (или написание в режиме «ЗАГЛАВНАЯ/прописная»), начертания (нормал, болд (жирный) и италик (курсив)), наклон (вместо курсива) и цветовые решения (цвет символов) и дизайнерские решения-аксессуары (вроде теней и прочего). Данное правило, подтверждает всякий текстовой редактор, организующий текст на странице.
3 самых важных правил типографики в веб дизайне и главные тенденции.
Ничто не мешает использовать размер, начертания и цвет в виде усиления контраста и гармонии при использовании в паре других шрифтов. Но тут важно, соблюсти баланс. Ведь визуальные варианты одного шрифта обречены на общие черты, в отличие от пары разных.
Хотя, сложности возникают и одного шрифта, если он лишен вариантов характеристик указанных выше или они порождают нечитаемым текст.
Правило 4. «Каркас – всему голова»
Гармоничное сочетание шрифтов создается, если в них присутствуют общие элементы в каркасе символов, но они обязаны отличаться как минимум по одному пункту, но не более, чем по четырем признакам. Иначе шрифты не совместимы друг с другом.
На базе близкого каркаса сочетаются шрифты с засечками и без. Антиква и Гротеск, например.
«Плодородно» поле каркаса на «скрещивание» шрифтов одного семейства. Шрифты семейств serif и sans serif — обладатели широкого выбора толщин и начертаний, ширины символов и межсимвольного расстояния. Это дает до 40 вариантов написания даже у одной шрифтовой пары.
Правило 5. «Подобное к подобному».
При сведении в пару неродственных шрифтов рекомендуется тщательно их сравнивать. Наложить слово, набранное гарнитурами-претендентами на парность друг на друга. Чем меньше отличий, чем гармоничнее пара.
Правила 6. «Фи. Какая гадость!».
Ряд шрифтов в дизайнерской среде считается моветоном, признаком отсутствия вкуса. Назовем несколько из них: lobster, Papyrus, Curlz, Comic sans и подобные. Не сказать, что кто-то где-то просто решил, что они плохие, и все. Эти шрифты из-за своей «разлапистой» графики и вправду с трудом сочетаются с другими. К тому же они «настроенческие» (см. правило 7).
Правило 7. «Когда очень хочется, то можно. Но осторожно!».
(Только для опытных дизайнеров и любителей экспериментировать!)
Можно добиться гармонии и при несочетающихся шрифтах. Эта сложная задача, доступная только опытному дизайнеру, и осуществима, если такая необходимость оправдана.
Абзацы (элемента набраны разными гарнитурами) для того чтобы подчеркнуть разность их содержания. В таком случае рекомендуется выбрать основной шрифт, который будет акцентом внимания.
Наберите одно слова разными шрифтами. Даже стандартные начертания одного шрифта создают настроения. Нормал – нейтрален, жирный – усиливает внимание к себе, курсив – создает некую интимную атмосферу. Разные сочетания могут дать неожиданные положительные эффекты.
С настроением шрифта нужно работать аккуратно: легко перестараться. Текст быстро визуально перегружается и разваливается.
Можно назвать высшим пилотажем дизайна. Доступен при хорошем графическом вкусе, который вырабатывается опытом. Шрифты используются на первый взгляд непохожие, но в них находятся такие общие и тонкие мелочи как:
• засечки;
• толщина штрихов;
• ширина символов;
• расстояния между символами;
• оформление контуров и теней;
• декоративные элементы;
• пластика шрифта;
• заполнение знаков;
• художественный стиль;
• и прочее подобное.
Таблица сочетания шрифтов
Накопленный дизайнерский опыт, порожденный методом проб и ошибок, воплотился в несколько вариантов таблиц, с помощью которых без труда можно подобрать шрифтовую пару.
Не стоит воспринимать такие таблицы, как догму, но как рекомендацию использовать можно и нужно.
Предлагаем такой вариант, шрифтов, конечно, существует много больше. Выбраны популярные. Количество звездочек – оценка по пятибалльной шкале.
Онлайн сервисы для подбора шрифтовых пар
Type Genius. Здесь можно подобрать шрифт, а заодно и пару к нему.
Font Pair. Название сервиса говорит само за себя. Нужный шрифт тут же можно закачать на компьютер.
Typ io. Выбор основного шрифта, затем его напарника. Можно наглядно увидеть, в чем сочетается пара.
Typespiration. Сайт примеров и рекомендаций по подбору шрифтовых пар.
Примеры готовых пар
Интернет-дизайн и типографский печатный дизайн существуют не один десяток лет, поэтому уже давно сложились устоявшиеся зарекомендовавшие себя пары.
Хорошие шрифтовые пары для:
Roboto
Шрифт Roboto близок к курсивному написанию, но при этом символы остаются прямыми. Подбираем схожие в элементах шрифты. Используем указанные выше сервисы. Идеальным сочетанием при использовании Roboto в заголовках видятся Bookman Old Style.
Приятный результат дают:
Текст в Roboto хорош, если заголовок идет тем же шрифтом. Хорошо смотрятся заголовками:
Proxima nova
Лучшими парами к этому шрифту семейства Sans Serif будут:
Для полного понимание как сочетать шрифты смотрите видео:
Montserrat
Еще один шрифт Sans Serif. Лучше всего сочетается с:
Readymag.com
Сайт для создания журналов в Интернете также может быть использован для подбора шрифтов, но уже с конкретной целью. На сайте имеется необходимый инструментарий для работы с web-журналами.
Google fonts
Сервис-библиотека от Google, позволяющий работать со шрифтами в Интернете. Шрифты бесплатны для загрузки и имеется интерактивный просмотр, возможности их изучать.
Лучшие шрифтовые пары
Называть какие-то пары совсем уж лучшими будет неправильно. Абсолютно лучших не существует. Устоявшиеся сочетания (классику) названы выше, а лучшая шрифтовая пара у каждого дизайнера своя. Все зависит от вкуса, задач которые возлагаются на шрифты и настроения. Удачи в творческом поиске!
Лучшие сочетания шрифтов, которые будут работать для вашего бизнеса
Обновлено 1 октября, 2020
Подобрать удачную комбинацию шрифтов для сайта, буклета или презентации кажется сложной задачей? Секрет успеха — в насмотренности и понимании основных принципов. И тем, и другим мы поделимся в статье: объясним, чем руководствоваться, подбирая шрифтовую пару, приведем примеры беспроигрышных комбинаций и сервисами, которые помогут вам в работе.
Общие правила комбинирования
Основных принципов правильного сочетания шрифтов всего два: соответствие и контрастность.
В случае соответствия гарнитуры дополняют друг друга по одному или нескольким признакам: стилю, пропорциям, насыщенности или любым другим. Это самый простой способ подобрать пару и не ошибиться.
Контраст — более сложный, но и более оригинальный способ. Визуально надписи кажутся разными, но благодаря одному-двум общим атрибутам хорошо смотрятся вместе. Существуют десятки таких признаков, например, X-высота (мера высоты строчных букв, зависящая от высоты «x»), ширина символов, межбуквенные расстояния.
Расскажем о правилах, которые помогут безошибочно подобрать шрифтовую пару как для соответствия, так и для контраста:
Примеры готовых комбинаций
Дизайнеры не советуют использовать в больше трех гарнитур в одном контексте. Оптимальное их количество — две. Приведем примеры комбинаций, выбрав которые, вы точно не ошибетесь.
Montserrat & Courier New
Беспроигрышный контраст классики и современности. Универсальный Montserrat без засечек входит в коллекцию Google-шрифтов, созданных специально для интернет-пользователей, а Courier New знаком нам еще со времен пишущих машинок. Такая пара подойдет брендам, которые хотят подчеркнуть связь между прошлым и настоящим.
Alegreya Sans SC & Source Sans Pro
Пример универсальной согласованности, которая будет гармонично выглядеть на любых носителях и в любых контекстах. Alegreya Sans SC — семейство малых заглавных букв в каллиграфическом стиле. Его дополняет лаконичный Source Sans Pro, созданный для Adobe и предназначенный для работы в пользовательских интерфейсах.
Helvetica Neue & Garamond
Классическое смешение популярных гарнитур в контрастных стилях: Helvetica Neue и Garamond. Советуем рассмотреть эту пару, если вы хотите, чтобы брендинг воспринимался как вневременной, понятный и стильный.
Lora & Merriweather
Lora — это хорошо сбалансированные шрифты, напоминающие каллиграфию. Благодаря умеренной контрастности они подойдут для основного текста. Для заголовка можно использовать Merriweather, который отличается большой Х-высотой и слегка сжатыми символами. Обе гарнитуры с засечками, а потому ассоциируются с классикой и элегантностью.
Proza Libre & Open Sans
Такая комбинация выглядит современно благодаря минимализму. Proza Libre с чистыми мягкими формами предназначен для визуализации на экранах. Open Sans с нейтральным, но дружелюбным внешним видом и высокой разборчивостью отлично работает не только в интернете, но и при печати.
Libre Baskerville & Source Sans Pro
Пример контрастности, где одна гарнитура доминирует, а вторая дополняет ее. Libre Baskerville — семейство веб-шрифтов, оптимизированное для основного текста. Несмотря на засечки, буквы остаются разборчивыми даже в небольших размерах на любом экране. Source Sans Pro подойдет для заголовков, создавая лаконичный дизайн.
Rubik & Karla
Оптимальное сочетание для брендов, которые хотят показать свою близость к пользователям. Универсальный и пропорциональный Rubik служит идеальным дополнением, меняя характер в зависимости от «соседа». Доминантой в этой паре выступает Karla, который выделяется намеренной неаккуратностью — не идеально выверенным межбуквенным расстоянием.
BioRhyme & Space Mono
Яркий контраст понравится смелым компаниям, которые хотят показать характер. BioRhyme с плоскими заметными засечками отсылает к ретро, а моноширинный (с одинаковой шириной всех символов) Space Mono — к современности. Объединяет гарнитуры то, что обе построены на геометрической основе.
Archivo Black & Roboto
Комбинация работает по принципу схожести. Archivo Black был создан для использования в заголовках, а Roboto — для работы в системе Android. Оба начертания смотрятся открыто и дружелюбно, что подойдет демократичным брендам.
Montserrat & Source Sans Pro
Еще одно нейтральное смешение удобочитаемой типографики. И Montserrat, и Source Sans Pro лаконичны, универсальны и были созданы для интернет-платформ. Эта пара будет хорошо работать на сайте или в блоге, не отвлекая внимание от содержания.
Oswald & Merriweather
Пример контраста, объединенного пропорциями символов. Oswald — современная переработка классики с вытянутыми вверх буквами и небольшими интервалами. Merriweather с засечками тоже отличается слегка сжатыми символами. Советуем выбирать эту пару тем, кто хочет показать строгость, собранность и элегантность.
Сервисы, которые помогут в работе
Беспроигрышный способ удачно подобрать сочетание — воспользоваться специальными сервисами, которые предложат готовые варианты.
Google Fonts
В коллекции Google к каждому шрифту предлагаются несколько схожих или контрастных вариантов. Удобно, что в рамках каждого из них можно выбрать вес букв и сразу увидеть результат на примере текста.
Typeconnection
Любите игры? Сервис предлагает освоить навыки в игровой форме, составляя из гарнитур пары для свиданий. Начните с выбора главного героя и подбирайте ему подходящую пару, попутно изучая полезные термины и получая советы.
Typography
Как и Google, этот сайт перечисляет несколько подходящих сочетаний для каждого начертания. Правда, примеры здесь небольшие и изменить вес символов нельзя.
Logaster
Онлайн-генератор подойдет тем, кому нужны не только шрифты для логотипа. Введите название компании, слоган — и сервис предложит несколько десятков уже готовых вариантов. Каждый из них по желанию можно отредактировать.
Сгенерируйте множество логотипов с разными шрифтами в пару кликов!
Воспользуйтесь готовыми сочетаниями, составленными нашим сервисом: весь процесс займет несколько минут
Выводы
Жестких правил сочетания шрифтов не существует: при выборе стоит отталкиваться прежде всего от задачи, которую выполняет текст, и от настроения, которые вы хотите передать. Чтобы соблюсти тонкий баланс между контрастом и схожестью, советуем придерживаться основных принципов, которые вы узнали из этой статьи, а если сомневаетесь в результате — обращаться к профессиональным сервисам.
Обновлено 1 октября, 2020
Редактор блога компании Logaster, контент-маркетолог. Эксперт по веб-маркетингу и брендированию. Умеет писать просто о сложном. По ее статьям можно построить успешный бренд и начать успешное продвижение в интернете.