лучший бесплатный сервис подбора шрифта онлайн
Друзья, когда я только начинал вести блог с обзорами бесплатных онлайн сервисов, я написал статью о сайте Texster, который позволяет легко и просто подобрать шрифт под свои нужды. Сервис безусловно хорош, но в нем можно посмотреть отличия только между 15 видами шрифтов. Для того, кто занимается дизайнерской работой, это конечно же недостаточно…
Недавно я начал использовать новый онлайн сервис подбора шрифтов, который мне очень понравился. В нем куча функций, большой выбор установок и наглядная форма вывода результата. Думаю, это лучшее из того, что есть на сегодняшний день, поэтому как всегда, я спешу поделиться этими знаниями с Вами!
TypeTester – подбор шрифта онлайн. Этот сервис был специально разработан для того, чтобы сделать процесс сравнения различных видов шрифтов и их параметров очень легким и удобным. Хоть он и на английском языке, но в нем абсолютно все понятно, а после прочтения данной статьи Вы сразу начнете в нем работать так, как если бы знали его всю жизнь )).
В самое верхнее окошко нужно ввести любой фрагмент текста, как говорят некоторые «написать шрифтом онлайн» )). Можно просто набрать текст на клавиатуре либо вставить его из буфера обмена. Сервис прекрасно понимает кириллицу, в отличие от многих остальных, что безусловно играет ему только в плюс.
Под окошком с текстом Вы увидите три колонки с окошками для изменения параметров шрифта. Параметры каждой из колонок можно изменять независимо от другой. Благодаря этой возможности и осуществляется подбор шрифта )).
Вот какие параметра шрифта Вы можете задавать и сравнивать:
— семейство
— размер
— высота строк
— расстояние между буквами
— выравнивание
— расстояние между словами
— украшения (верхнее-нижнее подчеркивание, перечеркивание)
— цвет букв
— цвет фона
Допустим Вы хотите сравнить между собой три различных шрифта и выбрать тот, который лучше всего смотрится… Нет ничего проще! Каждой колонке назначьте свой шрифт и Вы сразу наглядно на заданном Вами фрагменте текста увидите разницу между ними. Как видите, подбор шрифта еще никогда не был таким легким!
Выбор шрифтов для сравнения и подбора здесь действительно впечатляет! Весь список шрифтов делится на ряд групп:
- safe list (эти шрифты безопасно использовать на сайтах)
- Win default (дефолтные системные Windows)
- Mac default (дефолтные системные Mac)
- Windows Vista (шрифты Windows Vista)
- Google fonts (шрифты Google)
Более того, Вы всегда можете выбрать для сравнения иное семейство шрифтов из огромного списка. Для этого служит окошко «… or specify your own». Вот за что я люблю данный онлайн сервис подбора шрифтов! ))
Семейство и необходимые параметры шрифта Вы подобрали. Что же дальше? Как сделать так, чтобы перенести все настройки, к примеру, на сайт? Всё делается легко и просто!
В закладке «tools» справа от окошка ввода текста найдите строку «Get CSS for: 1st 2nd 3rd column». Допустим, Вам больше всего нравится, как выглядит текст во второй колонке. Тогда нажимайте «2nd» и в отдельном окошке браузера появится стиль для шрифта, который надо просто скопировать в файл css.
ВСЁ! Те, кто в курсе, поймут, как много времени это экономит! ))
Друзья, сервис TypeTester – это лучшее, что я встречал для того, чтобы сделать подбор шрифта онлайн быстро и эффективно. Это однозначный «must have» для всех, кто занимается дизайнерской работой, особенно в сфере веб-дизайна!
Автор статьи: Сергей Сандаков, 40 лет.
Программист, веб-мастер, опытный пользователь ПК и Интернет.
Интересные сервисы для работы со шрифтами
Подбор шрифтов:
— http://fontstorage.com/ — База шрифтов с возможностью подбора и вывод в CSS
— http://www.typetester.org/ — Тестирование и подбор шрифтов, вывод в CSS.
— http://csstypeset.com/ — Работа с разными стилями и атрибутами текста и вывод в CSS.
— http://www.designerplaything.co.uk/designer-plaything.html — Подбор шрифта и цвета.
— http://www.texster.ru/ — Помощник в выборе шрифта.
— http://flippingtypical.com/ — Просмотр вашего текста в разном стиле.
— http://www.stcassociates.com/lab/fontbrowser.html — Аналогичен предыдущему (более расширен).
— http://www.blindtextgenerator.com/ru — Русский онлайн Lorem Ipsum генератор.
— http://wordmark.it/ — Просмотр вашего текста в разных стилях.
Распознавание шрифтов:
— http://www.myfonts.com/WhatTheFont/ — Определение шрифта по образцу.
— https://www.fontspring.com/matcherator — Определение шрифта по образцу.
— http://www.identifont.com/identify.html — Выявляет шрифт через ряд вопросов о нем.
— http://www.typophile.com/ — Крупнейшее сообщество на тему шрифтов.
— http://www.bowfinprintworks.com/ — поиск шрифтов по образцам.
— http://www.fontshop.com/research/ — выясняет название по форме отдельных символов.
— http://www.flickr.com/groups/typeid/ — определяет названия шрифтов, используемых в различных изображениях.
— http://fount.artequalswork.com/ — бесплатный онлайн сервис для моментальной идентификации шрифта.
Скачать шрифты:
— http://www.xfont.ru/ — Крупнейший сервис по шрифтам.
— http://www.fontov.net/ — бесплатный русскоязычный сервис для поиска и подбора интересующегося Вас шрифта.
— http://ifont.ru/ — Большой русскоязычный сервис шрифтов.- http://www.dafont.com/ — шрифты с просмотром вашего примера.
— http://www.fonts-online.ru/ — База шрифтов с просмотром Online
Прочее:
— http://fontstruct.com/ — создание собственных шрифтов Online
— http://fontark.net/farkwp/- Конструктор шрифтов Online
— http://www.fontsquirrel.com/fontface/generator — загрузка и доработка ваших шрифтов.
— http://pxtoem.com/ — Переводит одни единицы измерения шрифтов в другие.
— http://csswarp.eleqtriq.com/ — Онлайн сервис для подготовки эффектного текста.
— http://www.bestwebfonts.com/ — Удобный сервис для просмотра веб-шрифтов, в том числе с применением различных эффектов.
Статью подготовил проект — textygram.ru
Как подобрать правильный шрифт для своего дизайна
Дизайнеры очень часто не уделяют должного внимание типографике, когда на самом деле — это очень важный аспект, от выбора которого нередко зависит качество дизайна. Шрифты так же важны для веб-сайта, как и изображения.
Типографика — это не просто выбор шрифта. Это также этап, на котором необходимо задумать о кернинге, трекинге и интерлиньяже. Частью типографики также является выбор цвета текста, расположение текста и даже дизайн страницы.
Эффективность сообщения, которое вы хотите передать своим сайтом, часто зависит от выбора гарнитуры. Хороший шрифт завлекает зрителя и влияет на его восприятие идеи.
Хорошо подобранный шрифт помогает зрителю получать удовольствие от чтения. Необходимо всегда выбирать шрифт к подходящей ситуации.
Выбор правильной гарнитуры также усложняется тем, что доступных для использования шрифтов очень много. Нельзя сказать, что есть какое-то определенное правило, помогающее подобрать правильный шрифт во всех случаях, но есть некоторые принципы, которые могут быть использованы в самых различных ситуациях и достойны дополнительного внимания.
Разборчивость очень важна
Для того, чтобы читающий мог понимать о чем идет речь, очень важно чтобы гарнитура была разборчивой. Существует множество факторов, которые необходимо учитывать, когда дело касается разборчивости текста. Эти факторы включают в себя размер, форму и ширину символов, визуальный веc, надстроечную и подстрочную длину, а так же контрастность штриха. Выбор качественного шрифта – хорошее начало для создания разборчивого текста, но из-за огромного количества различных шрифтов выбор сделать может быть очень непросто.
Определенные элементы текста могут показаться посетителям сайта выделенными, если изменить высоту или визуальный вес шрифта. Helvetica Neue например имеет не только жирный и курсивный, но и тонкий и ультра-тонкий. Такие шрифты очень полезны, если хочется сделать дополнительный акцент на гарнитуре сайта.
Самые понятные шрифты — те буквы у которых имеют привычную форму и общее характеристики которых наиболее постоянны. Для того чтобы шрифт казался пропорциональным приходится регулировать расстояние между символами – этот процесс называет кернингом. Таким образом улучшается вид шрифта в целом.
Качественные гарнитуры всегда разбиты на керн-пары позволяющее легко достигнуть нужного эффекта. Расстояние между буквами очень влияет на разборчивость шрифта, поэтому шрифты со слишком большими расстояниями между символами стоит избегать.
Самый часто задаваемый вопрос при выборе шрифта: с засечками или без?
Самые распространение категории шрифтов – это serif или sans serif. Serif – это шрифты с заческой на концах букв. Sans serif же, соответственно — шрифты, которые засечек не имеют.
Классифицировать эти шрифты не просто, так как и тех и других шрифтов немало. В целом, serif считаются более традиционными, а sans serif — современным. Serif шрифты иногда также считаются более четкими и легкими для прочтения.
Огромное количество хороших шрифтов существует и в той, и в другой категории. Можно намного лучше начать понимать шрифты, изучая различные классификации, такие как humanist, modern, slab serif, geometric, old style и transitional. Некоторые дизайнеры даже советуют создавать свои собственные категории для удобной работы с различными проектами.
Выбираем правильный шрифт для веб-сайта и используем их правильно
Очень важно чтобы типографика привлекала зрителей и сохраняла их внимание, поэтому шрифт должны легко читаться, быть приятными и аккуратным. Заголовки и подзаголовки должны привлекать внимание, а сам контент может быть выделен определенным образом с помощью курсива, жирного шрифта цвета или положения шрифта.
Размер шрифта тоже имеет не малое значение и этим фактором не стоит пренебрегать при создании дизайна веб-страницы. Стоит отдавать предпочтение более крупному шрифту, так как его проще читать при маленьком разрешении экрана, с планшетов, смартфонов и ноутбуков.
Текст и фон также не должны сливаться. Если фон темный, то шрифт должен быть светлым и наоборот. Это гарантирует разборчивость текста и таким образом вам будет проще донести смысл текста.
Комбинирование различных гарнитур также может быть очень эффективным. Важно помнить, что шрифты должны быть достаточно различны, чтобы необходимый эффект был достигнут. Хорошим выбором будет один шрифт serif и один шрифт sans serif. Это создает контраст, который придает тексту слаженность, особенно, если это шрифты одного и того же дизайнера.
Выбор правильного шрифта для печати
Правильно подобранный шрифт поможет создать хорошее первое впечатление. Хорошо подобранная комбинация шрифтов поможет выделиться и запомниться. При этом не имеет значение печатный бланк ли это, визитная карточка или просто листовка.
Шрифт не должен перекрывать смысл текста, так как это отвлечет от информации, которую вы хотите передать. Цель гарнитуры – упростить чтение текста, и если перестараться то читатель будет смотреть только на шрифт, не воспринимая сам текст.
При распечатке необходимо также обращать внимание на контрастность и яркость, следить за тем, чтобы шрифт выглядел также как и на экране. Это поможет дизайнеру определиться с тем достигается ли необходимый эффект с помощью выбранной гарнитуры или нет.
После того как шрифт был распечатан не лишним будет показать работу знакомым. Если выбор стоит перед несколькими шрифтами, то они могут помочь определится с выбором.
Окончательное решение о том какой шрифт лучше использовать остается за дизайнером. Нет правильного или неправильного шрифта, но некоторые смотрятся на бумаге лучше, чем другие.
Ты можешь выбрать шрифт для своего сайта или печати из наших статей со шрифтами. Большинство из них бесплатные, но ты также можешь найти несколько шрифтов премиум-класса.
Вывод
Самым лучшим всегда будет считаться шрифт наиболее подходящий для конкретного случая. Это значит, что гарнитура, которая выглядит лучше всех и, допустим, занимает немного место, не обязательно станет той, которая будет выбрана. Ожидания аудитории и требования клиента должны быть всегда учтены — это также хорошее начало для многих проектов.
Основной задачей подборки гарнитуры является привлечение зрителей. Цели, которые должны быть достигнуты с помощью работы должны всегда быть четко обозначены и направлены на целевую аудиторию. Не стоит также забывать о возрастной категории и интересах аудитории.
Проекты для аудитории заинтересованной в высоких технологиях, например, имеют свои требования. Гарнитура используемая в данном случае точно будет современной: выбор может стоять между угловатыми или плавными шрифтами. Шрифты не бывают плохими или хорошими, скорее, правильно будет сказать, что они бывают подходящими и неподходящими. Гарнитура не должна быть выбрана до тех пор, пока не станет понятно, кто будет читать тест и что должно быть донесено до аудитории.
Источник: say-hi.me
Фото на обложке: ShutterStock
Выбор шрифтов
Шрифт и текст
Шрифт – самый интересный и сложный из всех строительных материалов дизайнера. Ни одна работа не обходится без заголовков, логотипов, надписей и является самой ответственной частью любого проекта.
Большинство современных шрифтов, не могут быть плохими или хорошими – они могут лишь подходить или не подходить к конкретному случаю. Поэтому подбор оптимального шрифта и подгонка его по месту самая важная часть любого проекта.
Элементы шрифта
Гарнитура, начертание, шрифт
Гарнитурой принято называть набор начертаний одного шрифта, различающихся по толщине штрихов, ширине букв, общему рисунку и другим параметрам. Английский термин Font Family.
Основную массу шрифтов можно разделить на две большие группы: шрифты с засечками Serif и рубленные шрифты (без засечек) San Serif. В отдельный класс выделяют моноширинные шрифты, у которых одинаковая ширина всех букв и знаков.
ТЕКСТ | ТЕКСТ | ТЕКСТ |
Шрифт с засечками | Рубленный шрифт | Моноширинный шрифр |
Пример шрифта: Times New Roman | Пример шрифта: Arial | Пример шрифта: Courier New |
К остальным шрифтам лучше всего подходит термин «декоративные». К ним относятся всевозможные стилизации готический, древнерусский, рукописные, шрифты с наложением всевозможных эффектов. Кроме того, существуют шрифты, содержащие вместо букв специальные символы, декоративные элементы.
Виды начертаний
Из начертаний чаще всего используются прямое Roman и курсивное Italic. Курсивное начертание призвано имитировать наклонный в право, более округлый рукописный почерк, сохраняющий, тем не менее, графические особенности прямого начертания. Курсивное начертание есть у всех шрифтов с засечками и у большинства рубленных. Большинство декоративных шрифтов не имеют курсива вообще.
Прямое начертание Roman | Курсивное начертание Italic |
Второй важный параметр – это насыщенность, определяется толщиной штрихов и соотношением площади белого и черного в рисунке букв. Первая ступень насыщенности называется Bold Face «жирный шрифт». Этот параметр, в отличие от курсива, удобнее менять у рубленных шрифтов, — многие из которых имеют также светлое Light, жирное и даже сверх жирное начертание.
Обычное начертание | Жирное начертание |
С насыщенностью связанна еще одна характеристика шрифта – его ширина, как правило ширина букв слегка меняется при изменении насыщенности. У некоторых шрифтов есть особые варианты – сжатые или растянутые по горизонтали при неизменной насыщенности. Именно этим вариантом надо пользоваться, если необходимо изменить ширину надписи.
Еще один параметр текстового набора – кегль, т.е. размер шрифта
1 размер | 8 пт |
2 размер | 10 пт |
3 размер | 12 пт |
4 размер | 14 пт |
5 размер | 18 пт |
6 размер | 24 пт |
7 размер | 36 пт |
Подбор шрифтов
Композиция должна содержать минимальное количество резко различных, контрастирующих шрифтов.
Из всех типов шрифтов, идеальная пара – шрифт рубленный и шрифт с засечками. Шрифт с засечками удобнее для длительного чтения поэтому им набирают основной текст страницы. Рубленный шрифт лучше подходит для беглого чтения и поэтому лучше смотрится в заголовках, логотипах, коротких надписях.
Параметры набора
Подбор размера шрифта, расстояние между буквами и между строками нужно подбирать в сочетании с остальными элементами, чтобы основной текст был меньшего размера, чем заголовки на странице и т.д.Кегль
Ограничения на объем графических файлов на Web-страницах делают использование мелкого текста особенно привлекательным. Крупным шрифтом, как правило, набираются наиболее важные элементы страницы: логотипы, заголовки, вопросы и т.д. Для заголовков лучше использовать рубленный или декоративный шрифт.
Прописные и строчные
В заголовках и в других выделенных элементах могут использоваться различные стили – все заглавные, все строчные, только первая первые буквы всех значимых слов (английский вариант).
Интервалы
Огромное влияние на восприятие текста оказывают интервалы между символами, словами и строками абзацев. Чем меньше размер шрифта тем дальше должны стоять буквы .
Шрифты для сайта: как выбрать идеальное сочетание? 7 бесплатных инструментов
Сейчас доступно для загрузки и немедленного использования множество бесплатных шрифтов. Но на подбор нужного сочетания для вашего проекта может уйти много времени. Вариантов комбинации шрифтов бесчисленное множество. Как выбрать лучшее?
Проводите ли вы редизайн сайта или создаете инфографику, вам нужно сочетание шрифтов , которое выглядит профессионально, безупречно, и при этом не отвлекает внимание от контента. И, как правило, шрифты нужны срочно.
В ответ на этот запрос были созданы бесплатные сервисы, быстро и эффективно помогающие подобрать идеальное сочетание. Подбор шрифтов не будет длинным путём проб и ошибок, если есть под рукой готовые инструменты.
7 бесплатных инструментов
1) Google Fonts
Вы, вероятно, уже пользовались этим сервисом для выбора шрифта для своего веб-проекта. А вы в курсе, что он также предлагает готовые сочетания?
Из списка доступных шрифтов выберите нужный вам, наведите на область предпросмотра шрифта и нажмите на See Specimen.
Откроется детальная страница, где можно увидеть, как выглядит текст с этим шрифтом, поменять цвет фона страницы, выбрав инструмент «заливка» в правом верхнем углу страницы, посмотреть историю создания и применения шрифта.
Внизу страницы находится раздел «Популярные сочетания со шрифтом Х»
2) Type.io
Эта база шрифтов ведется дизайнерами-экспертами и позволяет увидеть трендовые сочетания шрифтов с реальных веб-сайтов. Еще можно заглянуть в код СSS, используемый для их стилизации и форматирования. Потратьте некоторое время на просмотр их впечатляющих архивов и классифицированных списков, и если наткнетесь на сайт который вас зацепит, просто нажмите на «Get Under the Hood».
Это позволит увидеть какие именно шрифты используются на сайте, доступны ли они для бесплатного скачивания или онлайн-покупки, а также увидеть, как они подключены в бэк-энде сайта.
Даже если вы не сильно разбираетесь в CSS, этот сервис все же достоин вашего внимания, и очень полезен для просмотра профессиональных типографских сочетаний в действии.
Функция поиска позволяет отфильтровать сайты по основному шрифту, желаемому виду шрифта, доступности шрифта. Можно посмотреть какие сочетания наиболее популярны на разных типах сайтов (в блогах, портфолио и т.д.)
3) Web font Blender
Web font Blender — минималистичный инструмент быстрого, интуитивного подбора шрифтов. Устроенный как большинство редакторских программ, этот сервис позволяет смешивать и комбинировать разные веб-шрифты, изменять шрифт основного текста, заголовков и настраивать стилизацию шрифта по вашему вкусу.
На ваш выбор большое количество популярных шрифтов и их настроек для подбора оптимального сочетания. Как только вы его нашли, вы можете скопировать CSS-код своего творения, нажав кнопку «Grab Code».
4) Fonts in use
Это независимый архив, посвященный демонстрации креативной типографики от дизайнеров со всего мира. Сайт, печатная продукция, дизайн упаковки или что-то еще – для всего команда кураторов Fonts in use способна подобрать интересные шрифтовые гарнитуры.
Для вдохновения достаточно просмотреть их многочисленные архивы, или взглянуть на примеры популярных в вашей отрасли шрифтов, выбрав пункт «Отрасли» в выпадающем меню. Если у вас уже есть нужный шрифт, но вы не знаете с чем его сочетать, можно отфильтровать результаты по виду шрифта.
5) Canva Font Combinations
Простой инструмент от Canva позволяет выбрать шрифт и мгновенно подобрать для него подходящую пару. Просто выберите первый шрифт из выпадающего меню, и сервис мгновенно подберет эстетически привлекательное сочетание.
Как только вы получили идеальную пару, можете настроить область предварительного просмотра, чтобы увидеть, как ваш контент смотрится в новом облачении.
6) Font Combinator
Font Combinator – инструмент типографии созданный голландской дизайн-студией Typotheque. Если вы ищете инструмент предварительного просмотра сочетания шрифтов со множеством вариантов настроек и кастомизации, больше не ищите.
В верхнем выпадающем меню можно выбрать уже готовые варианты сочетания шрифтов от Typotheque, или, используя настройки, сконструировать их комбинацию самостоятельно. Можно настроить размер шрифта, используя бегунки над каждым фрагментом текста. Если не нравится текущее сочетание, можно простым перетаскиванием вставить новый шрифт из правого списка.
7) Font Pair
Хейден Миллз, студент дизайнерского факультета университета Индианы, разработал этот инструмент для быстрого и безболезненного подбора проверенных сочетаний шрифтов, используя Google Fonts.
Каждое сочетание шрифтов, представленное на Font Pair, курируется самим Миллзом. Хотите проверить как будет выглядеть ваш собственный текст? Кликните на любой представленной паре шрифтов и введите свой контент.
15 сервисов для подбора шрифтовых пар
Шрифт является важной частью дизайна – правильно подобранный шрифт может сделать сайт более удобным для пользователей, кроме того, хороший читаемый шрифт способен украсить любой графический проект. Но при подборе шрифтов нужно учитывать множество нюансов, особенно, когда в проекте используются более двух различных начертаний. Если дизайнер считает, что в работе необходимо использовать более одного шрифта, то он должен помнить, что ему придется потратить много времени для поиска гармонично сочетающихся между собой гарнитур. Можно ли как-нибудь ускорить этот процесс? Да, можно, если использовать инструменты и сервисы для подбора шрифтовых пар. С помощью этих инструментов можно очень быстро определиться с основным шрифтом и сразу же найти шрифт, который будет являться дополнительным. Большинство этих инструментов очень просты в использовании, однако они не гарантируют, что предложенные варианты шрифтов идеально впишутся в ваш проект. В этом вопросе дизайнер должен в значительной мере полагаться на собственный опыт и вкус и использовать веб-сервисы для подбора шрифтовых пар как проверочный инструмент.
GOOGLE TYPE
Веб-сервис от Google предлагает большое количество очень качественных шрифтов, доступных для бесплатного скачивания. С помощью Google Type можно быстро найти подходящее сочетание шрифтов, которые будут хорошо смотреться как в цифровой среде, так и на физических носителя. Данный проект развивается силами энтузиастов, предложенных вариантов пока еще мало, но любая шрифтовая пара подобрана опытными дизайнерами, так что насчет идеального сочетания шрифтов можно не беспокоиться.
TYPE GENIUS
Type Genius – это инструмент для быстрого подбора шрифтов от сервиса Canva. Пользоваться им очень просто – нужно лишь выбрать подходящий шрифт и сервис сам подыщет подходящую пару. Как будут сочетаться шрифты между собой, можно увидеть после того, как пользователь определится с основным шрифтом.
JUST MY TYPE
Сервис Just My Type предлагает всего несколько тщательно подобранных шрифтовых пар, но это действительно хорошо сочетающиеся шрифты, которые идеально подходят друг другу. Создатель сервиса Дэниэл Эден предупреждает, что его выбор не должен влиять на окончательное решение дизайнера. Типографика это все же искусство и в вопросе выбора шрифтов нужно доверять своему вкусу.
BLENDER
Blender является очень удобным инструментом по выбору подходящих шрифтов для своего проекта. Все работает очень просто – нужно выбрать фрагмент текста, например, заголовок, подзаголовок или абзац и указать название шрифта. Результат изменений отобразится в том же окне. Таким образом можно быстро найти шрифты, которые будут хорошо смотреться вместе.
FONT COMBINATOR BY TYPOTHEQUE
Сервис Font Combinator by Typotheque позволяет подбирать шрифтовые пары путем перетаскивания нужного начертания непосредственно в текст. В отличие от других подобных инструментов, здесь есть поддержка кириллицы, что не может не радовать. Все, что нужно сделать пользователю – это выбрать шрифт и перетащить его мышкой на заголовок или в основной текст. Выбор шрифтов предлагается небольшой, но зато все они хорошо сочетаются между собой.
TYPE CONNECTION
Инструмент Type Connection некоторым может показаться слишком сложным в использовании. Если другие сервисы предлагают проверенные шрифтовые пары, то в случае с Type Connection дизайнеру нужно выбрать одну из четырех предложенных стратегий. То есть сначала выбирается основной шрифт, затем стратегия, а уж потом сервис предлагает несколько вариантов на выбор. Предлагаемые варианты не гарантируют, что шрифты будут хорошо смотреться вместе, так что окончательное решение дизайнер должен принять сам.
FONT PAIR
Сервис Font Pair будет полезен как новичкам, так и опытным дизайнерам. Это действительно мощный инструмент, с помощью которого можно найти очень удачное сочетание шрифтов. На главной странице можно увидеть большое количество хороших шрифтовых пар, но при этом дизайнер может расширить поиск, указав тип шрифта: с засечками, без засечек или курсив. После того, как шрифтовая пара будет найдена, ее сразу же можно скачать на свой компьютер. Это очень удобно и существенно ускоряет работу с типографикой.
TYPE WOLF
На сайте Typewolf.com можно найти множество интересных шрифтовых пар, которые украсят любой дизайн. Все примеры носят рекомендательный характер, окончательный выбор остается все же за дизайнером. Выбор шрифтовых пар невелик, но зато на сайте можно найти множество подборок с советами по выбору шрифтов, к примеру, там есть подборки с альтернативами таким популярнейшим семействам, как Helvetica или Futura.
TYP.IO
Инструмент Typ.io поможет выбрать основной шрифт и быстро найти ему подходящую пару. Выбор шрифтов не очень большой, однако сервис показывает, как шрифты сочетаются между собой, что позволяет быстро сделать правильный выбор.
FONT COMBINATOR
Сервис Font Combinator рассчитан на опытных дизайнеров, которые хорошо знают, какие бы шрифты они хотели бы задействовать в своих проектах, но все же не уверены в конечном результате. С помощью этого инструмента можно искать удачные сочетания шрифтов, регулируя такие параметры, как название, тип, размер и цвет шрифта.
ADOBE TYPEKIT
Инструмент Adobe Typekit позволит быстро найти и приобрести различные шрифты, которые можно задействовать в своих проектах. Компания Adobe гарантирует высокое качество всех предлагаемых шрифтов, так что самой большой проблемой для дизайнера будет его окончательный выбор шрифтовой пары.
TYPESPIRATION
Иногда дизайнеру требуется вдохновение для того, чтобы подобрать удачное сочетание шрифтов. В этом случае стоит обратить внимание на сервис Typespiration. На этом сайте можно найти множество впечатляющих примеров, более того, каждый шрифт сопровождается краткой аннотацией и советами по его использованию. Инструмент позволяет не только найти идеальную шрифтовую пару, но и подобрать цвета для заголовков, подзаголовков и основного текста.
FONT IN USE
Сервис Font In Use поможет найти множество интересных шрифтов и шрифтовых пар. Дизайнеры, которые работают с данным сервисом, демонстрируют, каким образом можно задействовать шрифты в своих проектах. Неплохой ресурс для поиска вдохновения, однако новичкам следует использовать данный сервис в сочетании с инструментами, позволяющими сделать выбор шрифтов более безопасным и предсказуемым.
THE ART OF COMBINING FONTS
На сайте The Art of Combining Fonts можно найти несколько полезных советов по подбору шрифтовых пар. Однако на сейте нет никакого функционала, позволяющего найти удачное сочетание шрифтов там, просто рекомендации, некоторые из которых достаточно спорные.
THE ART OF MIXING TYPEFACES
Сервис The Art of Mixing Typefaces это своеобразная шпаргалка для дизайнеров, позволяющая быстро найти подходящие друг другу шрифты. Пользоваться шпрагалкой очень просто – выбираете шрифт по вертикальной оси и затем смотрите, с каким шрифтами его можно использовать.
На этом все, спасибо за внимание!
Источник
Пошаговое руководство по сочетанию шрифтов и подбору шрифтовых пар
Если вы загуглите, как сочетать шрифты, то получите много ужасных результатов. На первой странице вы найдете сочетания, к которым ни один опытный дизайнер не прикоснется даже 3-метровой палкой. Google Fonts весело рекомендует сочетать буквально все с Open Sans и Roboto 🙄
В этой статье я собираюсь предоставить вам пошаговый план создания красивых сочетаний шрифтов профессионального качества.
1. Определите свой бренд
Пара шрифтов, которая отлично сочетается на одном сайте, может выглядеть нелепо на другом.
Причина в том, что у разных сайтов и приложений разные бренды.
Проще говоря, ваш бренд – это список прилагательных (или коротких фраз), которые описывают то, что вы хотите, чтобы ваши пользователи думали о вас.
Некоторым сайтам нужен бренд, который будет «понятным, простым и современным», другие хотят быть «роскошными, современными и стильными».
Но каким бы ни был ваш бренд, перечисление конкретных прилагательных и фраз упростит процесс выбора шрифтов.
Я опубликовал на YouTube видео, посвященное прилагательным, описывающим бренд – как их найти и как они влияют на дизайн.
Предстоящие воркшопы
В частности, в этом видео я рассказываю о 5 наиболее распространенных брендах, для которых начинающим UI-дизайнерам следует научиться проектировать:
- Понятный/Простой (Clean/simple)– современный, минималистичный
- Стильный/Модный (Classy)– роскошный, эрудированный, классический
- Дружелюбный (Friendly)– повседневный, неформальный
- Необычный/Причудливый (Quirky)– design-forward, креативный
- Технический/Технологический (Techie)– футуристичный, гиковский
(Посмотрите видео, чтобы увидеть несколько примеров каждого из них)
Мы будем использовать эти термины в качестве примеров на протяжении всей статьи.
Но каким бы ни был ваш дизайн, найдите время, чтобы придумать несколько прилагательных или коротких фраз, которые его описывают. На самом деле это значительно упростит весь остальной процесс.
2. Шрифты, которые ненавязчиво передают ваш бренд
Две самые большие ошибки новичков при выборе шрифтов:
- Выбор шрифта, не соответствующего вашему бренду.
- Выбор шрифта, чрезмерно подходящего вашему бренду (например, необычный шрифт).
Ключ к выбору хороших шрифтов – найти тот, который ненавязчиво передает ваш бренд.
Вот пример. Допустим, вы работаете над небольшим сайтом / приложением по истории Египта. Вам нужен профессиональный, понятный и информативный бренд, посвященный древней, грандиозной и немного загадочной теме. (Вы уловили идею? Это прилагательные нашего бренда)
Вот 3 попытки:
Если вы просматривали список шрифтов на своем компьютере, вероятно, вы знаете, что существует печально известный шрифт Papyrus, который в некотором смысле кажется идеальным, чтобы наконец использовать его на сайте, посвященном Египту. (Куда уместнее, чем на сайте школы по тхэквондо, сенсей которой занимался графическим дизайном 15 минут… или в фильме Avatar).
Увы, необычность такого шрифта редко обеспечивает хороший дизайн. Избегайте его – по крайней мере, пока не станете достаточно хорошим дизайнером, чтобы не читать эту статью 😉
Точно так же третий шрифт – Chakra Petch – хоть и хорош, но совершенно не подходит для бренда, который мы пытаемся представить. Угловатая техническая атмосфера лучше всего подойдет для игры «Outer Space: The 3 Kingdoms», понимаете?
Мы нашли золотую середину в виде шрифта Scala Sans, который выглядит так, будто он прямиком с музейной таблички.. Это то, что называют «гуманистическим» шрифтом без засечек, то есть его буквенные формы больше вдохновлены человеческим почерком, чем, скажем, геометрическими формами. И, как и многие гуманистические шрифты, он кажется точным и уточненным, как безупречный почерк.
Я не жду, что все начинающие дизайнеры заметят все эти детали. Я рекомендую новичкам просто использовать шрифты, которые они уже знают, как отличные. По мере того, как вы расширяете свой типографический кругозор, вы начнете замечать эти мелкие детали. И даже до того, как вы узнаете названия или категории, у вас разовьется способность инстинктивно выбирать хорошо выглядящие шрифты.
Какие еще шрифты ненавязчиво передают профессиональный, понятный и информативный, но в то же время древний, величественный и загадочный бренд?
Что ж, Scala более «профессиональный, понятный и информативный» шрифт. Для соответствия прилагательным «древний, величественный и загадочный» мы почти наверняка будем искать шрифт с засечками.
(Чтобы внести ясность, мы не ищем шрифт, который был бы грандиозным и загадочным – мы ищем шрифт, который бы изящно передавал величие и таинственность. Мы должны взять наш бренд и немного изменить его)
Давайте продолжим мозговой штурм. Вот что я обнаружил через несколько минут:
Менее чем за 10 минут я просмотрел более 100 шрифтов, но выбрал всего 4 в качестве претендентов. Я случайно выбрал два из них во время просмотра моего каталога шрифтов, один из «Таблицы хороших шрифтов» (для слушателей моих курсов «Learn UI Design»), а последний Trajan знал ранее (хотя у меня его нет, и пришлось искать похожие шрифты в Google). Станет ли один из них моим окончательным выбором? Без понятия! Но так начинается мозговой штурм.
На более широком уровне этот шаг связан с переводом прилагательных бренда в формы букв.
Например, один из 5 самых распространенных брендов – «необычный». Какие шрифты вы используете на необычном сайте? Давайте взглянем на веб-сайт Института Санте-Фе. Это отличный пример необычного / креативного сайта (хотя как технический институт он также будет иметь определенные «технические» элементы в своем бренде). Откройте его в новой вкладке – мы будем ссылаться на него на протяжении всей статьи.
Этот шрифт называется Chap, и все его преднамеренные несоответствия, запоминающиеся детали и неприкрытая неловкость делают его идеальным выбором для необычного / прогрессивного сайта.
Кроме того, это не требует больших знаний дизайна. Любой может увидеть, что буква «е» странным образом смещена, или верхний концевой элемент «f» причудливо отрезан. Что касается буквы «W», обратите внимание – это довольно распространенная деталь, которую нужно включать (обычно в шрифты с засечками), она, безусловно, немного выделяется, если смотреть на нее в основном тексте.
Несмотря на то, что типографика приобрела репутацию чего-то очень субъективного и художественного, выбор правильных шрифтов сводится к анализу форм заглавных букв. В конечном счете, ваша цель на этом этапе – связать (а) детали форм букв в выбранном вами шрифте с (б) прилагательными вашего бренда и (в) просто генерировать множество возможных идей.
Отлично. Давайте двигаться дальше.
3. Выберите шрифт для основного текста исходя из его удобочитаемости
Если в вашем списке избранного несколько шрифтов, обычно сначала вам нужно выбрать шрифт для основного текста. Зачем? Потому что у него более жесткие ограничения – он должен быть разборчивым при меньшем размере и приятным для глаз, если вы долго его читаете.
Для начинающих дизайнеров самый простой способ проверить подходит ли шрифт для основного текста – прочитать его описание! Например, в описании Scala Sans на сайте MyFonts.com сказано, что он подходит для «книжного текста» и «мелкого текста», а это является синонимами хорошего шрифта для основного текста 😎
Но всегда приятно иметь возможность самостоятельно выбирать хорошие шрифты для основного текста. Главный показатель, по крайней мере, с точки зрения непрофессионала или начинающего дизайнера, это… его скучность! (Возможно, я единственный дизайнер, который это признает).
А если серьезно, хороший шрифт для основного текста никогда не будет привлекать к себе внимания – он позволяет содержанию, словам, занимать центральное место. Цель хорошего основного шрифта – разборчивость (удобочитаемость), поэтому, если вы видите шрифт, который пытается достичь чего-то еще – это, вероятно, не лучший выбор для основного текста.
Это 3 отличных шрифта … которые не подходят для основного текста!Вместо этого вам нужен простой шрифт с засечками или без засечек с большой высотой x и открытыми внутри буквенными просветами (counters).
X-height (высота x) – это высота строчной буквы «x». Но она измеряется не столько в абсолютном выражении, сколько относительно прописных букв (или высоких строчных букв, таких как «h»). Почему это важно? Потому что большая высота x означает, что строчные буквы по сравнению с другими шрифтами того же размера больше и, следовательно, их легче читать.
«Открытые внутри буквенные просветы» (или «большая апертура») означают, что промежутки в буквах типа «а», «с» и «е» относительно широкие. Буква «c» в шрифте Helvetica не так уж отличается от «o» – в то время, как буквы «c» и «o» в шрифте Proxima Nova различить гораздо легче.
Это может показаться не особо важным делом (и вы увидите множество исключений!), но представьте, что вам нужно было что-то прочитать очень быстро, или на телефоне, находящемуся дальше, чем вам хотелось бы, или, когда на улице действительно солнечно. Все это обычно подталкивает вас к выбору шрифтов с большой высотой X и большой апертурой.
В примере с Древним Египтом я отобрал несколько шрифтов с засечками и быстро выбрал очень разборчивый шрифт без засечек, который мне нравится (Scala Sans). Поскольку эти шрифты с засечками в значительной степени также будут отличными шрифтами для основного текста, мне надо принять решение – какой шрифт использовать в качестве основного шрифта: (а) Scala Sans или (б) один из шрифтов с засечками.
Взглянув на шрифты с засечками, я заметил, что некоторые не подходят для основного текста из-за наличия очень тонких горизонтальных штрихов – что может затруднить их чтение при меньшем размере и, возможно, стать причиной, по которой буквы будут казаться «тонкими».
Но пара из них отлично подойдет. На данный момент у меня нет твердого мнения, что мне следует использовать. Но по мере прохождения процесса сочетания шрифтов один из них выйдет победителем.
4. Добавьте дополнительный шрифт, чтобы выделить еще один аспект бренда
Довольно распространенная ошибка, которую я наблюдаю у студентов, изучающих мой курс «Learn UI Design», заключается в том, что они используют очень похожие шрифты.
Вместо этого добавляйте другие шрифты, чтобы выделить ваш бренд так, как не сможет один шрифт.
(Между прочим, в 95% случаев это означает, что вы будете сочетать шрифт с засечками и шрифт без засечек)
На веб-сайте института Санте-Фе шрифт для заголовка Chap довольно своеобразный и необычный. Но это технический институт – в идеале какая-то часть их бренда тоже должна быть технической.
В формате «диаграммы брендов», которую я показываю на уроке «Brand & Goals» курса «Learn UI Design», веб-сайт Института Санта-Фе будет находиться здесь:
Их шрифт для заголовка, Chap, причудливый, но не технологический. Так что следующий шрифт, который они используют, должен немного больше отражать техническую направленность сайта.
Совет ☝️: большинство шрифтов, которые кажутся техническими / научными / футуристическими, имеют квадратную форму. Но шрифт основного текста должен быть простым и разборчивым, что, как мы видели на примере Chakra Petch, иногда противоречит угловатости и геометрическим формам.
Если бы вы спросили меня, какой шрифт имеет идеальный баланс между (а) техническим / геометрическим и (б) очень разборчивым, я бы предложил прекрасный DIN.
И знаете, что? Институт Санта-Фе подумал о том же! (И многие другие дизайнеры тоже – спросите их. Уверяю вас, эта типографика не такая уж дикая и субъективная, как кажется 🙂)
Определенно причудливый и креативный, но угловатый DIN, подкрепленный фотографиями сложных систем (например, туманностей и транспортных потоков), добавляет технической атмосферы.
В нашем примере с Древним Египтом я ищу что-то, что кажется немного более старым и загадочным (но помните: лишь немного) по сравнению со Scala Sans. Это обязательно будет шрифт с засечками.
Я сузил свой выбор до Skolar и еще одного шрифта с засечками под названием Minion.
Как я выбрал Minion? 🤔 Что ж, я заметил, что Crimson Text – так называемый шрифт с засечками «старого стиля» – один из первых стилей дизайна, основанный на каллиграфических формах и довольно разборчивый (не говоря уже о том, что идеально подходит для исторической тематики). Я решил просмотреть несколько других шрифтов с засечками в старом стиле, которые мне запомнились, но, если вы не знаете такие шрифты, то всегда можете загуглить: «old style serif site:typewolf.com», и всего через два клика узнаете о шрифте Minion.
Теперь осталось только выяснить, какой шрифт следует выбрать для основного текста, а какой для заголовков. Давай просто возьмем пару шрифтов и попробуем.
Могло быть хуже, но могло быть и немного лучше. Давайте поменяем гарнитуры и посмотрим, что получится.
Потрясающие! Но поскольку у нас есть два шрифта с засечками, мы должны попробовать Skolar, в качестве основного шрифта.
Честно говоря, засечки в Skolar кажутся слишком большими и толстыми. Мне нравится, что в Minion они более тонкие и изящные.
(Это вполне разумно. Skolar – это современный шрифт с засечками, а многие современные шрифты с засечками имеют более крупные засечки, которые обеспечивают лучшую читабельность при очень маленьком размере!)
Итак, теперь у нас есть пара шрифтов – Scala Sans и Minion. Что нам с этим делать?
5. Определите правила использования
По мере того, как мы добавляем больше шрифтов, становится все важнее четко понимать, какие и когда использовать.
Можно подумать, что, когда у вас всего два шрифта это довольно просто, не так ли?
- Заголовки: Scala Sans
- Текст: Minion
Не так быстро! Даже на довольно простом текстовом сайте есть много других мест, где нужно выбрать шрифт:
- Указание авторства в подзаголовке
- Подзаголовки
- Меню навигации
- Контактные формы (метки, поля ввода текста, кнопки)
- Футеры
Наивное решение – просто (а) использовать шрифты заголовков для всех заголовков и подзаголовков и (б) использовать шрифт для основного текста – для всего остального. Угадайте, какая это прекрасная идея…
Но на самом деле выбор шрифтов – это лишь малая часть проблемы. Подавляющее большинство типографики в повседневном UI дизайне – это стилизация уже выбранных вами шрифтов.
И даже на этапе сочетания шрифтов мы хотим начать стилизацию шрифтов, чтобы увидеть, как они могут работать.
Мы начали определять еще несколько правил использования наших шрифтов:
- Меню: Minion
- Указание авторства: светло-серый Minion курсивом
- Метки: светло-серый Minion курсивом
- Категории и теги: smaller uppercase Scala Sans полужирным
Но даже они могут быть изменены. Например, светло-серая метка, выделенная курсивом, будет выглядеть странно рядом с вводимым текстом. Поэтому следует ли использовать разные стили для обеих меток, или есть веское основание для двух стилей меток (один для категорий и один для элементов управления формой)?
По мере того, как вы добавляете больше шрифтов в свой дизайн, становится все важнее четко понимать, когда и как вы их используете.
Например, на сайте Learn UI Design я регулярно использую 3 разных шрифта – Avenir Next, Rajdhani и Freight Text. Но в некотором смысле я определил «правила» для каждого из них:
- Avenir Next: используется как основной текст. При необходимости можно выделить курсивом или полужирным шрифтом.
- Rajdhani: используется для подзаголовка и как акцентный шрифт. Используются только прописные буквы и полужирный шрифт.
- Freight Text: используется для частей страницы, которые представляют говорящего, например, вопросы в FAQ, отзывы учеников и раздел «Обо мне». Используется только в тяжелых весах.
Таким образом, несмотря на то, что технически имеется 2 шрифта без засечек, каждый шрифт используется по-разному, чтобы дизайн никогда не казался непоследовательным, беспорядочным или перегруженным – или нет? 😉 Вам решать!
В любом случае выберите дополнительный шрифт и определите правила его использования. Это так просто.
6. При необходимости повторите шаги 4 и 5
Приступая к определению различных стилей для своих шрифтов, вы можете заметить, что (а) вы все еще не затрагиваете какую-то важную часть своего бренда или (б) при экспериментальном использовании выбранных шрифтов ни один из них не может решить имеющуюся у вас типографическую проблему.
В этом случае ответ прост: повторите шаги 4 (выберите акцентный шрифт) и 5 (определите правила использования) столько раз, сколько необходимо.
Вот и все… вроде как.
Честно говоря, это только начало. Даже в ограниченной теме сочетания шрифтов мы все равно могли бы поговорить подробнее о том…
- Какие типы шрифтов создают различную атмосферу бренда.
- Стратегии сочетания понятных / простых / современных шрифтов, не имеющих сильного бренда.
- Как жесткие правила бренда влияют на то, какие шрифты вы сочетаете.
И все это рассматривается в моем видеокурсе «Learn UI Design», который включает более 24 часов материалов по созданию красивых, профессиональных интерфейсов.
Это платный курс, но, если вы ищете дополнительные бесплатные материалы, я предлагаю прочитать о 6 способах обоснования выбора шрифтов в ваших дизайнах, о том, как стилизовать текст на адаптивных веб-сайтах, а также мои основные рекомендации по шрифтам для начинающих дизайнеров.
Есть вопросы или комментарии по поводу сочетания шрифтов? Пишите автору 😎
Какой шрифт мне использовать? 5 принципов выбора и использования шрифтов — Smashing Magazine
Об авторе
Интерес Дэна Майера к графическому дизайну начался, когда ему было пять лет, когда он посетил печатный станок в эпизоде «Улицы Сезам» 1979 года. Родом из США,… Больше о Дэн ↬
В статье будут рассмотрены 5 основных принципов, которые предоставят вам практическое руководство по выбору, применению и смешиванию различных шрифтов. В конце концов, вы узнаете, как выбрать правильный шрифт и что для этого нужно.
Для многих новичков выбор шрифтов является непонятным процессом. Кажется, существует бесконечный выбор — от обычных шрифтов, выглядящих обычным образом, до новаторских шрифтов в виде леденцов и кроликов — без возможности понимания вариантов, только бесконечные списки категорий и рекомендаций.
Выбор правильного шрифта — это смесь твердых правил и слабой интуиции, и на то, чтобы развить чувство, нужны годы опыта. Вот пять пяти руководств по выбору и использованию шрифтов , которые я разработал в процессе использования и обучения типографике.
1. Одевайтесь по случаю
Многие из моих начинающих студентов выбирают шрифт так, как будто они ищут новую музыку для прослушивания: они оценивают индивидуальность каждого лица и ищут что-то уникальное и неповторимое, что выражает их индивидуальность. эстетический вкус, перспектива и личная история. Такой подход проблематичен, потому что он придает слишком большое значение индивидуальности.
Наиболее подходящая аналогия по типу комплектации. (Фотография предоставлена: Samuuraijohnny.Используется по лицензии Creative Commons.)
Хорошо это или плохо, выбор шрифта больше похож на утреннюю одежду. Как и в случае с одеждой, существует различие между выразительными и стильными шрифтами и шрифтами, которые полезны и подходят для многих ситуаций, и наша задача — попытаться найти правильный баланс для конкретного случая. Хотя уместность не является привлекательной концепцией, это кислотная проверка, которая должна определять наш выбор шрифта.
Мой «любимый» предмет одежды — это, наверное, диковинная пара расклешенных брюк 70-х, которые я купила в комиссионном магазине, но на самом деле они не так часто выпадают из моего туалета за пределами Хэллоуина.У каждого дизайнера есть несколько таких любимых шрифтов — выразительные личные фавориты, которые мы храним и ждем идеального праздничного случая для использования. Чаще всего утром за утром я надеваю одну и ту же старую пару Levis. Дело не в том, что мне нравятся эти больше, чем мои заветные клеш, точно … Я просто, кажется, ношу их большую часть времени.
У каждого дизайнера есть несколько гарнитур, которые похожи на удобные джинсы: они подходят ко всему, они, кажется, адаптируются к своему окружению и становятся более расслабленными или более формальными, если того требует случай, и они, кажется, просто выходят из шкафа день за днем.Обычно это лица, у которых есть несколько начертаний (светлый, обычный, полужирный и т. Д.) И / или обрезки (курсив, сокращенный и т. Д.). Мои особые защитные одеяла: Myriad, Gotham, DIN, Akzidenz Grotesk и Interstate среди sans; Меркьюри, Электра и Перпетуа среди шрифтов с засечками.
Большое семейство шрифтов, такое как Helvetica Neue, можно использовать для выражения различных голосов и эмоций. Универсальные и удобные в работе, эти лица похожи на любимую пару джинсов дизайнеров.
2. Знай свою семью: группирование шрифтов
Аналогия с одеждой дает нам хорошее представление о том, какой шкаф нам нужно собрать. Следующая задача — разработать некую структуру, с помощью которой мы могли бы мысленно классифицировать различные гарнитуры, с которыми мы сталкиваемся.
Гарнитуры можно разделить на десятки категорий (Scotch Modern, кто-нибудь?), Но нам действительно нужно отслеживать только пять групп , чтобы установить рабочее понимание большинства шрифтов, используемых в настоящее время пейзаж.
Следующий список не предназначен для исчерпывающей классификации каждой категории типов (в сети есть множество отличных сайтов, которые уже занимаются этим, например, классификации типов Typedia), а скорее как удобный краткий обзор ключевых групп. . Давайте посмотрим на две основные группы без засечек (засеки — это маленькие ножки на концах букв), две с засечками и одну резко выделяющуюся (с большими квадратными ножками).
1. Geometric Sans
Я на самом деле объединяю здесь три разные группы (геометрические, реалистичные и гротескные), но между этими группами достаточно общего, поэтому мы можем пока рассматривать их как одно целое.Геометрические шрифты без засечек — это те лица, которые основаны на строгих геометрических формах . Отдельные формы букв Geometric Sans часто имеют штрихи одинаковой ширины и часто свидетельствуют о некотором минимализме «меньше значит больше» в их дизайне.
В своих лучших проявлениях Geometric Sans ясный, объективный, современный, универсальный; в худшем случае — холодным, безличным, скучным. Классический Geometric Sans похож на красиво оформленный аэропорт: он впечатляет, современен и полезен, но мы должны дважды подумать, хотим ли мы там жить.
Примеры геометрического / реалистичного / Grotesk Sans: Helvetica, Univers, Futura, Avant Garde, Akzidenz Grotesk, Franklin Gothic, Gotham.
2. Humanist Sans
Это лица Sans, заимствованные из почерка — , какими бы чистыми и современными ни казались некоторые из них, они по-прежнему сохраняют в своей основе что-то неизбежно человеческое. Сравните букву «t» на изображении выше с буквой «t» в «геометрическом» и обратите внимание, насколько больше деталей и характерных черт имеет гуманистическое «t».
В этом суть шрифта Humanist Sans: в то время как геометрический шрифт обычно разрабатывается как можно более простым, буквенные формы шрифта Humanist обычно имеют больше деталей, меньшую согласованность и часто включают более тонкие и толстые штриховые обозначения — в конце концов они происходят от нашего почерка, который является чем-то индивидуализированным. В своих лучших проявлениях Humanist Sans может сочетать оба аспекта: современный, но человечный, ясный, но чуткий. В худшем случае они кажутся бессмысленными и фальшивыми, ручными слугами корпоративной неискренности.
Примеры Humanist Sans: Gill Sans, Frutiger, Myriad, Optima, Verdana.
3. Старый стиль
Также называемые «венецианскими», это наших самых старых шрифтов , результат многовекового постепенного развития наших каллиграфических форм. Лица в старом стиле отличаются небольшим контрастом между толстым и тонким (поскольку технические ограничения того времени не допускали этого), а изогнутые формы букв имеют тенденцию наклоняться влево (так же, как наклоняется каллиграфия).Лица в старом стиле в лучшем случае классические, традиционные, читаемые, а в худшем -… ну, классические и традиционные.
Примеры старого стиля : Дженсон, Бембо, Палатино и — особенно — Гарамонд, который на момент создания считался настолько совершенным, что никто особо не пытался его улучшить в течение полутора веков.
4. Переходные и современные шрифты
Происхождение мышления Просвещения, переходные (середина 18 века) и современные (конец 18 века, не путать с модернизмом середины 20 века) шрифты возникли в результате экспериментов шрифтовых дизайнеров с созданием их буквенные формы более геометрические, острые и виртуозные , чем непритязательные лица периода старого стиля.Переходные лица ознаменовали скромный прогресс в этом направлении — хотя Baskerville, типичный переходный шрифт, казался зрителям настолько острым, что люди считали, что взгляд на него может повредить зрению.
Вырезая модернистские штампы, шрифтовые дизайнеры баловались своего рода виртуозной демонстрацией контрастных толстых и тонких мазков — большая часть развития была вызвана соревнованием между двумя конкурирующими дизайнерами, вырезавшими похожие лица, Бодони и Дидо. В лучшем случае переходные и современные лица кажутся сильными, стильными, динамичными.В худшем случае они кажутся ни здесь, ни там — слишком бросающимися в глаза и барочными, чтобы быть классическими, слишком громоздкими, чтобы быть по-настоящему современными.
- Примеры переходных гарнитур: Times New Roman, Baskerville.
- Примеры современных шрифтов с засечками: Bodoni, Didot.
5. Slab Serifs
Также известный как «египетский» (не спрашивайте), Slab Serif — это дикая карта, которая в последние годы снова вошла в моду. Плоские засечки обычно имеют штрихи, похожие на штрихи без лицевой стороны (то есть простые формы с относительно небольшим контрастом между толстыми и тонкими), но с твердыми прямоугольными башмаками, прикрепленными к концу.Slab Serifs являются исключением в том смысле, что они передают очень специфические — и все же часто довольно противоречивые — ассоциации : иногда мыслитель, иногда крутой парень; иногда хулиган, иногда ботаник; иногда городской утонченный, иногда ковбойский.
Они могут передать чувство авторитета в случае тяжелых версий, таких как Rockwell, но они также могут быть довольно дружелюбными, как в недавнем фаворите Archer. Многие засечки, кажется, выражают городской характер (например, Rockwell, Courier и Lubalin), но при применении в другом контексте (особенно в Clarendon) они сильно напоминают American Frontier и сельские, местные обозначения, которые появляются на фотографиях с этого период.Плоские засечки сложно обобщить как группу, но их отличительные блочные засечки функционируют как пара очков в роговой оправе: они добавляют характерную морщинку чему-либо, но могут легко стать чрезмерно заметными в неправильном окружении.
Примеры плоских засечок: Clarendon, Rockwell, Courier, Lubalin Graph, Archer.
3. Не будьте слабаком: принцип решающего контраста
Итак, теперь, когда мы знаем наши семейства и некоторые классические примеры каждого из них, нам нужно решить, как смешивать и сочетать и — самое главное — смешивать и совпадать вообще.В большинстве случаев подойдет один шрифт, особенно если это одна из наших рабочих лошадок с множеством разных весов, которые работают вместе. Если мы достигли точки, когда мы хотим добавить в микс второе лицо, всегда полезно соблюдать это простое правило: сохраняйте его точно таким же или сильно меняйте — избегайте слабых, постепенных изменений.
Это общий принцип дизайна, и официальное его название — соответствие и контраст . Лучший способ увидеть это правило в действии — взять все случайные монеты, которые вы собрали в своем последнем путешествии по Европе, и выложить их вместе на стол.Если положить две одинаковые монеты рядом друг с другом, они хорошо смотрятся вместе, потому что совпадают ( соответствие ). С другой стороны, если мы положим десять центов рядом с одной из тех больших медных монет, которые мы подобрали где-то в Центральной Европе, это также выглядит интересно из-за различия между ними — они выглядят достаточно по-разному.
Что не так хорошо работает, так это когда мы кладем десять центов рядом с монетой из другой страны, которая почти такого же размера и цвета, но немного отличается.Это создает непростые визуальные отношения, потому что ставит вопрос, даже если мы едва замечаем его на сознательном уровне — наш разум задает вопрос, одинаковы ли эти двое или нет, и этот процесс вопросов и вопросов отвлекает нас от простого просмотр.
Когда мы комбинируем несколько шрифтов в дизайне, мы хотим, чтобы они комфортно сосуществовали — мы не хотим отвлекать зрителя вопросом, это одно и то же или нет? Мы можем начать с избегания двух разных граней в пределах одной из пяти категорий, которые мы перечислили выше вместе — двух геометрических гротеинов, скажем, Франклина и Гельветики.Хотя они и не совсем похожи, эти два также недостаточно различны и поэтому помещают наш макет в это ужасное место ни здесь, ни там.
Если мы собираемся добавить еще один шрифт в корзину вместе с Helvetica, гораздо лучше, если мы воспользуемся чем-то вроде Bembo, классическим шрифтом старого стиля. Разница в возрасте между веками и световыми годами с точки зрения вдохновения, Helvetica и Bembo имеют достаточно контраста, чтобы удобно делить страницу:
К сожалению, это не так просто, как просто выбрать очень, очень разные шрифты — разместить нашу конфету. шрифт рядом, скажем, с Garamond или Caslon не гарантирует нам типографской гармонии.Часто, как в приведенном выше примере Helvetica и Bembo, нет реального объяснения того, почему два лица дополняют друг друга — они просто дополняют друг друга.
Но если мы хотим, чтобы наш выбор руководствовался каким-то принципом, он должен быть таким: часто два шрифта хорошо работают вместе, если у них есть одно общее, но в остальном они сильно различаются. Этот общий общий аспект может быть визуальным (подобная x-высота или масса штриха) или хронологическим. Гарнитуры одного и того же периода с большей вероятностью будут хорошо работать вместе… и тем лучше, если они созданы одним и тем же дизайнером.
4. Немного может пройти долгий путь
«Хватит всех этих обычных шрифтов и правил!» — скажете вы. «Мне нужно кое-что для моего рейв-флаера! И меню моего тайского ресторана! И мои рождественские открытки! »Вы здесь указываете на то, что все лица, которые я обсуждал до сих пор, являются« телесными шрифтами », что означает, что вы могли бы создать целое меню или газету с любым из них; в аналогии с одеждой, представленной в первой части, это наши повседневные Levis. А что насчет наших хеллоуинских вспышек?
Периодически возникает потребность в шрифте, который источает индивидуальность, будь то складская вечеринка, тайский тайский стол или Санта-Клаус.И эта потребность приводит нас в безбрежную пустыню шрифтов Display, которая включает в себя все, от Comic Sans до наших конфетных и кроличьих шрифтов. «Отображение» — это просто еще один способ сказать « не превышайте рекомендованную дозу »: при умеренном применении к заголовкам дисплейный шрифт может добавить столь необходимый оттенок в дизайн, но при использовании он может быстро потерять свою привлекательность. слишком широко.
Время для другой аналогии одежды:
(Фото: Betsssssy. Используется по лицензии Creative Commons.)
Наряд Бетси работает, потому что розовые ремни служат акцентом и компенсируются практичностью синих джинсов. Но если мы увлечемся и полностью окрасим Бетси в розовый цвет, она может выглядеть примерно так:
(Фото: Филипп Леруайер). Используется по лицензии Creative Commons.)
Давайте назовем это принципом розового пояса типа: лица с яркой индивидуальностью лучше всего использовать в малых дозах. Если мы применим наш классный тип отображения к каждому фрагменту текста в нашем дизайне, эстетическая привлекательность шрифта быстро исчезнет и, что еще хуже, наш дизайн станет очень трудночитаемым.Допустим, мы разрабатываем меню для нашего любимого тайского заведения. Наш клиент может захотеть, чтобы мы использовали «типичное» азиатское лицо, например Sho:
. Пока все хорошо. Но посмотрите, что происходит, когда мы применяем наш любимый шрифт ко всему меню:
Уже достаточно. Давайте попробуем заменить часть обычного текста на что-нибудь более нейтральное:
Так лучше. Теперь, когда мы ограничили использование нашего звездного шрифта, мы позволили ему снова засиять.
5. Правило номер пять: «Правил нет»
На самом деле. Присмотритесь внимательно, и вы найдете великолепно выглядящее меню, полностью написанное трудночитаемым шрифтом. Или два разных лица Geometric Sans, счастливо живущих вместе на одной странице (на самом деле, только на этой неделе я попробовал это на проекте и был удивлен, обнаружив, что он попал в точку). Есть только условности, нет жестких правил о том, как пользоваться шрифтом, точно так же, как нет правил о том, как мы должны одеваться по утрам.Стоит попробовать все, чтобы посмотреть, что произойдет, — даже надеть на свидание хеллоуинские клеш.
Заключение
Надеюсь, эти пять принципов дадут вам некоторые рекомендации о том, как выбирать, применять и смешивать типы — и, действительно, смешивать ли их вообще. В конце концов, выбор шрифтов требует сочетания понимания и интуиции и, как и любое умение, требует практики. Имея доступ ко всем разнообразным шрифтам, легко забыть, что нет ничего лучше классического шрифта, который хорошо используется тем, кто знает, как им пользоваться.
Некоторые из лучших советов по шрифтам, которые я когда-либо получал, исходили от моего первого учителя типографии: выберите один шрифт, который вам нравится, и используйте его много месяцев, исключая все остальные. Хотя иногда такое упражнение может показаться ограничивающим, оно также может служить полезным напоминанием о том, что количество доступных вариантов выбора в эпоху Интернета не заменяет качество.
Другие ресурсы
Вам могут быть интересны следующие статьи и связанные ресурсы:
Дополнительная информация о SmashingMag:
(ik, vf, yk)Как выбрать правильный шрифт для вашего дизайна
Выбор «правильного» шрифта для вашего дизайна определяет, насколько хорошо ваш дизайн будет восприниматься.
Название этой статьи должно на самом деле быть «Как выбрать правильный шрифт для вашего дизайна», потому что выбор, который вы делаете, касается гарнитуры, а не шрифта. Но не будем углубляться в детали.
Во-первых, давайте поговорим об обуви и о том, как они связаны с типографикой …
Обувь, которую носит человек, оставляет впечатление.
Мужчина может носить потертые потертые джинсы, старую выцветшую рубашку и иметь растрепанные волосы. Но если его обувь чистая и начищенная, люди это заметят.В этой обуви его воспринимают положительно:
Это туфли Allen Edmonds, они источают стиль. (Фотография предоставлена: Каменные товары)Его негативно воспримут в этой обуви:
Иногда нужно просто сменить обувь. (Фото: Pink Gazelle)Если вы не верите, что обувь имеет такое большое значение, спросите других людей, что они замечают, когда впервые встречаются с кем-то.
Дорогой костюм со старыми грязными туфлями производит плохое первое впечатление.
Как это сводится к разговору о шрифтах и гарнитурах? Ваш шрифт и гарнитуры могут стать обувью вашего дизайна.
Даже если типографика сама по себе составляет лишь 10% вашего общего дизайна, она все равно может иметь большое влияние на то, как дизайн воспринимается в целом.
Давайте углубимся в шрифты и гарнитуры. Помните, что шрифт — это определенный размер и стиль гарнитуры.
В предыдущей статье о типографских терминах мы рассмотрели типографскую терминологию и упомянули, что одним из примеров гарнитуры является Helvetica … Сам шрифт тогда будет курсивным шрифтом Helvetica с 10 пунктами.
Отсюда следует, что первая часть выбора правильного шрифта начинается с выбора правильного шрифта.Мы расскажем, как использовать что-то, что называется Pangram, чтобы помочь вам выбрать правильный шрифт позже в этой статье.
4 способа выбрать правильный шрифт
1. Используйте безопасные гарнитуры
У каждого дизайнера есть удивительно диковинные шрифты, которые они используют для особых случаев. Однако 95% времени вы будете использовать безопасные и чистые шрифты. Эти безопасные шрифты сродни обуви, которую вы носите каждый день.
Лучше, чтобы шрифт был четким и разборчивым, а не настолько нечитаемым, чтобы это отвлекало от общих коммуникационных целей дизайна.Если кому-то нужно потратить лишние 4 секунды, чтобы понять, что написано, он проигнорирует ваш дизайн.
Garish Monde трудно читать. (Фото: Downloadatoz) Правый слайд очень легко читать. (Изображение предоставлено FSCONS)Вот несколько безопасных шрифтов без засечек, с которых вы можете начать: Arial, Impact, Lucida Grande, Tahoma, Verdana и Helvetica.
Вот несколько безопасных шрифтов с засечками для начала: Georgia, Palatino и Times New Roman.
Эти шрифты, вероятно, доступны для вас и будут отображаться в Интернете практически без проблем (это так называемые «веб-шрифты»).
2. Знайте 5 семейств типа
Эти пять классификаций различных шрифтов составляют 20%, которые используются в 80% сегодняшних текстов и контента.
Это не исчерпывающий список всех доступных классификаций шрифтов, но он обязательно поможет вам перейти к выбору правильного шрифта.
Геометрический без засечек
Geometric Sans представляет собой комбинацию трех разных групп (Geometric, Realist и Grotesk), но между ними достаточно общего, чтобы сгруппировать их в одну группу для этого примера.
Это семейство шрифтов без засечек основано на строгих геометрических формах. Буквы часто имеют одинаковую ширину и в их дизайне делается акцент на эстетике «меньше значит больше».
Геометрические шрифты часто делятся на четкие, объективные, современные и универсальные. С другой стороны, их можно назвать холодными, безличными и скучными.
Примеры геометрического / реалистичного / Grotesk Sans: Helvetica, Univers, Futura, Avant Garde, Akzidenz Grotesk, Franklin Gothic, Gotham.
Гуманист без засечек
ГарнитураHumanist Sans более чистая, современная и основана на почерке.
Эти шрифты разработаны так, чтобы быть максимально простыми, с более тонкими и тонкими штрихами, подобными нашему почерку.
Их часто классифицируют как современных, но человечных, ясных, но чутких.
Примеры Humanist Sans: Gill Sans, Frutiger, Myriad, Optima, Verdana.
Старые засечки
Известный как «самый старый шрифт», старый стиль отличается небольшим контрастом между толстым и тонким шрифтом, а изогнутые буквы имеют тенденцию к наклону влево.
Эти гарнитуры часто делятся на классические, традиционные и удобочитаемые.
Образцы старого стиля: Дженсон, Бембо, Палатино и Гарамонд.
Переходные и современные засечки
Созданные в середине 18-го и конце 18-го веков, традиционные и современные шрифты возникли как эксперимент по созданию более геометрических, четких и виртуозных форм букв.
Переходные и современные лица часто называют сильными, стильными и динамичными.Также говорят, что они слишком бросаются в глаза и в стиле барокко, чтобы быть классическими, и слишком громоздкими, чтобы быть по-настоящему современными.
Примеры переходных гарнитур: Times New Roman, Baskerville.
Примеры современных шрифтов с засечками: Bodoni, Didot.
Плита с засечками
Slab Serif стали более популярными в последние годы. Они имеют обводку, похожую на обводку без лица, но с твердыми прямоугольными туфлями на конце. Slab Serifs необычны в мире типографики; дизайнер Дэн Майер говорит: «Slab Serifs являются исключением в том смысле, что они передают очень специфические — и все же часто весьма противоречивые — ассоциации: иногда мыслитель, иногда крутой парень; иногда хулиган, иногда ботаник; иногда городской утонченный, иногда ковбойский.”
Slab Serif можно назвать городским или сельским, обычно выделяющимся в неправильном окружении, но подходящим точно в нужных местах.
Примеры плоских засечок: Clarendon, Rockwell, Courier, Lubalin Graph, Archer.
3. При выборе двух шрифтов используйте решающий контраст
В большинстве случаев один шрифт — это все, что вам нужно для использования в своих проектах. Однако бывают случаи, когда вам нужно использовать несколько шрифтов, чтобы выделить части вашего дизайна.
Если вы решили использовать несколько гарнитур, убедитесь, что они имеют большие контрастные различия.
Мы не говорим, что какие-то два шрифта могут хорошо работать вместе, но есть некоторые, которые прекрасно работают вместе.
Здесь действует хорошее практическое правило, которое вы можете использовать в своих проектах. Если у этих двух гарнитур есть что-то общее, но в остальном они сильно различаются, это помогает определить, могут ли они выглядеть элегантно в сочетании друг с другом:
- Если двое имеют одинаковую высоту по оси x или ходовой вес
- Если двое из одного периода времени
- Если они созданы одним и тем же дизайнером
Ознакомьтесь с методами типографики здесь и Type Genius, чтобы глубже изучить комбинирование шрифтов.
4. Экономно используйте «дикие» гарнитуры
Давайте вернемся к аналогии с тем, как ваша обувь и одежда хорошо сочетаются друг с другом. Если у нас есть дикий пояс — тот, который имеет немало индивидуальности — он делает больше для наряда, чем носить весь наряд ярко-розового цвета.
Давайте погрузимся еще глубже — удивительная пряжка на ремне хорошо одетого костюма может создать легкий контраст.
Если костюм слишком дикий, это может создать поляризующее негативное впечатление:
То же самое можно сказать и о шрифтах, как в тайском меню:
Весь дикий шрифт. Дикий шрифт смешан с нейтральным шрифтом.Немного дикого шрифта в заголовке и заголовках нижнего меню идеально сочетается с более чистым, более нейтральным, читаемым шрифтом в основном тексте.
5. Бонусное правило выбора шрифтов: «Нет правил»
Эти четыре принципа помогут вам выбрать правильный шрифт.
По мере того, как вы приобретете навыки выбора шрифтов, вы, , разработаете свои собственные правила выбора шрифта .Не существует «неправильных» или «правильных ответов», как многие хотели бы, чтобы вы думали.
Вам решать, как вы хотите, чтобы зрители смотрели на ваши проекты.
Таким образом типографика незримо улучшает ваш дизайн — выбор, который вы делаете, может уменьшить трение и даже принести удовольствие вашим дизайнам.
7 вещей, которые следует помнить при выборе шрифтов для вашего дизайна | Ник Бабич
Типографика играет решающую роль в успехе нового дизайна.
Оптимизация типографики — это улучшение читабельности, доступности, удобства использования (!) И общего графического баланса.(Оливер Райхенштейн)
Вот почему выбор подходящего шрифта для использования текста является важным шагом в каждом дизайн-проекте. В зависимости от проекта поиск подходящего шрифта может занять от нескольких минут до нескольких дней.
Вот семь ключевых факторов, которые следует учитывать при поиске подходящего шрифта:
1. Брендинг
Выбранный шрифт должен отражать характер и дух вашего бренда. Постарайтесь, чтобы стиль шрифта соответствовал характеру вашего бренда.
2.РазборчивостьОчевидно, что лучше, чтобы шрифт был четким и разборчивым, чем нечитаемым. Если людям нужно потратить дополнительное время, чтобы понять, что написано, они проигнорируют ваш дизайн.
Избегайте использования причудливых шрифтов или текста в верхнем регистре в больших объемах текста, поскольку это создает нагрузку на глаза читателя. Декоративные гарнитуры лучше использовать только для заголовков и заголовков.
Кроме того, жизненно важно выбрать шрифт, который хорошо работает в разных размерах и весах, чтобы поддерживать читаемость любого размера (убедитесь, что выбранный вами шрифт читается на небольших экранах!)
Шрифт Roboto от GoogleСтарайтесь избегать шрифтов, которые используют курсивный шрифт, такой как Вивальди (в примере ниже) — хотя они красивы, их трудно читать.Шрифт
Vivaldi будет трудно читать на маленьком экране3.
Serif vs SansОбычно одно из первых решений, которое нужно сделать при выборе шрифта для текста — serif или sans ?
Serif (слева) vs. Sans (справа)Хотя решение может быть основано на нескольких ключевых моментах, одним из наиболее важных моментов является длина вашей копии. Как правило, шрифты с засечками легче читать для длинных копий, чем без шрифтов. Шрифты с засечками помогают глазам перемещаться по линии, особенно если линии длинные.
Но также важно учитывать вашу целевую аудиторию. Sans предпочтительнее для маленьких детей или для тех, кто только учится читать. Sans также подходит для читателей с определенными нарушениями зрения.
Кроме того, можно с уверенностью использовать «безопасные веб-шрифты» — шрифты, которые по умолчанию поддерживаются всеми основными веб-браузерами. Вот несколько безопасных шрифтов без засечек, с которых вы могли бы начать:
И вот несколько безопасных шрифтов с засечками:
- Georgia
- Lucida
- Times New Roman
4.Семейство шрифтов
Некоторые шрифты являются членами «суперсемейства» — они имеют набор различных стилей и толщины, что дает дизайнерам больше свободы для творчества. Например, суперсемейство Helvetica Neue включает в себя следующие подшрифты:
Семейство шрифтов Helvetica NeueПри выборе шрифта для своих проектов вам необходимо знать, насколько большим должно быть семейство шрифтов, чтобы соответствовать типографским требованиям вашего проекта. Для многих проектов достаточно двух значений веса, выделенных курсивом, в то время как другим могут потребоваться дополнительные версии для создания хорошей визуальной иерархии.
Окончательный выбор шрифта — Design Cuts
20 популярных семейств шрифтов, которые окажут огромное влияние на ваши дизайнерские проекты
Как дизайнеры, мы не хотим, чтобы наши шрифты терялись на заднем плане, мы хотим, чтобы они выделялись, привлекали внимание зрителя и улучшали качество нашей дизайнерской работы! Вот почему сегодня мы рады представить вам 20 самых продаваемых семейств шрифтов, которые оказывают огромное влияние. Эти шрифты мирового класса идеально подходят для всего, от крупномасштабных проектов по брендингу до повседневной дизайнерской работы.
Вот почему вам понравится этот выбор:
- Каждый шрифт в этом наборе является отличным знаком.
В этой коллекции представлены некоторые из самых популярных шрифтов в мире прямо сейчас. Мы сотрудничаем с такими знаменитыми шрифтовыми компаниями, как Latinotype, Laura Worthington, Fenotype и Black Foundry, чтобы представить вам их самые лучшие выпуски. Не соглашайтесь на обычные шрифты, когда вы можете получить готовый к использованию набор профессиональных шрифтов, которые подойдут вам для любого проекта.Получить все эти шрифты мирового класса со скидкой 99% от обычной цены — это неслыханно!
- Эта коллекция принесет вам максимальное качество и разнообразие ваших проектов.
Эти семейства шрифтов включают в себя широкий спектр начертаний, стилей и языковую поддержку. Как и следовало ожидать от лучших в мире литейных заводов, каждая буква имеет безупречную точность. Разнообразие этой коллекции гарантирует, что вы всегда будете знать, нужен ли вам надежный дисплейный шрифт, чистый шрифт без засечек, богато украшенный шрифт, причудливые рисованные шрифты или жирный шрифт.
- Используйте свои новые шрифты с уверенностью в рамках нашей расширенной лицензии.
Это означает, что вы даже можете использовать свои шрифты в коммерческой работе, доступной для продажи! Ознакомьтесь с полной информацией о лицензии здесь.
Взгляните на невероятные шрифты из этой коллекции:
Латинотип
Сборка
Разработано Даниэлем Эрнандесом, Альфонсо Гарсиа, Бруно Хара Аумада и Лучано Вергара. Спасибо Педро Гонсалесу за его вклад на начальном этапе процесса проектирования.
Assemblage — это шрифт, вдохновленный римскими квадратными заглавными буквами. Он доступен в 6 различных начертаниях и варьируется от тонкого до черного. Фон шрифта делает его хорошо подходящим для брендинга, короткого текста, заголовков и сложных композиций благодаря его курсивной версии.
В отличие от некоторых консервативных шрифтов, Assemblage включает курсивную версию с видом, основанным на шрифтах Elzeverian и Dutch Barroque, что придает шрифту дополнительную элегантность, что приводит к очень приятному дизайну.Семейство было специально создано для этикетирования винных бутылок и общей упаковки.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: африкаанс, албанский, эльзасский, арагонский, арапахо, арумынский, аррернте, астурийский, аймара, баскский, бислама, боснийский, бретонский, каталонский, кебуанский, чаморро, шайенн, чичева (ньянджа), цимбрийский, кимбрийский, хорватский Чешский, датский, голландский, английский, эстонский, фарерский, фиджийский, финский, французский, французский креольский (Сент-Люсия) фризский, фриульский, галисийский, генуэзский, немецкий, гильбертский (Кирибати), гренландский, гаитянский креольский, гавайский, хилигайнонский, хмонг, Хопи, венгерский, ибанаг, илоко (илокано), индонезийский, интерглосса (глоса), интерлингва, ирландский (гэльский), исландский, истро-румынский, итальянский, йеррианский, кашубский, курдский (курманджи), ладинский, латышский, литовский, ложбан, Ломбардский, нижнесаксонский, люксембургский, малагасийский, мальтийский, мэнский, маори, меглено-румынский, могавк, науатль, норфолк / питкэрн, северный сото (педи), норвежский, окситанский, оромо, пангасинанский, папьяменто, пьемонтский, польский, португальский, потаватоми Романс, румынский, ретороманский (румынский), ротокас, саамский (инари), саамский (Луле), самоанский, сардинский (сарду), шотландский (гэльский), сейшельский креольский (шесельва), шона, сицилийско-словацкий, словенский (словенский), сомалийский, южный ндебеле, южный сото (сесото), испанский, суахили, свати / свази, Шведский, тагальский (филиппинский / пилипинский), таитянский, таусуг, тетум (тетун), ток писин, тонган (факта-тонга), тсвана, турецкий, туркменский, туркменский (латинизированный), тувалуский, уйгурский (латинизированный), вепсский, волапюк, Вотский (латинизированный), валлонский, варлпири, валлийский, коса, япезский, зулусский
Этот шрифт включает веб-версии
Габриэль трафарет
Gabriela Stencil — это классическое семейство шрифтов с уникальным характером, разработанное Антонио Мехиа Лечуга в сотрудничестве с Latinotype Team.Этот шрифт, хорошо подходящий для заголовков, имеет особенности, которые подчеркивают его современную и элегантную индивидуальность, вдохновленную стилем гарнитур Didone XIX века.
Высота x — размер 50% от высоты крышки — и короткие верхние и нижние части делают Gabriela Stencil легко читаемым шрифтом и идеально подходят для заголовков, короткого текста, брендинга и издательских проектов. Семейство представлено в 6 стилях, от тонкого до черного, плюс соответствующий курсив и содержит набор из 433 символов, поддерживающий 206 различных языков.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: африкаанс, албанский, эльзасский, арагонский, арапахо, арумынский, аррернте, астурийский, аймара, баскский, бислама, боснийский, бретонский, каталонский, кебуанский, чаморро, шайенн, чичева (ньянджа), кимбрийский, кимбрийский, хорватский Чешский, датский, голландский, английский, эстонский, фарерский, фиджийский, финский, французский, французский креольский (Сент-Люсия) фризский, фриульский, галисийский, генуэзский, немецкий, гильбертский (Кирибати), гренландский, гаитянский креольский, гавайский, хилигайнонский, хмонг, Хопи, венгерский, ибанаг, илоко (илокано), индонезийский, интерглосса (глос), интерлингва, ирландский (гэльский), исландский, истро-румынский, итальянский, йеррианский, кашубский, курдский (курманджи), ладинский, латышский, литовский, ложбан, Ломбардский, нижнесаксонский, люксембургский, малагасийский, мальтийский, мэнский, маори, меглено-румынский, могавк, науатль, норфолк / питкэрн, северный сото (педи), норвежский, окситанский, оромо, пангасинанский, папьяменто, пьемонтский, польский, португальский, потаватльский -Романтический, румынский, ретороманский (румынский), ротокас, саамский (инари), сэм i (луле), самоанский, сардинский (сарду), шотландский (гэльский), сейшельский креольский (Seselwa), шона, сицилийско-словацкий, словенский (словенский), сомалийский, южный ндебеле, южный сото (сесото), испанский, суахили, свази / свази , Шведский, тагальский (филиппинский / пилипинский), таитянский, таусуг, тетум (тетун), ток писин, тонганский (фака-тонга), тсвана, турецкий, туркменский, туркменский (латинизированный), тувалуанский, уйгурский (латинизированный), вепсский, волапюк , Водский (латинизированный), валлонский, варлпирский, валлийский, коса, япезский, зулусский
Этот шрифт включает веб-версии
Базовый узкий без ограничений
Basic Sans Narrow — это более узкая версия Basic Sans.Это семейство гротескных функций с функциональным, нейтральным и кажущимся чистым стилем, которое выглядит, чтобы сохранить нейтральный (или базовый) вид на бумаге, но включает в себя множество деталей, которые придают ему уникальную индивидуальность.
Basic Sans Narrow — это шрифт без засечек, хорошо подходящий для издательских проектов, текста среднего размера, брендинга, плакатов, заголовков и многого другого!
Это семейство шрифтов имеет 7 уровней плотности, от тонкого до черного, плюс соответствующий курсив, и имеет набор из 416 символов, поддерживающих 206 различных языков.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: африкаанс, албанский, эльзасский, арагонский, арапахо, арумынский, аррернте, астурийский, аймара, баскский, белорусский (ласинка), бислама, боснийский, бретонский, каталонский, кебуано, чаморро, шайенн, чичева (ньянджа) , Корсиканский, хорватский, чешский, датский, голландский, английский, эстонский, фарерский, фиджийский, финский, французский, французский креольский (Сент-Люсия) фризский, фриульский, галисийский, генуэзский, немецкий, гильбертский (Кирибати), гренландский, гаитянский креольский, гавайский , Хилигайнон, хмонг, хопи, венгерский, ибанаг, илоко (илокано), индонезийский, интерглосса (глоса), интерлингва, ирландский (гэльский), исландский, истро-румынский, итальянский, йеррианский, кашубский, курдский (курманджи), ладинский, латышский , Литовский, ложбан, ломбардский, нижнесаксонский, люксембургский, малагасийский, малайский (латинизированный), мальтийский, мэнский, маори, меглено-румынский, могавк, науатль, норфолк / питкэрнский диалект, северный сото (педи), норвежский, окситанский, оромо, пангасинанский , Папьяменто, пьемонтский, польский, португальский, потаватоми, кечуа, ретороманский, римский ианский, ретороманский (румынский), ротокасский, саамский (инари), саамский (луле), самоанский, сардинский (сарду), шотландский (гэльский), сейшельский креольский (Seselwa), шона, сицилийский, словацкий, словенский (словенский), сомалийский, Южный ндебеле, Южный Сото (Сесото), Испанский, Суахили, Свати / Свази, Шведский, Тагальский (Филиппинский / Пилипинский), Таитянский, Таусуг, Тетум (Тетун), Ток Писин, Тонга (Фака-Тонга), Цвана, Туркменский, Туркменский (Latinized), Tuvaluan, Uyghur (Latinized), Veps, Volapük, Votic (Latinized), Walloon, Warlpiri, Welsh, Xhosa, Yapese, Zulu
Этот шрифт включает веб-версии
Исидора
Разработанный Энрике Эрнандесом V, Isidora — это современный геометрический шрифт, основанный на классических гарнитурах начала 20 века, но с современным и функциональным оттенком.Несмотря на сильную и рациональную структуру, шрифт также выглядит дружелюбно и выразительно за счет закругленных концов. Кроме того, диагональные прорези выводов придают ему более мягкий и округлый вид.
Isidora состоит из двух 7-весовых подсемейств: одного (более классического) обычного и одного альтернативного (более современного и демонстрационного). Оба подсемейства имеют курсивный шрифт, всего 28 шрифтов.
Isidora — идеальный шрифт для заголовков, логотипов, брендинга, упаковки, публикации и использования в Интернете.Семейство содержит набор из 438 символов, поддерживающих 207 различных языков, а также включает альтернативный набор символов, который обеспечивает большую гибкость при составлении текста.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: африкаанс, албанский, эльзасский, арагонский, арапахо, арумынский, аррернте, астурийский, аймара, баскский, бислама, боснийский, бретонский, каталонский, кебуанский, чаморро, шайенн, чичева (ньянджа), кимбрийский, кимбрийский, хорватский Чешский, датский, голландский, английский, эстонский, фарерский, фиджийский, финский, французский, французский креольский (Сент-Люсия) фризский, фриульский, галисийский, генуэзский, немецкий, гильбертский (Кирибати), гренландский, гаитянский креольский, гавайский, хилигайнонский, хмонг, Хопи, венгерский, ибанаг, илоко (илокано), индонезийский, интерглосса (глос), интерлингва, ирландский (гэльский), исландский, истро-румынский, итальянский, йеррианский, кашубский, курдский (курманджи), ладинский, латышский, литовский, ложбан, Ломбардский, нижнесаксонский, люксембургский, малагасийский, мальтийский, мэнский, маори, меглено-румынский, могавк, науатль, норфолк / питкэрн, северный сото (педи), норвежский, окситанский, оромо, пангасинанский, папьяменто, пьемонтский, польский, португальский, потаватльский -Романтический, румынский, ретороманский (румынский), ротокас, саамский (инари), сэм i (луле), самоанский, сардинский (сарду), шотландский (гэльский), сейшельский креольский (Seselwa), шона, сицилийско-словацкий, словенский (словенский), сомалийский, южный ндебеле, южный сото (сесото), испанский, суахили, свази / свази , Шведский, тагальский (филиппинский / пилипинский), таитянский, таусуг, тетум (тетун), ток писин, тонганский (фака-тонга), тсвана, турецкий, туркменский, туркменский (латинизированный), тувалуанский, уйгурский (латинизированный), вепсский, волапюк , Водский (латинизированный), валлонский, варлпирский, валлийский, коса, япезский, зулусский
Этот шрифт включает веб-версии
Лаура Уортингтон
Спуманте
Тонкий, полусвязанный шрифт с гибкими прямыми изгибами, Spumante передает легкую игристость своего одноименного вина.Сглаженные буквы, написанные кистью, мягко отражаются вдоль базовой линии, а буквы слегка различаются по наклону — характеристики, которые в совокупности создают очень человечное и уютное настроение.
Это невероятно привлекательное лицо превращается из сдержанной женственности в шикарный коктейль всего за несколько кликов. Украсьте его более чем 200 росчерками, альтернативами и орнаментами или используйте альтернативные названия (в меню OpenType) для минималистичного, несвязанного вида. Spumante идеально подходит для упаковки пищевых продуктов и меню, косметических этикеток, обложек книг, поздравительных открыток и приглашений.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: африкаанс, баскский, бретонский, каталонский, датский, голландский, английский, финский, французский, гэльский (ирландский, шотландский), немецкий, исландский, индонезийский, ирландский, итальянский, норвежский, польский, португальский, саамский (южный) , Испанский, суахили, шведский
Этот шрифт включает веб-версии
Алана
Связанное начертание, сияющее непринужденной элегантностью.Созданные на основе личного почерка (а не эффектной каллиграфии), привлекательные формы букв Аланы убедительно работают в таких настройках, как написание писем и детали меню, даже при небольших размерах.
Установленный в соответствии с размерами дисплея, штрихи Аланы открывают грубые края, напоминающие чернила на текстурированной бумаге. Используйте более 300 альтернативных вариантов, в том числе заглавные буквы с наклонной полосой и орнаментированные формы, чтобы украсить Алану заголовками, заголовками, упаковкой и словесными знаками. Включает 62 подходящих орнамента: ботанические флероны, птицы и милые маленькие жуки.
Шрифты Laura Worthington были специально закодированы так, что почти любой может получить доступ ко всем росчеркам, альтернативам и орнаментам без необходимости в профессиональном программном обеспечении для дизайна.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: африкаанс, баскский, бретонский, каталонский, датский, голландский, английский, финский, французский, гэльский (ирландский, шотландский), немецкий, исландский, индонезийский, ирландский, итальянский, норвежский, польский, португальский, саамский (южный) , Испанский, суахили, шведский
Этот шрифт включает веб-версии
Eds Market
Это все равно что нанять собственного профессионального художника по вывескам с солидным репертуаром стилей.Каждая из них уникальна, но явно написана одной рукой — в данном случае рукой Лоры Уортингтон, держащей заостренную кисть. На компьютере не было создано ни одного варианта; каждый вес и версия были индивидуально написаны вручную.
Ed’s Market позволяет вам вызвать теплую, манящую атмосферу классических продуктовых плакатов 20-го века и надписей на открытках прямо из вашего текстового меню. Но интеллектуальное программирование гарантирует, что цифровое совершенство не превосходит человеческое очарование: на каждом дисплее есть три варианта каждой буквы, чтобы обеспечить естественный вид, нарисованный вручную, при повторении символов.
Ed’s Market включает в себя основной сценарий, жирный шрифт и вертикальный шрифт, каждый из которых содержит более 100 альтернативных символов и форм перекоса. На дисплеях представлены стандартные варианты со смешанным регистром и варианты с полным уклоном, узкие, узкие наклонные, обычные наклонные, полужирные, полужирные наклонные и широкие.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: африкаанс, баскский, бретонский, каталонский, датский, голландский, английский, финский, французский, гэльский (ирландский, шотландский), немецкий, исландский, индонезийский, ирландский, итальянский, норвежский, польский, португальский, саамский (южный) , Испанский, суахили, шведский
Этот шрифт включает веб-версии
Родовой
Желая разработать свой собственный шрифт без засечек для своего веб-сайта, чтобы дополнить остальную часть своей библиотеки шрифтов, Лаура Уортингтон разработала Congenial как сдержанное, очень разборчивое дополнение к ее более декоративным дисплеям.Конечно, Лаура всегда близка к своим каллиграфическим корням, поэтому Congenial сохранил некоторые нарисованные от руки элементы, особенно заметные в более тяжелых весах этой щедрой 11-гранной семьи: например, выпуклый диагональный штрих заглавной буквы X и расклешенный терминалы K, L, Q и Z. При меньшем весе штрихи становятся почти монолинейными, но гуманистическая тенденция все еще очевидна — посмотрите изящные, явно негеометрические кривые k, e и g.
Как и полагается своему названию, Congenial — дружелюбное и гостеприимное лицо с большой высотой x и очень дифференцированными персонажами.На самом деле, если присмотреться, вы нигде не увидите резкой модернистской грани. Как идеальный хозяин, Конгениал мало обращает на себя внимания, но при этом все устроила так, чтобы было комфортно, так что вы можете сосредоточиться на том, чтобы сообщить все, что хотите.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: африкаанс, баскский, бретонский, каталонский, датский, голландский, английский, финский, французский, гэльский (ирландский, шотландский), немецкий, исландский, индонезийский, ирландский, итальянский, норвежский, польский, португальский, саамский (южный) , Испанский, суахили, шведский
Этот шрифт включает веб-версии
Гавань Тип
Мальва Базовая
Malva был разработан, чтобы выступать в качестве элемента брендинга, обеспечивая чистый внешний вид визуальной идентичности и публикаций.Это привносит дружелюбие в общение без ущерба для профессионального внешнего вида, к которому стремится каждый бренд.
Разборчивость была одной из главных задач при разработке Мальвы. Мы уделили особое внимание различению естественно неоднозначных символов I, i, l и 1. Кроме того, тщательно продуманные формы букв делают Malva очень разборчивым шрифтом. Более легкие и жирные шрифты отлично смотрятся на больших размерах, таких как плакаты, объявления и заголовки. С другой стороны, вся семья очень хорошо работает в Интернете и на мобильных устройствах.
Семейство состоит из 8 шрифтов: Light, Regular, Bold и Black с соответствующим курсивом. Каждый шрифт содержит 424 символа, поддерживающих 219 языков.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: абенаки, афан оромо, афар, африкаанс, албанский, эльзасский, амис, анута, арагонский, аранский, арумынский, аррернте, арванитский (латиница), астурийский, атаял, аймара, азербайджанский, башкирский (латинский), баскский, Белорусский (латиница), бемба, бикол, бислама, боснийский, бретонский, креольский язык Кабо-Верде, каталонский, кебуанский, чаморро, чавакано, чичева, чикасо, кимбрийский, кофан, корнуоллский, корсиканский, крик, крымскотатарский (латиница), хорватский, чешский , Датский, даван, делавэр, дхоло, дреху, голландский, английский, эсперанто, эстонский, фарерский, фиджийский, филиппинский, финский, фолькспраак, французский, фризский, фриульский, гагаузский (латинский), галисийский, ганда, генуэзский, немецкий, гикуйю, Гунианди, гренландский (Калааллисут), гваделупский креольский, гвичин, гаитянский креольский, хан, гавайский, хилигайнон, хопи, хотчек (латиница), венгерский, исландский, идо, игбо, илокано, индонезийский, интерглосса, интерлингстро, ирландский Румынский, итальянский, ямайский, яванский (латиница), Jèrriais, Kaingang, Kala Lagaw Ya, Kapampangan (латиница), Kaqchike l, каракалпакский (латиница), карельский (латинский), кашубский, киконго, киньяруанда, кирибати, кирунди, клингонский, курдский (латинский), ладинский, латинский, латинский синус Flexione, латышский, литовский, ложбанский, ломбардский, нижнесаксонский, люксембургский, Масаи, махува, малайский, мальтийский, мэнский, маори, маркизский, меглено-румынский, мериам-мир, мирандский, ирокез, молдавский, монтанье, черногорский, муррин-патха, нагамский креольский, науатль, ндебеле, неаполитанский, нгиянамба Норвежский, Новиаль, Западный, Окситанский, Староисландский, Древнескандинавский, Онипот, Осивамбо, Осетинский (латиница), Палау, Папьяменто, Пьемонтский, Польский, Португальский, Потаватоми, Кекчи, Кечуа, Раротонга, Румынский, Романский, Ротокас, Саамский (инари саамский), саамский (луле саамский), саамский (северный саамский), саамский (южный саамский), самоанский, санго, сарамакканский, сардинский, шотландский гэльский, сербский (латинский), сери, сейшельский креольский, шауни, шона, сицилийский , Силезский, словацкий, словенский, словенский (латиница), сомалийский, сербский (нижний сербский), сербский (верхний сербский), сото (северный rn), сото (южный), испанский, шранан, сунданский (латиница), суахили, свази, шведский, тагальский, таитянский, тетум, ток писин, токелауанский, тонганский, чилуба, тсонга, тсвана, тумбука, турецкий, туркменский (латинский) , Тувалу, цоциль, узбекский (латиница), венецианский, вепсский, волапюк, выро, валлисский, валлонский, варай-варай, варлпири, вайу, валлийский, вик-мунгкан, вираджури, волоф, хаванте, коса, япезе, зинджотечинда Зарма, Зазаки, Зулу, Зуни
Этот шрифт включает веб-версии
Lettersoup
Квазимода
Quasimoda — это «почти модное» семейство шрифтов без засечек с 11 толщиной и соответствующим курсивом.В нем модные геометрические формы сочетаются со старомодными классическими пропорциями. Базирующийся в Берлине Ботио Николчев (Lettersoup) разработал Quasimoda таким образом, чтобы более легкие веса создавали свежий, современный вид, средние веса обеспечивали отличную читаемость и элегантность для более длинных текстов, а самые жирные веса привносили немного устаревший стиль.
Отчасти геометрический, отчасти гротескный, Квазимода — универсальный зверь. Он следует нынешним модам, но не полностью им поддается, сохраняя классические пропорции и легкую уродливость гротесков XIX века.Благодаря длинным нисходящим элементам и небольшой высоте по оси x Quasimoda хорошо сочетается со шрифтами с засечками Renaissance, такими как Garamond, или может служить ведущим основным шрифтом для более длинных текстов, а также для различных целей брендинга, заголовков и отображения. Quasimoda включает символы для более чем 80 языков с латинским алфавитом, а также несколько наборов рисунков, доступных как функции OpenType.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: албанский, эльзасский, арагонский, арапахо, арумынский, аррернте, астурийский, аймара, баскский, белорусский (ласинка), бислама, боснийский, бретонский, каталонский, кебуанский, чаморро, шайенский, чичева (ньянджа), чимбанский , Хорватский, чешский, датский, голландский, английский, эстонский, фарерский, фиджийский, финский, французский, французский креольский (Сент-Люсия), фризский, фриульский, галисийский, генуэзский, немецкий, гильбертский (Кирибати), гренландский, гаитянский креольский, гавайский, Хилигайнон, хмонг, хопи, венгерский, ибанаг, илоко (илокано), индонезийский, интерглосса (глоса), интерлингва, ирландский (гэльский), исландский, истро-румынский, итальянский, йеррианский, кашубский, курдский (курманджи), ладинский, латышский, Литовский, ложбан, ломбард, нижний саксонский, люксембургский, малагасийский, мальтийский, мэнский, маори, меглено-румынский, могавк, науатль, норфолк / питкэрнский диалект, северный сото (педи), норвежский, окситанский, оромо, пангасинанский, папьяменто, польский , Португальский, потаватоми, кечуа, ретороманский, румынский, ретороманский (румынский), Ro токас, саамский (инари), саамский (луле), самоанский, сардинский (сарду), шотландский (гэльский), сербский, сейшельский креольский (шесельва), шона, сицилийский, словацкий, словенский (словенский), сомалийский, южный ндебеле, южный сото (Сесото), испанский, суахили, свати / свази, шведский, тагальский (филиппинский / пилипинский), таитянский, таусуг, тетум (тетун), ток писин, тонган (фака-тонга), тсвана, турецкий, туркменский, туркменский (латинизированный) , Тувалу, уйгурский (латинизированный), вепсский, волапюкский, водский (латинизированный), валлонский, варлпирский, валлийский, коса, япский, зулусский
Этот шрифт включает веб-версии
Пауло Гуд
Псевдоним
Псевдоним — это малоконтрастный шрифт с небольшими расклешенными засечками, доступный в четырех вариантах толщины в трех стилях, как римских, так и курсивных.
Как и все мои гарнитуры, я создаю шрифты, которые сам буду использовать для целей брендинга — шрифты со стилем и назначением, которые предназначены для использования при создании логотипов и отличительной типографики для брендинга. Я хотел создать шрифт, в котором были бы резкие расклешенные засечки в сочетании с силой и солидностью современных гротескных шрифтов. В результате получился псевдоним, который, как мне кажется, имеет отличный внешний вид, стиль и удобочитаемость.
Я уверен, что вам понравится играть с некоторыми функциями открытого типа, которые я добавил в псевдоним.Существует полный набор настоящих маленьких заглавных букв с соответствующими диакритическими знаками и цифрами. Существует также ряд дополнительных лигатур, которые выбираются из палитры глифов в вашем приложении макета для замены пар стандартных символов. Вам также понравится использовать словечки — они были созданы, чтобы гармонировать с каждым стилем, опять же, что дает вам больше гибкости и возможностей для создания инновационной типографики. Наконец, есть несколько альтернативных символов для / C / D / O /. Вы можете использовать их при создании логотипов, которые включают стандартные сокращения для ограниченного, количества, встроенного и т. Д.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: албанский, эльзасский, арагонский, арапахский, арумынский, аррернте, астурийский, аймара, баскский, бислама, боснийский, бретонский, кебуанский, чаморро, шайенский, чичева (ньянья), кимбрийский, корсиканский, датский, чешский, Голландский, английский, эстонский, фарерский, фиджийский, финский, французский, французский креольский (Сент-Люсия), фризский, фриульский, галисийский, генуэзский, немецкий, гильбертский (Кирибати), гренландский, гаитянский креольский, гавайский, хилигайнонский, хмонг, хопи, венгерский , Ибанаг, Илоко (Илокано), индонезийский, Interglossa (Глоса), интерлингва, ирландский (гэльский), исландский, истро-румынский, итальянский, Jèrriais, кашубский, курдский (курманджи), ладинский, латышский, литовский, ложбан, ломбардский, низкий Саксонский, люксембургский, малагасийский, мальтийский, мэнский, маори, меглено-румынский, могавк, науатль, норфолк / питкэрн, северный сото (педи), норвежский, окситанский, оромо, пангасинанский, папиаменто, пьемонтский, польский, португальский, потаватоми, раха Романский, румынский, ретороманский (румынский), ротокас, саамский (инари), саамский (луле), самоанский , Сардинский (сарду), шотландский (гэльский), сейшельский креольский (Seselwa), шона, сицилийский, словацкий, словенский (словенский), сомалийский, южный ндебеле, южный сото (сесото), испанский, суахили, свати / свази, шведский, тагальский (Филиппинский / пилипинский), таитянский, таусуг, тетум (тетун), ток писин, тонган (фака-тонга), тсвана, турецкий, туркменский, туркменский (латинизированный), тувалуский, уйгурский (латинизированный), вепсский, волапюк, вотский (латинизированный) ), Валлонский, варлпири, валлийский, коса, япезе, зулусский
Этот шрифт включает веб-версии
Фенотип
Cosmopolitan
Cosmopolitan — это семейство монолинейных шрифтов с версиями шрифтов и без, которые отлично работают вместе или по отдельности.Поставляется с пятью весами и «печатной» версией. Для лишних штрихов, завихрений и пиктограмм есть Cosmopolitan Extras.
ВCosmopolitan Script есть альтернативы OpenType: включите Swash, Stylistic или Titling Alternates в любой продвинутой программе OpenType или найдите еще больше альтернатив в палитре Glyph.
Cosmopolitan Sans имеет разные варианты Swash для символов верхнего и нижнего регистра.
Cosmopolitan Family придаст элегантный вид любому проекту, от печатного до цифрового.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: африкаанс, албанский, асу, баскский, бемба, бена, боснийский, каталонский, чига, конго суахили, корнуолл, хорватский, чешский, датский, голландский, эмбу, английский, эсперанто, эстонский, фарерский, филиппинский, финский, Французский, галисийский, немецкий, гусии, венгерский, исландский, индонезийский, ирландский, итальянский, Кабувердиану, Калааллисут, Календжин, Камба, Кикую, Киньяруанда, латышский, литовский, Луо, Луйя, Мачаме, Махува-Митто, Маконде, Малагасийский, Малайский, Мальтийский, Манкс, Маори, Меру, Морисьен, Северный Ндебеле, Норвежский Букмол, Норвежский Нюнорск, Ньянколе, Оромо, Польский, Португальский, Романский, Ромбо, Рунди, Рва, Самбуру, Санго, Сангу, Сена, Сербский (латиница), Шамбала, Шона, словацкий, словенский, сога, сомалийский, испанский, суахили, шведский, швейцарский немецкий, Taita, Teso, Vunjo, валлийский, зулусский
Этот шрифт включает веб-версии
Typesketchbook Foundry
Брюль Гротеск
Черпая вдохновение в попытке соединить искусство с индустрией Баухауза (1919), Брюль Гротеск является классическим и прямолинейным, сокращая лишние элементы.Шрифт без засечек — это как дизайн эпохи машин. Он поставляется в наборах A и B, чтобы предложить варианты концов — выберите набор выпуклых выводов, если вам нужно менее строгое впечатление. Тогда он подходит для различных требований.
Brueul Grotesk имеет наборы A и B по 16 букв в каждом, что дает вам универсальное применение.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: албанский, баскский, белорусский, боснийский, бретонский, каталонский, хорватский, чешский, датский, голландский, эсперанто, эстонский, фарерский, финский, французский, фризский, галисийский, немецкий, венгерский, исландский, итальянский, литовский, малагасийский , Мальтийский, норвежский, польский, португальский, румынский, сербский, словацкий, словенский, испанский, шведский, турецкий, валлийский
Этот шрифт включает веб-версии
Группа Борутта
Алергия Гротеск
Alergia Grotesk был создан как гибрид классического геометрического гротеска и линейного антиква.Этот шрифт отличается большим количеством деталей, что придает ему выразительный характер. Непредсказуемые сокращения букв «a» и «s» или двойное «g» в сочетании с тонким контрастом делают Alergia Grotesk хорошим выбором для многих целей, от заголовков до коротких плавных текстов. Большой выбор вариантов ширины позволяет универсально использовать и может дать хороший эффект при смешивании экстремальных сортов друг с другом в одном проекте. Семейство состоит из 10 начертаний, 3 ширины и набора курсивов — всего 60 стилей.У всей семьи есть исчерпывающий набор персонажей.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: в дополнение к латинским буквам, полный набор символов для вьетнамского, расширенной кириллицы (с абхазским) и греческого
Этот шрифт включает веб-версии
Литейный завод
Марианина ФЮ
Марианина Ф.Ю. — действительно большое семейство без засечек из 24 шрифтов.С его очень специфическими чернильными трапами, тонкими в светлых версиях и более заметными в черных, каждый римский шрифт (сокращенный и нормальный) имеет 6 толщин, а также выделен курсивом. Marianina FY — это идеальное современное семейство шрифтов для мелкого и большого текста, вдохновленное шрифтами 20-го века.
Марианина Ф.Ю. была создана в соавторстве с Алисой Новак и Жереми Хорнус.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: расширенная латиница и базовая латиница
Этот шрифт включает веб-версии
Ильхам Херри
Хиптон
Новое семейство многоуровневых шрифтов под названием The Hipton. Вдохновленный отдельными штрихами готических букв с подписанных картин, сделал его многослойным. Это коллекция стилей с многоуровневой системой шрифтов и множеством возможных комбинаций и опций.
В качестве экранного шрифта Hipton подходит для заголовков, логотипов, знаков, плакатов, поздравительных открыток, фирменных бланков, футболок и многого другого.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: базовая латынь, западноевропейская, европейская, панафриканская латынь
Этот шрифт включает веб-версии
Vintage Voyage Design Co.
Коллекция шрифтов Aviator
Коллекция шрифтов Aviator — это сочетание четырех разных винтажных шрифтов — 100% потрясающий винтажный стиль!
Создайте свой собственный винтажный стиль — элегантная чистая или проблемная высокая печать.И это еще не все — 52 винтажных иллюстрации для создания логотипа и потрясающие инструменты — Vintage Badge Creator! Просто установите все эти файлы шрифтов и создайте свой собственный. Они идеально подходят для логотипов, рекламы, дизайна одежды, этикеток, плакатов, дизайна упаковки, вывесок и т. Д.
Три шрифта представлены в двух стилях: чистый и старый (проблемная высокая печать) и шрифт Script входят в один стиль — чистый. Вся коллекция Aviator представлена западноевропейскими персонажами.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: набор символов Западной Европы — итальянский, испанский, португальский, французский, немецкий, голландский, английский, датский, шведский, норвежский и исландский, в которых используется латинский алфавит.
Этот шрифт включает веб-версии
MaGo
Горни Гарнитура
ГарнитураGorni — это дисплей с засечками с романтической атмосферой.
В этот набор входит:
• Специальные лигатуры
• Рифленые и альтернативные символы
• Функции открытого шрифта
• И обычные (382 символа), и прописные (290 знаков) версии
• Специальные знаки препинания, числа и символы
• И то, и другое.TTF и .OTF версии
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: албанский, баскский, датский, голландский, английский, эстонский, феррозский, финские шотландцы, французский, гэльский, галисийский, немецкий, с греческой транслитерацией, венгерский, исландский, индонезийский, ирландский, итальянский, норвежский нюнорск букмал, португальский, румынский , Словацкий, словенский, испанский, шведский
Этот шрифт включает веб-версии
Пенсионеры
Скрипт Аарона
Aaron — очень разборчивый шрифт Script, просто красивый, стильный и элегантный шрифт.Может использоваться для различных целей, таких как логотипы, приглашения на свадьбу, футболки, фирменные бланки, вывески, новости, плакаты, значки и т. Д.
Aaron Script содержит 400+ глифов и 190 альтернативных символов, включая начальные и конечные буквы, альтернативные символы, орнамент, перекос, лигатуры и поддержку нескольких языков.
Включено файлов:
• Aaron Script.otf
• Aaron Script.ttf
Чтобы включить альтернативы OpenType Stylistic, вам потребуется программа, поддерживающая такие функции OpenType, как Adobe Illustrator CS, Adobe Indesign и CorelDraw X6-X7, Microsoft Word 2010 или более поздние версии.
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Языковая поддержка: Франция, Италия, Испания, Германия, Швеция, Дания, Англия
Этот шрифт включает веб-версии
Моя творческая страна
Коллекция шрифтов Sunshine Daisies
КоллекцияSunshine Daisies Hand Lettered включает 15 рукописных шрифтов, наполненных весельем и солнечным светом.Все они, включая многослойный шрифт без засечек, можно комбинировать разными способами. Сценарий полон альтернатив, а в многоуровневый шрифт встроена псевдослучайная функция, которая означает, что две буквы никогда не будут выглядеть одинаково, если их поместить рядом друг с другом. Чтобы добавить еще больше удовольствия, мы добавили специальный шрифт Sunshine Daisies Extra с более чем 150 рисунками с двухцветной заливкой. Идеально подходит для цитат, футболок, обложек книг, плакатов, проектов упаковки, все шрифты Sunshine Daisies полностью отображены в кодировке Unicode, поэтому вы можете использовать их в любом приложении.Наслаждаться!
Обратите внимание, что для Stylistic Alternates потребуется профессиональное программное обеспечение для дизайна, такое как Adobe Illustrator, Photoshop, InDesign или Inkscape.
Поддержка языков: бретонский, каталонский, чешский, датский, эстонский, английский, финский, французский, немецкий, венгерский, исландский, итальянский, латышский, литовский, норвежский, польский, португальский, румынский, шотландский гэльский, словацкий, словенский, испанский, Шведский, турецкий, валлийский и все другие языки на основе латинского алфавита
Этот шрифт включает веб-версии
Design Cuts Лицензирование
Эта сделка включает в себя нашу новую расширенную лицензию .Вы можете найти все подробности на нашей полной странице лицензирования.
Обзор комплекта
Вот еще один взгляд на некоторые из замечательных ресурсов, включенных в этот набор:
включает в себя наши новые и улучшенные руководства по просмотру пакетов
Мы очень рады сообщить, что, внимательно прислушавшись к мнению нашего сообщества, мы обновили наши руководства по просмотру пакетов. Теперь в них есть обновленное руководство в формате PDF и новое руководство по галерее изображений. Это позволяет вам легко просматривать каждого дизайнера и элемент в вашем комплекте, используя удобное оглавление и функцию поиска.Мы надеемся, что они значительно сэкономят время дизайнерам во всем мире.
CSS шрифтов
Выбор правильного шрифта для вашего сайта очень важен!
Выбор шрифта важен
Выбор правильного шрифта имеет огромное влияние на то, как читатели воспринимают Веб-сайт.
Правильный шрифт может создать сильную идентичность для вашего бренда.
Важно использовать легко читаемый шрифт.Шрифт добавляет значение вашего текста. Также важно выбрать правильный цвет и размер текста. для шрифта.
Общие семейства шрифтов
В CSS существует пять общих семейств шрифтов:
- Шрифты Serif имеют небольшой штрих по краям каждой буквы. Они создают ощущение формальности и элегантности.
- Шрифты без засечек имеют чистые линии (без мелких штрихов). Они создают современный и минималистичный вид.
- Моноширинный шрифт — здесь все буквы имеют одинаковую фиксированную ширину. Они создают механический вид.
- Курсивный шрифт имитирует человеческий почерк.
- Шрифты Fantasy — это декоративные / игривые шрифты.
Все различные имена шрифтов принадлежат к одному из общих семейств шрифтов.
Разница между шрифтами с засечками и без засечек
Примечание: Считается, что на экранах компьютеров шрифты без засечек легче читать, чем шрифты с засечками.
Некоторые примеры шрифтов
Семейство общих шрифтов | Примеры названий шрифтов |
---|---|
Serif | Times New Roman Джорджия Гарамонд |
Без засечек | Ариал Вердана Гельветика |
Моноширинный | Courier New Lucida Console Monaco |
Курсив | Brush Script MT Lucida Рукописный ввод |
Фантазия | Медная пластина Папирус |
Свойство семейства шрифтов CSS
В CSS мы используем свойство font-family
для
укажите шрифт текста.
Свойство font-family должно содержать несколько имен шрифтов в качестве «резервной» системы, для обеспечения максимальной совместимости между браузерами / операционными системами. Начните с желаемого шрифта и закончите общим семейством (позволить браузер выбирает аналогичный шрифт из общего семейства, если другие шрифты не доступный). Названия шрифтов следует разделять запятыми.
Примечание : Если название шрифта состоит из более чем одного слова, оно должно быть заключено в кавычки, например: «Times New Roman».
Пример
Укажите несколько разных шрифтов для трех абзацев:
.p1 {font-family: «Times New Roman», Times, serif;
}
.p2 {семейство шрифтов
: Arial, Helvetica, sans-serif;
}
.p3 {Семейство шрифтов
: «Lucida Console», «Courier New», моноширинный;
}
Как выбрать правильные шрифты для вашего маркетинга
Вы когда-нибудь хотели, чтобы это были 1960-е, и вы были креативным директором в процветающем агентстве на Мэдисон-авеню? Время от времени у всех нас творческий дух тоскует по старым временам маркетинга.
Вы знаете, эпоха, когда маркетинг определялся умным копирайтингом, искусной рекламой и вниманием к мельчайшим деталям дизайна.
Как входящие маркетологи, легко увязнуть в бесконечном цикле создания контента, идти в ногу с быстрым темпом Интернета, упуская из виду более тонкие детали дизайна — трекинг, кернинг и межбуквенные интервалы — это может придать нашему маркетингу дополнительный уровень блеска.
Хорошо продуманная типографика способна привлечь внимание, вызвать эмоции и усилить сообщение вашего бренда.Никогда не следует оставлять на волю случая выбор шрифта для маркетинговых материалов — существует ряд стратегических соображений, которые следует учитывать при выборе идеального шрифта.
Как правильно выбрать шрифт
- Передайте сообщение вашего бренда.
- Найдите вдохновение и изучите использование типографики.
- Выберите службу доставки шрифтов.
- Сравните шрифты бок о бок и посмотрите, что кажется правильным.
- Определите визуальную иерархию вашего веб-сайта, чтобы определить, какие шрифты необходимы.
- Выбирайте шрифты для удобочитаемости.
- Настройте шрифты для удобства чтения.
- Выберите правильный размер шрифта.
- Обратите внимание на высоту строки и интервал между абзацами.
- Используйте контраст в своих интересах.
- Тест на удобочитаемость и удобочитаемость на всех устройствах.
«Типографика — это мода или мебель. За редкими функциональными исключениями, миру не нужны новые модели одежды или мебели , но люди хотят выглядеть по-другому, вызывать определенные чувства или соответствовать определенному образу, и существуют тенденции и стили ».
Начните с того, что вы хотите, чтобы голос вашего бренда звучал и каковы ценности вашей организации.Если вы веселая компания, выберите забавный шрифт, который подчеркнет вашу индивидуальность. Если вы хотите, чтобы вас воспринимали как современного и элегантного, выбирайте шрифты, поддерживающие эту эстетику.
Легко сказать «выберите шрифт, который отражает ваш бренд», но вы все еще можете задаться вопросом, как выделить короткий список потенциальных гарнитур из бесконечного выбора, доступного в вашем распоряжении.
Хотя окончательный выбор часто сводится к хорошему вкусу в дизайне и опирается на опыт разработки визуальной идентичности, есть несколько простых шагов, которые помогут вам отточить идеальный шрифт для вашего бренда.
2. Найдите вдохновение и изучите использование типографики.Когда дело доходит до вдохновения для типографики, эти три ресурса всегда содержат первоклассную типографику:
Изучите работы других дизайнеров и определите, какие элементы типографики «работают» для вашего бренда. Нет ничего постыдного в том, чтобы искать вдохновения в работе других дизайнеров, даже самые известные дизайнеры и художники часто черпают вдохновение друг у друга.
3.Выберите службу доставки шрифтов.Если вы намереваетесь постоянно использовать шрифты вашего бренда в Интернете, вам нужно будет выбрать службу доставки шрифтов. Typekit, Google Fonts и fonts.com, как правило, являются наиболее распространенными. Эти услуги на основе подписки позволяют вам получать доступ к огромным коллекциям шрифтов, доставлять шрифты на ваши веб-ресурсы и обеспечивать правильное отображение шрифтов в каждом веб-браузере и на каждом устройстве.
После того, как вы выбрали службу доставки шрифтов, которую вы будете использовать, вы можете начать сужать свой выбор потенциальных шрифтов из их библиотеки.В большинстве этих сервисов есть удобные способы фильтрации шрифтов по типографским характеристикам, сравнения шрифтов бок о бок и сохранения шрифтов из краткого списка для просмотра.
4. Сравните шрифты бок о бок и посмотрите, что кажется правильным.После того, как вы сузили свой выбор до короткого списка возможных комбинаций шрифтов, создайте карточку меню, в которой сравниваются все варианты. Просмотр всех ваших вариантов рядом (как на экране, так и на распечатке) может помочь сравнить одну комбинацию с другой и отточить идеальные шрифты для вашего бренда.
Работа над процессом выбора шрифта с использованием только черного и белого помогает сосредоточить выбор на атрибутах шрифта, а не на том, как цвет влияет на привлекательность одного шрифта над другим. Цвет оказывает значительное влияние на психологию и поведение зрителей. В результате выбор шрифтов и цветов — это два отдельных шага в процессе разработки фирменного стиля.
5. Определите визуальную иерархию вашего веб-сайта, чтобы определить, какие шрифты необходимы.Для многих сценариев проектирования вам понадобятся два шрифта: один шрифт заголовка и один шрифт основного текста.Это может быть комбинация двух весов шрифтов, цветовых вариаций или двух совершенно разных семейств шрифтов.
Цель состоит в том, чтобы создать визуальную иерархию, которая позволяет зрителям быстро сканировать ваши маркетинговые материалы, определять наиболее важные элементы и понимать, как каждый элемент соотносится с другими компонентами страницы или экрана. Это особенно важно для входящего маркетинга. Вместо того, чтобы внимательно читать каждое слово на странице, посетители часто просматривают только заголовки и сосредотачиваются на том, что их больше всего интересует.
6. Выбирайте шрифты для удобочитаемости.Разборчивость относится к тому, как разработан шрифт и насколько хорошо один отдельный символ может отличаться от другого. Это также относится к тому, насколько четко определены формы слов.
Шрифты, которые хорошо смотрятся в заголовках, могут не работать и для основного текста. Хотя есть некоторые исключения из этого правила, когда вы выбираете шрифты, которые будут использоваться специально в заголовках или основном тексте, вы можете сузить его в зависимости от типа начертания шрифта:
- Лицевые стороны дисплея разработаны специально для использования в больших форматах, например в заголовках.
- Текст или основные грани разработаны специально для использования на больших участках текста и предназначены для более длительных отрывков для чтения.
Еще одним фактором, влияющим на разборчивость шрифта, является форма символов. Вы, вероятно, слышали термин serif или sans-serif.
- Шрифты с засечками имеют маленькие «ножки» (засечки), отходящие от краев букв и символов.
- Шрифты без засечек не имеют мелких линий, выступающих из углов.
с засечками обычно легче читать в основной копии печатных работ, и они широко используются в течение десятилетий, что иногда может придать им более классический вид. Из-за размера экрана и разрешения, с которого часто просматривается веб-контент, многие веб-дизайнеры отдают предпочтение шрифтам без засечек для Интернета. Шрифты без засечек также хорошо соответствуют текущим тенденциям дизайна и выглядят более современно.
7. Настройте шрифты для удобства чтения.Разборчивость шрифта способствует его общей читабельности.Читаемость — это то, как группы слов расположены на странице и насколько легко читателю сканировать слова и понимать содержание и макет.
После того, как вы узнаете свою визуальную иерархию и выберете шрифты заголовка и основного текста для различных вариантов использования, вы можете начать думать о том, как они влияют на удобочитаемость. Существует ряд технических компонентов типографики, которые влияют на читабельность шрифта, включая размер шрифта, межбуквенный интервал, высоту строки и интервал между абзацами.
8. Выберите правильный размер шрифта.Размер шрифта во многом зависит от экрана или поверхности, на которой будет отображаться сообщение. Для многострочных абзацев вы хотите, чтобы размер основного шрифта был ограничен 45-70 символами в строке.
Если у вас более 70 символов в строке, читателям будет утомительно просматривать каждую взад и вперед, и они с большей вероятностью потеряют свое место. Слишком короткие строки могут привести к неудобным переносам через дефис или, если это оправдано, к потокам пробелов, проходящих через абзацы.
Подробнее об этом здесь.
9. Обратите внимание на высоту строки и интервал между абзацами.Как и размер шрифта, интервал между каждой строкой текста может иметь большое влияние на то, насколько легко ваш контент читается. Расстояние между строками текста, более формально известное как «начало», должно быть не меньше размера шрифта. Большинство цифровых дизайнеров предпочитают, чтобы начальный размер составлял не менее 150 процентов от размера текста.
Читатель не должен обращать внимания на высоту строки или интервал между абзацами.Хорошо продуманная типографика ориентирована на функцию, и эта функция заключается в передаче сообщения. Это не означает, что внешний вид вашего текста вообще не должен привлекать внимания; это просто не должно быть в центре внимания.
10. Используйте контраст в своих интересах.Это может показаться очевидным, но контраст — главный компонент читабельности шрифта. Контрастность достигается за счет использования пространства и цвета. Темный текст на бледном фоне удобен для блогов и книг, поскольку он обеспечивает удобство чтения для более длинных блоков текста.Цветной шрифт следует использовать для заголовков и отображаемого текста.
11. Проверьте читаемость и удобочитаемость на всех устройствах.Адаптивный веб-дизайн вносит совершенно новый подход в рассмотрение того, как типографика единообразно отображается на нескольких устройствах, от небольших экранов смартфонов до 60-дюймовых телевизоров высокой четкости.
Чтобы по-настоящему обеспечить удобочитаемость и удобство для всех пользователей, которые просматривают ваш веб-сайт или взаимодействуют с вашими маркетинговыми материалами, вы захотите протестировать свои проекты на широком спектре устройств, которые ваша аудитория использует для использования вашего контента.
Лучший размер шрифта для вашего веб-сайта
Ваш веб-сайт должен иметь несколько размеров шрифта для разных случаев использования. Начнем с основных функций: основного основного текста, дополнительного основного текста и заголовков. Рекомендуется, чтобы основной шрифт основного текста был около 16 пикселей, но это может варьироваться в зависимости от разборчивости шрифта и его функции на странице.
Особенности шрифтов для различных элементов
Основной текст
Если основной основной текст нечитаемый при 16 пикселей, увеличивайте размер шрифта до тех пор, пока он не станет четким, или выберите другой шрифт.Когда у вас есть базовый план, вы можете определить размер шрифта для других типов шрифтов на вашем веб-сайте:
Дополнительный основной текст
Они используются для предоставления дополнительного контента без акцента. Часто они будут на 2 размера меньше основного основного текста.
Заголовок
Этот размер шрифта, вероятно, будет одним из самых больших на ваших страницах (если не , то самый большой), который используется для обозначения заголовков разделов или важной информации. Размеры шрифта заголовка будут зависеть от начертания и толщины шрифта, которые вы выбираете, но часто варьируются от 18 до 36 пикселей.У вас также может быть несколько заголовков разного размера и веса (h2, h3, h4 и т. Д.). Не стесняйтесь проявлять творческий подход, придерживаясь своей визуальной иерархии.
Особенности шрифтов для различных функций
Полнотекстовые страницы
Страницы с большим количеством текста (например, блоги) потребуют меньше внимания, чем шрифты, выполняющие другие типы функций. Цель состоит в том, чтобы обеспечить простой опыт чтения, который подчеркивает то, что они читают, а не привлекает внимание к самим шрифтам.
Более крупные шрифты здесь лучше, так что ваша аудитория не будет перегружена стеной крошечного текста, которую они должны прищуриться, чтобы прочитать. Не стесняйтесь увеличивать основной шрифт в таких случаях.
Взаимодействие — тяжелые страницы
Целевые страницы, страницы продуктов и другие функции веб-сайта менее жесткие, когда дело доходит до текста, поскольку на них будет больше действий. Скорее всего, вы будете больше заинтересованы в том, чтобы выделить определенные элементы вашей копии (или даже изображений), в то же время уменьшив акцент на других.
По этой причине вы можете получить более широкий выбор размеров шрифтов, начертаний и цветов, когда вы намеренно направляете взгляд читателя по странице. Вернитесь к своей иерархии дизайна и реализуйте в соответствии со своей стратегией.
Хотя некоторые принципы дизайна в некоторой степени универсальны, требуются проб и ошибок, чтобы применить их на практике таким образом, чтобы это было функционально и привлекательно для вашего бренда.
Примечание редактора: этот пост был первоначально опубликован в феврале 2014 года и был обновлен для полноты.
Выбор гарнитуры — любовь к графике Выбор гарнитуры
Один из лучших способов решить, какой шрифт использовать, — это иметь четкое представление о его применении. Тип будет цифровым или печатным? Потребуются ли для этого разные веса и позы? Если для этого требуется множество дробей и цифр, есть ли у гарнитуры полный набор опций OpenType для чисел? Хотя каждый шрифт имеет индивидуальный внешний вид, его применение в конечном итоге определяет его полезность.
Когда вы смотрите на распечатанную страницу, вы видите шрифт. Форма и пропорции букв этого типа отражают дизайнерские качества конкретного шрифта. Эти дизайны хранятся, воплощаются в шрифте, из которого система набора текста извлекает информацию, необходимую для размещения этого шрифта на странице.
Шрифты и гарнитуры являются основным сырьем для набора.
Определения: шрифт против гарнитуры
Нет двух слов в типографике, которые используются так часто, как шрифт и шрифт .
Гарнитура — это набор символов — букв, цифр, символов, знаков препинания и т. Д. — которые предназначены для совместной работы, как части скоординированного наряда. Гарнитура — это алфавит с определенным рисунком. Шрифт, напротив, представляет собой физическую вещь, описание шрифта — в компьютерном коде, на фотопленке или металле — используемое для изображения шрифта. Шрифт — это форма для печенья, а шрифт — это печенье
.Когда вы смотрите на страницу шрифта, вы можете сказать: «Что это за шрифт? » или « Какой шрифт использовался для этого? Но вы не можете сказать, «Что это за шрифт?» , потому что вы не смотрите на шрифт; вы смотрите на продукт шрифта.
Путаница между терминами возникает в основном из-за неоднозначного использования термина «шрифт» в компьютерных программах, большинство из которых имеют меню «Шрифт». Хотя в этом меню перечислены шрифты, доступные для использования программой, его можно так же легко назвать меню «Гарнитура шрифтов», так как в нем также перечислены шрифты, доступные для ваших страниц. Фактически, поскольку некоторые шрифты содержат данные для более чем одного гарнитуры, правильнее было бы назвать его меню «Гарнитура».
Выбор гарнитуры
Один из лучших способов решить, какой шрифт использовать, — это иметь четкое представление о его применении.Тип будет цифровым или печатным? Потребуются ли для этого разные веса и позы? Если для этого требуется множество дробей и цифр, есть ли у гарнитуры полный набор опций OpenType для чисел?
Несмотря на то, что каждый шрифт имеет индивидуальный внешний вид, его применение в конечном итоге определяет его полезность.
Тип текста
Для типа текста используйте шрифты, предназначенные для непрерывного чтения, такие как Caslon, Bembo и Garamond. Эти три хорошо подходят для больших областей книжного текста.Times New Roman — хотя и часто используется сегодня — был разработан в двадцатом веке для использования в качестве газетного шрифта и также подходит для книжного текста. Clearface, Centaur и Sabon также хорошо читаются.
Длина строки, межсловный интервал и начало — все это влияет на удобочитаемость текста книги, но выбор проверенного временем шрифта — лучшее место для начала.
Тип дисплея
Тип дисплея должен быстро привлекать внимание читателей , во многом подобно сообщениям на плакатах, рекламных объявлениях и рекламных акциях, ставших популярными в конце девятнадцатого века.Использование типографского размера для привлечения внимания продолжается и по сей день, когда напористость помогает преодолеть визуальный шум конкурентов.
В то время как тип текста редко полагается на эти меры для привлечения внимания, заголовки и подзаголовки в печатных и цифровых материалах должны привлекать читателей, очерчивать уровни информации, сообщать читателям, где они находятся, и удерживать их внимание.