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

MyFonts — определяем шрифт по изображению.

Первый и самый примечательный из них сервис от MyFonts, который позволяет определить шрифт по изображению. Для его использования Вам понадобится файл изображения (PNG,JPG, TIFF и т.п.), c искомым Вами шрифтом. Вот некоторые советы по подготовке данного файла:

• следует разъединить буквы, если они касаются друг друга;
• если изображение цветное, переведите его в оттенки серого;
• оставьте одну горизонтальную строку с 50 символами или менее;
• постарайтесь использовать изображение с высотой букв от 100 пикселей;

Подготовка изображения

Для нашей цели мы выбрали логотип сервиса Flickr, а для его обработки будем использовать Pixlr (работа с редактором графики онлайн). Обработка легкая и Вы справитесь за несколько шагов:

1. Сохраняем логотип flickr на ПК или копируем ссылку на него.

2. Открываем его в онлайн редакторе

3. Обесцвечиваем рисунок (получаем оттенки серого) с помощью команды Desaturate, как показано на скриншоте ниже:

4.  Обрезаем лишние символы с помощью инструмента «Crop» — 

5. Если логотип маленький, можно немного увеличить его в пункте Image-Image Size. Сохраняйте пропорции и не увеличивайте слишком сильно 30-50 процентов максимум.

6. Чтобы добавить резкости используйте фильтр в пункте «Filter-Unsharp mask…» и увеличьте контраст в пункте «Adjustments — Brightness&Contrast». Обычно Яркость («Brightness») уменьшают, а контраст увеличивают.

С помощью этих несложных манипуляций получаем наш новый исходник для определения шрифта:

Конечно,  в качестве мы потеряли, но для работы подойдет лучше.

Работа с сервисом What the font

Для работы с сервисом нужно загрузить наше изображение и нажать кнопку «Continue» (далее). Можно просто указать ссылку на изображение логотипа, но результат может оказаться неточным. Смотрим пример ниже:

На следующем этапе необходимо заполнить литеры, которые не определились или определились неверно и нажать «Далее»:

После некоторого времени мы получим результаты поиска и сможем выбрать на глаз наиболее подходящий шрифт из списка. В нашем случае это — Frutiger 75 Black или Les Tres N2.

Недостатки сервиса:

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

Определить английский шрифт на Myfonts

Определение шрифта по внешним признакам

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

Определяем шрифт с Identyfont

Сервис располагает почти 8000 шрифтов и предоставляет удобный инструмент по их фильтрации. Для распознания шрифта используются основные признаки, начиная с засечек (как Times New Roman) и оканчивая особенностями написания литер. Процесс фильтрации по засечкам показан на рисунке ниже:

Выбор осуществляется по нажатию на иконку. Далее необходимо указать расположение хвостика буквы «Q»,  закрыта или открыта заглавная «P», как выглядит знака доллара и т.д. Общее количество шагов — 8.

Результаты отображаются слева, а наиболее похожий шрифт по центру:

Определить шрифт по внешним признакам на Identyfont

Далее мы рассмотрим ещё несколько сервисов и способ определения русских шрифтов.

Определяем шрифт с Linotype

Подобрать шрифт по внешним признакам также можно с помощью сервиса Linotype. Вам будет предложено 11 вопросов для идентификации. Выбор немного меньше, чем у предыдущего сервиса, но тоже внушает доверие — больше 3000 шрифтов в коллекции.

Определить шрифт с помощью Linotype

Сервис определения шрифтов от  Bowfin

Сервис компании BowfinPrintworks позволяет с достаточной точностью определить шрифт с засечками, все признаки (10 штук) они решили разместить на одной странице. Вам необходимо выбрать совпадения и нажать кнопку Search (Поиск) внизу.

Определить шрифт с засечками онлайн

Поиск шрифта на Fonts

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

Распознать шрифт на Fonts

Все описанные сервисы действительны для латинских шрифтов и не работают (работают некорректно) с кириллицей.

Что делать если шрифт распознать не удалось нигде?

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

• Форум по поиску шрифтов Typophile
• Обсуждение на Flickr
• Форум на Myfont

Как определить шрифт на сайте?

Во многих случаях достаточно выделить фрагмент текста и просмотреть его код — нажимаем правую клавишу мыши и ищем пункт «Просмотреть код элемента». Показываем на примере Google Chrome и сайта Google:

Нужно выделить в коде интересующий нас элемент и посмотреть его свойства справа. Нас интересует пункт font-family, его значение и является искомым семейством шрифтов. В текущем случае — это Arial, Serif. Также шрифт может быть указан для всех элементов в теге <body>  как  параметр «font».

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

Некоторые мастера прячут шрифт в специальный скрипт — Cufon, в таком случае необходимо использовать просмотр скриптов сайта. Делается это так:

• Открываем просмотр кода элемента
• Проверяем,  есть ли Cufon (в поиске вводим это слово и смотрим его наличие в коде)
• Переходим в просмотр ресурсов (кнопка Resources — вкладка Frames — пункт Scripts)
• В списке скриптов ищем тот, текст кода которого начинается со слов Cufon.registerFont

Как выглядит этот процесс, показано на скриншоте ниже:

Определение кириллических шрифтов

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

Выбирайте базу шрифтов с делением на шрифты с засечками и без них;

Если это  шрифт бренда используйте поиск Яндекса или Google с запросами типа «название бренда шрифт» или «brand font» (иногда заграницей также ищут этот шрифт и бывает находят), в некоторых случаях дизайн-агенства указывают используемый шрифт в портфолио;

Пробуйте реверсивный поиск изображений  TinEye или Google, возможно найдется похожие изображения брендов или текстов с данным шрифтом;

Наконец спросите на форумах дизайнеров, но могут послать искать в Google 🙂

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

• Fontov.net
• Xfont.ru
• iFont.ru