Типографика: процесс выбора шрифта. Как найти нужный шрифт по его изображению

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

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

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

Определите свою цель

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

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

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

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

Очертите свою аудиторию

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

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

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

При выборе шрифта учитывайте особенности и потребности своей целевой аудитории. Говоря проще, ставьте себя на их место.

Ищите вдохновение

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

Вдохновение: шрифты

За свежими идеями насчет шрифтов можете обратиться к The 100 Best Free Fonts от CreativeBloq - это отличный источник, который придаст вам нужный настрой. В своей статье CreativeBloq объясняет логику, которой они следовали при выборе каждого из шрифтов.

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

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

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

Вдохновение: сочетания

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

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

FontPair - еще один ресурс о том, как лучше выбирать сочетания, предназначенный конкретно для работы с Google Fonts . На ресурсе предусмотрена возможность сортировки по сочетаниям стилей (например, sans-serif и serif или serif и serif).

И наконец, в Сети полно наборов готовых сочетаний от профессиональных дизайнеров. Скажем, Typography: Google Fonts Combinations или Typography: Google Fonts Combinations Volume 2 . Просто вбейте запрос «font pairing» на Behance , Dribble и других подобных сайтах.

Выберите шрифт

Теперь, когда вы теоретически подкованы и запаслись вдохновением, можно приступить к выбору. В процессе отбора помните о трёх принципах: читабельность, разборчивость, цель.

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

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

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

Для веб-шрифтов можно использовать Google Fonts , Typekit , и Font Squirrel . На Google Fonts всё бесплатно, Typekit и Font Squirrel предлагают платные и бесплатные варианты.

Задайте размер

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

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

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

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

Вот эта надпись:

Первый сервис, с помощью которого мы будет определять шрифт –

Нажмите на кнопку “Browse” для выбора картинки с текстом. Далее вам предстоит выбрать один пункт и даух:

The background color is lighter than the characters color – означает, что цвет фона светлее цвета букв и символов,
The background color is dark, please invert colors – светлый текст на темном фоне.

Теперь нажмите на кнопку “Continue” для продолжения.

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

Снова кнопка “Continue” и перед нами список наиболее похожих шрифтов. Кстати, сервис правильно определил шрифт. Первый вариант – правильный.

Оценка сервиса – 5 баллов.

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

После выбора картинки с текстом нажмите “Continue”. Приятно, что сервис частично сам идентифицирует символы и лишь сомнительные вам придется ввести вручную.

И этот сервис отлично справился с заданием, правильно угадав шрифт. Единственный недостаток сайта What The Font это меньшее количество шрифтов по сравнению с WhatFontIs.

Оценка сервиса – 5 баллов.

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

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

Примеры вопросов, на которые вам предстоит ответить:

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

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

Мне не удалось с помощью этого сервиса найти нужный шрифт. Тест на пройден.

4. Font Finder Firefox Add-On – дополнения для Firefox, которое определяет какой шрифт используется на сайте. Просто выделите слово на сайте, и дополнение определит шрифт и стиль CSS.
Ссылка на дополнение https://addons.mozilla.org/en-US/firefox/addon/font-finder/

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

С помощью данного сервиса также не удалось определить шрифт.

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

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

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

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

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

Часто используемые шрифты

Стандартные шрифты для сайта это:

  • Times New Roman;
  • Arial; Georgia;
  • Impact;
  • Trebuchet MS;
  • Verdana и другие.

Они входят в группу безопасных. Рассмотрим их подробней:

Arial . Преимущество этого компактного шрифта в высоте букв.

Tahoma . Благодаря средне-широким буквам, идеально-подходящий для технических статей.

Trebuchet MS . Самый неподходящий для чтения. Даже при нормальном размере 12-14 px надо вглядываться в текст, что ведет к напряжению глаз.

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

MS Sans Serif . Считается системным шрифтом Windows. На нем написаны все памятки и оповещения операционной системы.

Georgia . Очень похож на Times. Но в нём более широкие и резкие засечки и концы.

Comic Sans MS . Самый ненавидимый обществом. Отличается плавными округлыми очертаниями, небольшой кривоватостью букв, маленьким меж буквенным расстоянием.

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

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

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

Итак, так какой шрифт лучше всего использовать на сайте? По последним опросам среди пользователей интернета, оптимальным вариантом является сделать заголовок с помощью Verdana, а основной текст - Times New Roman. Но не исключен вариант, при котором можно весь текст сделать именно Verdana.

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

Например, Verdana, Impact, Trebuchet MS. Тогда браузер после неудачной попытки использования Verdana попытается использовать Impact, а затем Trebuchet. В случае не отображения всех заданных шрифтов, система обозначит свой - по умолчанию. Таким образом, можно легко и просто оформить сайт на свой вкус, сделать его ярким и необычным. Главное - предотвратить проблемы при отображении на компьютерах посетителей ресурса.

Нововведение от Яндекс. Размер имеет значение!

Вслед за мобильным алгоритмом «Владивосток », Яндекс сделал фактором ранжирования размер шрифта . Теперь размер текста на мобильном сайте имеет значение и его стандарт 12 см. PX (или больше). Проверить шрифт на «мобилопригодность» можно в Яндекс.Вебмастере.

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

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

Интересно! Разные виды шрифтов обладают неодинаковым размером. Если вы хотите сделать его больше, не обязательно изменять его пиксельный размер. Можно поэкспериментировать с выбором других шрифтов. Например, если поставить размеры Times New Roman и Tahoma - 12 px - выглядеть они будут по-разному. Последний, визуально будет смотреться больше.

Здравствуйте, друзья! Сегодня мы поговорим о том, как выбирать шрифты для логотипа.

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

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

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

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

Рукописный шрифт с завитушками как у Coca-Cola и Disney ассоциируется с чем-то свободным и дружелюбным, делая логотип немного магическими.

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

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

Серия книг «Для чайников» использует очень неформальный шрифт, который содержит разные размеры шрифтов, для того, чтобы создать что-то, что не выглядит пугающе. Сообщение здесь следующее — любая тема может быть доступна.

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

Категории шрифтов

Все основные шрифты можно разделить на несколько видов: Serif (с засечками), Sans serif (без засечек), рукописные, Script, машинописные шрифты, шрифты с завитушками Display.

Шрифты Serif самые традиционные. У этих шрифтов линии (черточки) в конце каждого штриха, они смотрятся профессионально и классически. Например, Times New Roman – один из самых часто используемых шрифтов Serif.

Шрифты Sans serif выглядят более чисто и современно, потому что у них нет линий в конце штрихов.

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

Шрифты Script очень изысканны и предполагают роскошь. Как и у рукописных шрифтов, у них есть характерные черты.

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

Машинописные шрифты имитируют текст, набранный на печатной машинке.

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

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

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

— Какой имидж у моей компании?
— Какие качества ценят клиенты?
— Чтобы вы хотели бы подчеркнуть — надежность, креативность, стабильность?
— Если бы вы могли выбрать три слова, чтобы описать свой бренд, какими бы они были?
— Кто ваш идеальный клиент?

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

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

Выбирайте шрифт, не основываясь на личных предпочтениях

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

Учтите дух и особенности вашего бизнеса

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

Не копируйте конкурентов

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

Будьте оригинальными

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

Выбирайте простые шрифты

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

Как будет выглядеть выбранный шрифт в различных средах

Если несколько десятков лет назад шрифты использовались только в печатной среде, то теперь ситуация кардинально изменилась. Веб сайт, дисплей вашего смартфона, умные часы, разные гаджеты, 3D объекты — все это может быть средой, где использован ваш логотип.

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

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

Избегайте популярных шрифтов

Сейчас в Интернете столько сайтов со шрифтами, что уже нет оправданий, чтобы не исследовать их. Большинство из них позволяют просмотреть каждый шрифт, проверить как он будет смотреться с названием вашей компании, и т.д. Стоит помнить, что понравившийся вам шрифт могли использовать до вас или еще будут. Поэтому старайтесь избегать очень популярных шрифтов для своего дизайна — Roboto, Lobster, Ubuntu и т.д.
И помните, покупать шрифт или другой качественный продукт в Интернете — это нормально:)

Будьте вне времени

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

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

Никаких вычурностей

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

Дайте пространства

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

Сочетание несколько шрифтов

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

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

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

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

Сайт для подбора шрифтов

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

Ниже список сайтов, где вы может найти нужный шрифт для логотипа:

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

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

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

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

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

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

Больше сайтов со шрифтами можно найти в нашей .

Как видите подобрать шрифт для логотипа не так уж и сложно. Напишите в комментариях, какие советы / сервисы вы бы добавили.

Как выбрать правильный шрифт для логотипа: полное руководство обновлено: Февраль 17, 2018 автором: admin

Сейчас я вас научу плохому.

Допустим, есть картинка

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

Поиск по картинкам

Идем в поисковые системы и пробуем найти источник изображения, используя поиск по картинке.

https://www.google.ru/imghp?hl=ru

Исходную картинку загружаем через форму или кидаем на страницу поиска перестаскиванием.

Порой Яндекс отрабатывает лучше Гугла.

https://yandex.ru/images/

Польза от поисковых систем следующая.

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

Кто знает, это дело такое. Шансы малы, но не настолько, чтобы их игнорировать. Тем более в безвыходной ситуации.

«Что за шрифт» на MyFonts.som

Идем на Майфонтс в раздел, где работает специально обученный робот.

http://www.myfonts.com/WhatTheFont/

Мы роботу картинку, он нам - шрифты. Ну или ничего.

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

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

Если буква или знак (например, восклицательный) развалилась на две ячейки, перетащите одну картинку на другую и соберите букву назад.

Жмем Continue.

Робот постарается найти оригинал шрифта и предложит подходящие теги для дальнейшего самостоятельного поиска.

Поиск по ключевым словам на MyFonts.som

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

Наше изображение выполнено как бы фломастером (brush pen). Еще тут подойдут слова типа «каллиграфия» (calligraphic), «от руки» (handwritten) и т.д. Здесь можно воспользоваться тегами, которые предложил робот.

Можно искать термины по-отдельности или объединять их и комбинировать в одном запросе.

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

Жмем кнопку Search и просматриваем результаты, попутно отмечая для себя подходящие варианты на замену.

На Майфонтсе много вариантов на замену исходному шрифту.

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

Скриним.

Растр

В Фотошопе скрин превращаем в смарт-объект. В смарт-объекте накладываем на него Gradient Map от нужного цвета к белому.

В макете выставляем смарт-объекту режим наложения слоев, например, Multiply .

Для большинства случаев с белым фоном этого достаточно.

Кому этого мало, можете удалить из скрина белый цвет. Color Range…, тыкаете пипеткой в белый фон

получаете выделение по цвету, инвертируете выделение,

сглаживаете его пару раз на пиксель-другой, чтобы граница контура не была такой рваной,

и скрываете все белое под маску

В основном документе уже делаете со смарт-объектом все, что душе угодно, почти как с векторным шейпом.

При уменьшении смарт-объекта неровности контура станут менее заметны. Поэтому лучше скринить с запасом, а потом уже уменьшать до нужного размера.

Вектор

Если нужен вектор, то делаем трассировку в Иллюстраторе.

Открываем скрин из PNG-файла:

На панели Image Trace ставим Mode: Black and White, галочку Preview и аккуратно крутим Threshold и настройки в Advanced:

Получив приемлемый результат, делаем надписи Expand

и получаем вектор на все случаи жизни:

Бесплатные шрифты

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

За бесплатными шрифтами идем во Вконтакте, в группу «