с чем сочетается comfortaa
Дизайн для недизайнеров: 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 самых важных правил типографики в веб дизайне и главные тенденции.
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, позволяющий работать со шрифтами в Интернете. Шрифты бесплатны для загрузки и имеется интерактивный просмотр, возможности их изучать.
Лучшие шрифтовые пары
Называть какие-то пары совсем уж лучшими будет неправильно. Абсолютно лучших не существует. Устоявшиеся сочетания (классику) названы выше, а лучшая шрифтовая пара у каждого дизайнера своя. Все зависит от вкуса, задач которые возлагаются на шрифты и настроения. Удачи в творческом поиске!
15 сервисов для подбора шрифтовых пар
Шрифт является важной частью дизайна – правильно подобранный шрифт может сделать сайт более удобным для пользователей, кроме того, хороший читаемый шрифт способен украсить любой графический проект. Но при подборе шрифтов нужно учитывать множество нюансов, особенно, когда в проекте используются более двух различных начертаний. Если дизайнер считает, что в работе необходимо использовать более одного шрифта, то он должен помнить, что ему придется потратить много времени для поиска гармонично сочетающихся между собой гарнитур. Можно ли как-нибудь ускорить этот процесс? Да, можно, если использовать инструменты и сервисы для подбора шрифтовых пар. С помощью этих инструментов можно очень быстро определиться с основным шрифтом и сразу же найти шрифт, который будет являться дополнительным. Большинство этих инструментов очень просты в использовании, однако они не гарантируют, что предложенные варианты шрифтов идеально впишутся в ваш проект. В этом вопросе дизайнер должен в значительной мере полагаться на собственный опыт и вкус и использовать веб-сервисы для подбора шрифтовых пар как проверочный инструмент.
Веб-сервис от Google предлагает большое количество очень качественных шрифтов, доступных для бесплатного скачивания. С помощью Google Type можно быстро найти подходящее сочетание шрифтов, которые будут хорошо смотреться как в цифровой среде, так и на физических носителя. Данный проект развивается силами энтузиастов, предложенных вариантов пока еще мало, но любая шрифтовая пара подобрана опытными дизайнерами, так что насчет идеального сочетания шрифтов можно не беспокоиться.
Type Genius – это инструмент для быстрого подбора шрифтов от сервиса Canva. Пользоваться им очень просто – нужно лишь выбрать подходящий шрифт и сервис сам подыщет подходящую пару. Как будут сочетаться шрифты между собой, можно увидеть после того, как пользователь определится с основным шрифтом.
Сервис Just My Type предлагает всего несколько тщательно подобранных шрифтовых пар, но это действительно хорошо сочетающиеся шрифты, которые идеально подходят друг другу. Создатель сервиса Дэниэл Эден предупреждает, что его выбор не должен влиять на окончательное решение дизайнера. Типографика это все же искусство и в вопросе выбора шрифтов нужно доверять своему вкусу.
Blender является очень удобным инструментом по выбору подходящих шрифтов для своего проекта. Все работает очень просто – нужно выбрать фрагмент текста, например, заголовок, подзаголовок или абзац и указать название шрифта. Результат изменений отобразится в том же окне. Таким образом можно быстро найти шрифты, которые будут хорошо смотреться вместе.
Сервис Font Combinator by Typotheque позволяет подбирать шрифтовые пары путем перетаскивания нужного начертания непосредственно в текст. В отличие от других подобных инструментов, здесь есть поддержка кириллицы, что не может не радовать. Все, что нужно сделать пользователю – это выбрать шрифт и перетащить его мышкой на заголовок или в основной текст. Выбор шрифтов предлагается небольшой, но зато все они хорошо сочетаются между собой.
Инструмент Type Connection некоторым может показаться слишком сложным в использовании. Если другие сервисы предлагают проверенные шрифтовые пары, то в случае с Type Connection дизайнеру нужно выбрать одну из четырех предложенных стратегий. То есть сначала выбирается основной шрифт, затем стратегия, а уж потом сервис предлагает несколько вариантов на выбор. Предлагаемые варианты не гарантируют, что шрифты будут хорошо смотреться вместе, так что окончательное решение дизайнер должен принять сам.
Сервис Font Pair будет полезен как новичкам, так и опытным дизайнерам. Это действительно мощный инструмент, с помощью которого можно найти очень удачное сочетание шрифтов. На главной странице можно увидеть большое количество хороших шрифтовых пар, но при этом дизайнер может расширить поиск, указав тип шрифта: с засечками, без засечек или курсив. После того, как шрифтовая пара будет найдена, ее сразу же можно скачать на свой компьютер. Это очень удобно и существенно ускоряет работу с типографикой.
На сайте Typewolf.com можно найти множество интересных шрифтовых пар, которые украсят любой дизайн. Все примеры носят рекомендательный характер, окончательный выбор остается все же за дизайнером. Выбор шрифтовых пар невелик, но зато на сайте можно найти множество подборок с советами по выбору шрифтов, к примеру, там есть подборки с альтернативами таким популярнейшим семействам, как Helvetica или Futura.
Инструмент Typ.io поможет выбрать основной шрифт и быстро найти ему подходящую пару. Выбор шрифтов не очень большой, однако сервис показывает, как шрифты сочетаются между собой, что позволяет быстро сделать правильный выбор.
Сервис Font Combinator рассчитан на опытных дизайнеров, которые хорошо знают, какие бы шрифты они хотели бы задействовать в своих проектах, но все же не уверены в конечном результате. С помощью этого инструмента можно искать удачные сочетания шрифтов, регулируя такие параметры, как название, тип, размер и цвет шрифта.
Инструмент Adobe Typekit позволит быстро найти и приобрести различные шрифты, которые можно задействовать в своих проектах. Компания Adobe гарантирует высокое качество всех предлагаемых шрифтов, так что самой большой проблемой для дизайнера будет его окончательный выбор шрифтовой пары.
Иногда дизайнеру требуется вдохновение для того, чтобы подобрать удачное сочетание шрифтов. В этом случае стоит обратить внимание на сервис Typespiration. На этом сайте можно найти множество впечатляющих примеров, более того, каждый шрифт сопровождается краткой аннотацией и советами по его использованию. Инструмент позволяет не только найти идеальную шрифтовую пару, но и подобрать цвета для заголовков, подзаголовков и основного текста.
Сервис Font In Use поможет найти множество интересных шрифтов и шрифтовых пар. Дизайнеры, которые работают с данным сервисом, демонстрируют, каким образом можно задействовать шрифты в своих проектах. Неплохой ресурс для поиска вдохновения, однако новичкам следует использовать данный сервис в сочетании с инструментами, позволяющими сделать выбор шрифтов более безопасным и предсказуемым.
На сайте The Art of Combining Fonts можно найти несколько полезных советов по подбору шрифтовых пар. Однако на сейте нет никакого функционала, позволяющего найти удачное сочетание шрифтов там, просто рекомендации, некоторые из которых достаточно спорные.
Сервис The Art of Mixing Typefaces это своеобразная шпаргалка для дизайнеров, позволяющая быстро найти подходящие друг другу шрифты. Пользоваться шпрагалкой очень просто – выбираете шрифт по вертикальной оси и затем смотрите, с каким шрифтами его можно использовать.
Что не так со шрифтом Comfortaa
И почему его не стоит использовать для больших текстов на русском языке.
«Комфорту» любят за ее плавные округлые формы, поэтому часто используют в презентациях и КП. Сегодня я получил документ, полностью набранный «Комфортой», и понял — пришло время привлечь внимание к проблеме и рассказать, почему это новый «Комик Санс».
В самом шрифте нет ничего зазорного — это современный гротеск с четкой округлой геометрией и скругленными концами букв. Наверное поэтому люди далекие от дизайна используют ее в своих документах — получается «повеселее», чем стандартным шрифтом. Но есть пара нюансов.
Изначально шрифт создавался на английском языке — это называется «латиница». Поэтому автор при разработке не учитывал русский язык и задал правила построения, которые хорошо легли на все латинские буквы.
Кириллицу делать сложнее, потому что у нас есть буквы с удивительной геометрией, например: ж, щ, ъ, ы, д. Они сильно влияют на визуальную массу шрифта и логику построения букв в целом. Как должна выглядеть строчная «т»? Как сделать округлую «г»?
В русском варианте появились и острая «л», и «т», похожая на «м», «п» как английская «n», «и» как «u» и сложные «г», «ф», «ц», «ы». Логика построения букв усложнилась и набор стал неравномерным — тут даже не дизайнеры должны уловить разницу.
Если не видите разницы, обратите внимание, насколько тяжелее русская «у» или сочетание «Съ».
«Комфортаа» довольно выразительный шрифт — у него есть настроение и характер, он выделяется на фоне других гротесков. И как всякий выразительный шрифт, он хорошо смотрится в коротких форматах и ужасно — в больших текстах. Например сегодня я получил вот такой документ:
Подобный шрифт уместно использовать в логотипах, им можно выделить заголовок, но я все чаще встречаю его в многостраничных документах, где его банально сложно читать. Сравните:
Если вы не заметили разницы, обратите внимание на слова типа «сердито» — в этом тексте вы легко его поймете, но в «Комфорте» получается что-то вроде «cepgumo». Tak moжe nолучumcя nонuмamь, gо nоры go временu, npocmo несmанgарmные буквы mяжелее чumamь. Мжно и ткст с пропщнми бквми прочтать, но зчем?
Из этих двух пунктов следует простой вывод:
Не используйте шрифт «Comfortaa» и ему подобные для больших текстов на русском языке
Читатели скажут вам: «Спасибо». А этот шрифт можно оставить для заголовков, коротких текстов и логотипов, особенно на английском.
Краткое содержание: «Шрифт не подходит для больших текстов»
Лично мне в приведенном примере округлый текст читается легче и быстрее чем правый вариант
по моему вы привираете, он даже теоретически не может проще читаться, шрифты как и прочий визуал, это не про нравится/не нравится, а про науку
в смысле привираете? зачем? я говорю как есть, мне текст справа кажется более слипшимся и отдельные буквы там видеть сложнее.
Начинается, дизайн у нас теперь не субъективная вешь, а оказывается наука, ну-ну.
Начинается, дизайн у нас теперь не субъективная вешь, а оказывается наука, ну-ну.
Да
Признаю, до этого понимание надо дорасти, почитать-поизучать всякого, непричастный к дизайну и вообще к разработке человек обычно не будет этим заниматься и даже пытаться осознать. Хотя как правило обывателю должно быть достаточно понимания, что корпорации не будут вкладывать миллионы в исследования и разработку «субъективной вещи», вроде простая истина же, разве нет?
Так если бы он так и написал — ты же первым бы его и запинал фразами типа «А где пруфы» и «Бред, не верю» 🤭
В следующей статье мы рассмотрим неудобство деловых писем, набранных в неверной раскладке. Jyb djj,ot yb[ez yt xbnf.ncz
Подобный шрифт круто сработает, если с символами повезет
очередной горе-дизайнер пытается оправдать свое существование.
кому как нравится, тот так и пишет. comic sans ему, видите ли, не устраивает
Нет там тонкости никакой.
Это как с татьянычем: в среде глупых хипстеров и почитателей Айн Рэнд принято считать его дизайнером, еще и очень умным впридачу. Ну а он блогер, да еще и тупой, как пробка. И вот как он в бложике тупость ляпнет очередную, все они начинают видеть в тупости «тонкость» и «постиронию».
Это всё фигня. В одной из компаний я видел корпоративный портал, в котором основным шрифтом был корпоративно-брендбучный Avant Garde Gothic Extra Light. Вот это был действительно ад.
Статья интересная, но вот это:
«Tak moжe nолучumcя nонuмamь, gо nоры go временu, npocmo несmанgарmные буквы mяжелее чumamь. Мжно и ткст с пропщнми бквми прочтать, но зчем?»
Дизайнер, который примерно понимает правила набора текста, не стал бы использовать этот шрифт в принципе. Я надеялся, что здесь автор альтернативу даст какую-то. А по факту, таких статей можно с каждым шрифтом написать.
Тут проблема скорее в том, что его используют как раз не дизайнеры, а например менеджеры, которые сделали огромное КП и выбрали этот шрифт, чтобы было «не так скучно».
для лого самое то, и пунктов меню.
еще можно и жирной обводкой усилить
Прошу прощения. На скриншоте ««Comfortaa» рядом с «Inter»» рядом не Inter, кроме слова «Inter». Спасибо
шрифт явно более заголовочный и может оченнь выигрышно смотреться в комбинации с каким нибудь гротеском / было бы очень интересно услышать мнение автора на решение этой проблемы юзабилити, и показать возможные wombo-combo с использованием этого шрифта как акцента )
В мелком кегле читается на порядок лучше мириада. Есть такое понятие как дисплейные шрифты и обычные. Поэтому печатный мириад сравнивать с комфортой некорректно. Это раз. У комфорты свой характер, но не сильно выразительный. То что надо для набора небольших текстов (на сайтах например. Книгу набирать, согласен, не стоит), заодно он добавляет «изюма» каким нибудь женским ресурсам например. Единственное что в шрифте стоило бы доработать: е, ф, в. В наборе просвет внутри букв плотноват. Глаз запинается пока. Это как раз для наборных критично. Так что аналитическая попытка провале на на на мой взгляд. Но спасибо за саму попытку. По правде говоря такие анализы всеж шрифтовики должны делать, у них глаз нечеловеский 🙂 по опыту общения знаю. ред.
Это история моего прошлого проекта: ошибок, выводов и опыта, который я применил при создании нового стартапа.