Что это за шрифт? Идентифицируйте шрифты с помощью бесплатных онлайн-инструментов для определения шрифта
Выбор правильного шрифта очень важен для разработки веб-сайта. Иногда, просматривая веб-страницы, вы можете попасть на великолепно разработанный веб-сайт, и вы можете захотеть использовать тот же шрифт, или какой-то текст, написанный в рекламной кампании, может вас соблазнить. Но что, если вы не знаете, что это за шрифт? Как вы узнаете или опознаете шрифт? Вы отправите письмо веб-мастеру, чтобы узнать название используемого шрифта? Нет, тебе не нужно этого делать. Существуют определенные бесплатные онлайн-инструменты, которые могут помочь вам определить шрифт одним щелчком мыши. Вы можете определить шрифт, используя бесплатные онлайн-инструменты.
Определить шрифт
Существует множество шрифтов, и совсем не просто распознать шрифт, просто взглянув на него. Ниже приведены мои любимые онлайн-инструменты, которые я использую для идентификации шрифтов. Это на самом деле должны иметь инструменты для веб-дизайнеров. Проверьте их и решите, какой из них лучше для вашего использования.
1] WhatFontIs.com
WhatFontIs – это самый простой онлайн-инструмент для определения шрифта на определенной веб-странице. Он использует каталог 550K + шрифты (коммерческие или бесплатные) и AI поиска шрифтов, для каждого загруженного изображения. Этот инструмент также доступен в расширении Chrome и дополнении Firefox и дает мгновенные и точные результаты. Если вы не хотите устанавливать расширения, вы можете использовать онлайн-ресурс для определения ваших любимых шрифтов. Просто загрузите ваш образец и проверьте соответствующие шрифты. Убедитесь, что изображение четкое и имеет хороший контраст. Отредактируйте изображение, если на нем много фонового шума или низкий контраст. Проверьте WhatFontIs.com и найдите, какой шрифт лучше всего подходит для вашего сайта.
2] WhatTheFont
Это бесплатный онлайн-источник для поиска шрифтов с помощью изображений.
Вам просто нужно загрузить изображение со своего рабочего стола, отправив URL-адрес изображения, чтобы определить шрифт из списка возможных совпадений. Инструмент сопоставит ваш шрифт с огромной коллекцией шрифтов в своей базе данных и даст вам правильный ответ в течение нескольких минут. Для получения хороших и быстрых результатов убедитесь, что изображение, которое вы используете, четкое и содержит не более 50 символов. Идеальный размер рекомендуемой строки текста составляет примерно 160 x 1250 пикселей, а размер файла не должен превышать 2 МБ. Посетите myfonts.com/WhatTheFont и определите ваш любимый шрифт.3] IdentiFont.com
Identifont является одним из наиболее часто используемых инструментов для идентификации шрифтов в Интернете. Он задает несколько вопросов о шрифте, который вы хотите идентифицировать, и дает вам не очень точный ответ. Инструмент определяет шрифт на основе его формы и характеристик, а точность зависит от ответов, которые вы даете.
Это несколько бесплатных онлайн-инструментов, которые мы используем для идентификации шрифтов. Если мы пропустили ваш любимый, сообщите нам об этом в разделе комментариев ниже.
Зайдите сюда, если вы ищете несколько сайтов для загрузки бесплатных шрифтов, для логотипов и коммерческого использования.
💾 Блог: Что это за шрифт
Выбор правильного шрифта очень важен для проектирования веб-сайта. Иногда, просматривая веб-сайт, вы можете приземлиться на блестяще спроектированный веб-сайт, и вам может понадобиться использовать тот же шрифт, или какой-либо текст, написанный на рекламной кампании, может вас соблазнить.
Но что, если вы не знаете, что это за шрифт? Как вы узнаете или определите шрифт? Будете ли вы отправлять веб-мастеру имя шрифта? Нет, вам не нужно это делать. Существуют определенные бесплатные онлайн-инструменты, которые могут помочь вам в определении шрифта всего за один клик. Вы можете определить шрифт, используя бесплатные онлайн-инструменты.Определить шрифт
Есть множество шрифтов, и совсем не легко распознать шрифт с просто взглядом. Ниже приведены мои любимые онлайн-инструменты, которые я использую для определения шрифтов. На самом деле у них должны быть инструменты для веб-дизайнеров. Проверьте их и решите, какой из них лучше всего подходит для вашего использования.
WhatTheFont!
Это бесплатный онлайн-источник для поиска шрифтов с использованием изображений. Вам просто нужно загрузить изображение со своего рабочего стола, чтобы отправить URL-адрес изображения, чтобы определить шрифт из списка возможных совпадений. Инструмент будет соответствовать вашему шрифту с огромной коллекцией шрифтов в своей базе данных и даст вам правильный ответ в течение нескольких минут. Для получения хороших и быстрых результатов убедитесь, что используемое изображение четкое и имеет максимум 50 символов. Идеальный размер рекомендуется для одной строки текста примерно 160 x 1250 пикселей, а файл не должен превышать 2 МБ. Проверьте WhatTheFont здесь и узнайте свой любимый шрифт.
Identifont
Identifont является одним из наиболее часто используемых инструментов идентификации шрифтов в Интернете. Он задает несколько вопросов о шрифте, который вы хотите идентифицировать, и дает вам не столь точный ответ. Инструмент идентифицирует шрифт на основе его формы и характеристики, и точность зависит от ответов, которые вы даете. Этот инструмент IdentiFont лучше всего подходит для тех, у кого нет цифровой версии шрифта, который нужно идентифицировать.
WhatFontIs
Это самый простой онлайн-инструмент для определения шрифта на определенной веб-странице. Также он доступен в дополнение к Chrome и дополнению Firefox, этот инструмент дает вам мгновенные и точные результаты. Если вы не хотите устанавливать расширения, вы можете использовать онлайн-ресурс для идентификации ваших любимых шрифтов. Просто загрузите образец и проверьте соответствующие шрифты. Убедитесь, что изображение четкое и имеет хороший контраст. Отредактируйте изображение, если оно имеет много фонового шума или низкой контрастности. Проверьте WhatFontIs и найдите, какой шрифт лучше всего подходит для вашего сайта.
Это некоторые бесплатные онлайн-инструменты, которые мы используем для идентификации шрифтов. Если мы пропустили ваш любимый, дайте нам знать через раздел комментариев ниже.
Идите сюда, если вы ищете бесплатные сайты для загрузки шрифтов, логотипы и коммерческое использование.
Tweet
Share
Link
Plus
Send
Send
Pin
Шрифт — Онлайн-школа Bang Bang Education
Юрий Гордон, «Книги про буквы от АА до ЯЯ» — третье издание «Книги про буквы от АА до ЯЯ» Юрия Гордона, существенно дополненное, потому что кириллица живет и за шесть лет с момента выхода первого издания появилось множество шрифтов и новых шрифтовых дизайнеров. Попытка разобраться в специфике, анатомии и индивидуальных свойствах кириллических букв, а также понять, как дизайнер может работать с этой данностью. →
Владимир Фаворский, «О шрифте» — авторская классификация шрифтов, интерпретация ключевых понятий графического дизайна и типографики и теория создания шрифтовых композиций мастера гравированного акцидентного шрифта. →
Эрик Шпикерманн, «О шрифте» — учит разбираться в тонкостях типографики и призывает относиться к ней не как к искусству, а как к инструменту, к шрифту — как к интонации, с которой вы что-то сообщаете. →
Соломон Телингатер, «Искусство шрифта» — более 200 работ пионера «новой советской типографики», сподвижника Лисицкого, Родченко, Клуциса, часть из которых публикуется впервые. Это исследование эволюции шрифтовой графики мастера в контексте сменяющих друг друга идеологических парадигм 30—60-х. →
Paul Mcneil, «The visual history of type» — «Визуальная история шрифта» — это всесторонний, подробный обзор основных 320+ шрифтов, созданных с середины пятнадцатого века и до наших дней. →
Sebastian Carter, «20th century type designers» — переиздание книги 1987 года: анализ изменения технологий, связанных с проектированием шрифта, описание контекста и подходов самых влиятельных шрифтовых дизайнеров XX века. →
Jan Tholenaar, «Type: a visual history of typefaces and graphic styles» — двухтомное издание по визуальной истории шрифта, с детальным изучением различных стилей. Помимо этого, книга дает доступ к электронной библиотеке TASCHEN, которая содержит огромное количество сканов в высоком разрешении, доступных для скачивания. →
Ellen Lupton, «Thinking with type» — популярное пособие о роли шрифта в визуальной коммуникации, дополненное онлайн-ресурсом «Thinking with Type». Для всех, кто имеет дело с текстом. →
Ян Чихольд, «Образцы шрифтов» — скрупулезный анализ формы и устройства букв, примеры плохих и хороших шрифтов, рекомендации по подбору шрифта к различным задачам, шрифтовым композициям и типографике в городской среде. Содержит отретушированные ценные исторические иллюстрации. →
Владимир Кричевский, «Кое-что о шрифте в типографике» — о месте и роли шрифта в типографике, различии между проектировщиками шрифта и дизайнерами как пользователями готовых решений. Основано на «25 полемических суждениях не в пользу шрифтоцентризма». →
Какими функциями можно узнать местоположение шрифта. WhatTheFont — определяем шрифт по картинке. Апгрейд личных навыков распознавания шрифтов
Здесь мы собрали самые удобные сервисы и приложения для идентификации шрифтов. Сохраните эту статью себе в закладки и вы с легкостью сможете узнать название любого шрифта!
Дизайнеры часто сталкиваются с необходимостью узнать, каким шрифтом написан тот или иной текст. Перебор всей имеющейся коллекции шрифтов в поисках совпадения — далеко не самый удобный способ. Кроме того, нужного шрифта может просто не оказаться. Конечно, можно обратиться за помощью на тематические форумы, где другие дизайнеры смогут подсказать название шрифта. Только вот ждать ответа придется неделями. А если ждать некогда? Что же делать тогда?
На самом деле все просто. Воспользуйтесь этими ресурсами и вы сможете узнать название шрифта буквально за пару минут, а может даже быстрее!
Online-сервисы WhatTheFontWhatTheFont — объективно лучший сервис для идентификации шрифтов по картинкам. Просто загружаете картинку с примером шрифта, указываете, правильно ли сервис распознал буквы, и жмете на большую зеленую кнопку. Вам выдается несколько наиболее похожих по начертанию шрифтов, среди которых можно найти 100% совпадение. Если определить шрифт все-таки не удалось, то вам предложат задать вопрос на специализированном форуме на этом же сайте. Сервис удобен еще и тем, что найденный шрифт можно сразу же купить.
Для тех, кто ищет шрифты постоянно и в любых условиях, есть мобильное приложение для iPhone и Android. Можно просто сфотографировать шрифт и тут же узнать его название. Очень удобно!
IdentiFontНа этом сервисе можно искать шрифт, если у вас нет его изображения, но вы помните, как он выглядит, и сможете указать его характеристики, отвечая на ряд вопросов. Не сказать, что это самый удобный способ, но если другого варианта нет — вполне можно найти то, что нужно! Создатели сервиса предлагают разные варианты поиска шрифтов: по названию (частичному), по шрифтовым семьям, по символам и даже по дизайнерам, которые их разрабатывали.
WhatfontisWhat Font is — онлайн-сервис идентификации шрифта по картинкам. Во многом похож на WhatTheFont, но стоит добавить в закладки, на всякий случай.
Приложения и расширения для браузеровПомимо вышеперечисленных онлайн-сервисов, существуют их аналоги в виде расширений для браузеров. Их плюс в том, что не нужно каждый раз открывать новую вкладку, чтобы узнать каким шрифтом сделана та или иная надпись на сайте. Достаточно просто активировать расширение.
FontFaceNinjaБесспорный лидер на данный момент. FontFaceNinja дает возможность не только узнать название любого шрифта на сайте (не картинки), но и попробовать его написание здесь же на сайте, а также (внимание) скачать понравившийся шрифт! Конечно, авторы предупреждают, что шрифты скачиваются исключительно для ознакомления.
Помимо красоты и удобства этого расширения есть еще один приятный момент. В FontFaceNinja есть волшебная кнопка (маска), которая скрывает всю рекламу со страницы, позволяя наслаждаться исключительно шрифтами. Скачать расширение можно совершенно бесплатно. Работает с Chrome и Safari.
Расширение для Chrome и Safari, которое поможет узнать названия шрифтов в браузере. Показывает достаточно подробную справочную информацию по интересующему шрифту, включая шрифтовую семью, размер и высоту строки.
FountОтличный плагин для идентификации шрифтов на сайтах. Чтобы все заработало, сайт нужно добавить в закладки и нажать на него. Курсор примет форму крестика и при нажатии на шрифт будет появляться окошко с его названием, размером в пикселах, весом и стилем. Чтобы выключить — нажимаем еще раз. Работает с браузерами Safari, Chrome, Firefox, и IE8+.
Апгрейд личных навыков распознавания шрифтовКаждому хочется быть крутым дизайнером, который знает не только все существующие шрифты по названиям и семьям, но еще может перечислить разработчиков и рассказать истории создания. Конечно, такие навыки — это бесспорный талант. Но немного улучшить свои знания вполне реально. Вот несколько игр и инструментов, которые помогут вам в этом.
Font TrainerОнлайн-игра-тест: устанавливаете параметры и угадываете где какой шрифт. Можно установить как латиницу, так и кириллицу.
The Font Game HDЭто приложение в буквальном смысле играючи поможет выучить названия и начертания шрифтов. Есть разные режимы игры, интересные задания и статистика ваших достижений. Из минусов стоит отметить, что приложение платное и только в AppStore.
Простой и красивый тест, о котором мы отдельно писали в блоге. Сможете ли вы определить 10 самых популярных шрифтов? Испытайте себя. Результаты могут оказаться неожиданными!
Напишите нам, если вы знаете еще какие-то удобные сервисы или приложения для идентификации шрифтов. Будем рады вашим комментариям! И поделитесь ссылкой на эту статью с друзьями. Пусть их жизнь тоже станет чуточку проще 🙂
Случалась ли с вами такая ситуация: заприметишь красивый шрифт, и хочешь забрать к себе в коллекцию, а он оказывается на картинке, а не в печатном тексте? То есть и в исходном коде не посмотреть, что за начертание использовано для оформления, и на глаз не определить. Казалось бы, выхода нет. На самом деле в интернете есть масса сервисов, способных определить шрифт по картинке онлайн. Мы расскажем вам о двух.
Давайте попробуем на двух самых известных площадках определить шрифт с этой картинки:
WhatFontIs
Этот бесплатный ресурс полностью на английском языке. Так что база латинских шрифтов там довольно широкая. А вот с русскими – напряжёнка. Для тех, кто не знает английского, мы подготовили небольшую инструкцию по использованию сервиса.
Итак, чтобы воспользоваться WhatFontIs с целью найти шрифт по картинке, сохраните изображение с понравившимся начертанием или сделайте скриншот страницы и вырежьте нужный фрагмент. Проследите, чтобы картинка была в формате jpg, png или gif и не превышала 1,8 мб. Теперь следуйте инструкции.
Совет: вместо того, чтобы загружать картинку, в нижнем поле можно вставить ссылку на неё.
Если сервис не смог определить шрифт, не отчаивайтесь. Разместите картинку на форуме сайта, где местные гуру обязательно помогут вам разобраться.
WhatTheFont
Ещё один англоязычный сервис для определения шрифта по картинке. Пытаться отыскать здесь кириллические начертания – трата времени. В базе WhatTheFont их попросту нет.
Мобильное приложение WhatTheFont
Мало кто знает, но у сервиса WhatTheFont есть приложение для определения шрифта по картинке на гаджетах от Apple. Это удобно, когда вам попалось на глаза, к примеру, объявление в газете, оформленное красивым шрифтом, или впечатлила вывеска на улице. Просто сфотографируйте текст, и приложение выполнит свою задачу.
В действительности способов, которые помогут определить шрифт онлайн, больше, чем два. Например, есть сервисы, которые вместо того, чтобы распознать шрифт по картинке, зададут вам тысячу и один вопрос о том, как выглядит искомое начертание (http://www.identifont.com/). Существуют и ресурсы, которые даже могут натренировать ваш глазомер так, что вы не хуже машины сможете распознавать множество шрифтов (http://ft.vremenno.net/en/). Однако WhatTheFont и WhatFontIs – пожалуй, самые удобные и популярные площадки для этой цели.
Что делать, если вам понравился шрифт, но вы не знаете его название? Все очень просто, если под рукой есть его графическое начертание. Существует большое количество online-сервисов, которые делают поиск шрифта по картинке , и надо признать, достаточно неплохо.
В этой статье мы рассмотрим некоторые из них, и постараемся быстро найти неизвестный шрифт, имея под рукой лишь его начертание.
Самым известным и популярным сервисом, среди прочих, является What The Font .
Он очень прост в использовании и выдает весьма неплохие результаты. Ко всему прочему, в его базе содержится огромное количество, как бесплатных, так и платных шрифтов. Поэтому, если вам не удалось найти нужный, попробуйте подобрать нечто похожее из шрифтовой базы сайта.
Вот пошаговая инструкция по работе с сервисом:
1. Загружаем изображение с начертанием нашего шрифта:
Картинка должна быть хорошего качества и не слишком маленького размера. Фоновые шумы и недостаточный контраст резко сказываются на качестве поиска. Потрудитесь доработать картинку в Photoshop, чтобы получить хороший результат.
Лучше, чтобы буквы были темными, а фон светлым. Как показала практика использования What The Font, размер изображения значительно влияет на результат поиска. Если картинка слишком мала, результатов будет больше. Но по мере увеличения изображения, их количество сокращается до минимума.
2. Загрузив картинку, убедитесь, что сервис правильно определил количество глифов. Глиф — это графический образ знака. Один знак не всегда соответствует одному глифу. Например, буква «а» в любом написании остается одной буквой и одним знаком. Но капительная «а» и строчная «а» — два разных глифа.
В то же время, один глиф может соответствовать нескольким знакам. К примеру, «ffi» — один глиф, но три знака. То есть в словах, где есть сочетание «ffi» глифов будет меньше, чем знаков.
3. После всех манипуляций, вы получите результат поиска.
В моем не сложном примере, шрифт был подобран правильно. К сожалению, так бывает не всегда.
Если What The Font не дал результата, а вам лень, можно попробовать прогнать картинку по другим похожим сервисам. Давайте рассмотрим некоторые из них.
Сайты и сервисы по поиску шрифтов
Этот сервис для поиска шрифта задает вам ряд вопросов на английском языке. Вы выбираете предположительно-правильные ответы. После чего, Identifont предложит вам нужный (не всегда) шрифт.
Этот ресурс может быть полезен, если у Вас нет изображения шрифта на цифровом носителе. Сервис довольно специфический в использовании и найти с его помощью шрифт не просто. Хотя производитель утверждает, что это крупнейший бесплатный ресурс для поиска нужного шрифта.
Крупнейшее сообщество специалистов во всех творческих областях, включая шрифтовиков. Здесь нет автоматизированного поиска, найти шрифт можно загрузив картинку на форум. В большинстве случаев — это самый простой и эффективный способ.
Сообщество на популярном сайте Flickr, в котором вы можете найти названия шрифтов, используемых в различных изображениях, логотипах, надписях. Здесь можно быстро получить справку по шрифтам и найти необходимый шрифт по его изображению. Единственное, вам придется писать на английском (google translate в помощь).
В заключении
Каждый из приведенных выше сервисов эффективен по своему. Комбинируя их, найти нужный шрифт получается довольно быстро. Я очень часто пользуюсь What The Font + Demiart. В 90% случаев мне удается найти нужный шрифт в течении 20 минут.
Достаточно часто на всевозможных сервисах вопросов и ответов люди задают один и тот же вопрос: «Как определить шрифт по картинке ».
Тем, кто не связан по роду деятельности с графикой либо вебдизайном, сложно понять, зачем это необходимо)) Те, кто «в теме» хорошо знают, как сложно определить тип шрифта на какой-либо картинке либо логотипе и подобрать его так, чтобы текст смотрелся почти как на оригинале.
Ранее я уже писал про онлайн сервис, который позволяет под какие-то нужды, но этот инструмент бессилен, когда требуется идентифицировать тип шрифта по конкретному примеру. Поэтому спешу представить Вам инструмент, который может помочь в таких случаях.
WhatTheFont – бесплатный онлайн сервис, который поможет определить шрифт по картинке. Для того, чтобы результат определения был максимально точным, желательно соблюсти следующие условия:
- буквы не должны сливаться другом, иметь четкие контуры
- буквы должны быть выровнены по горизонтальной линии
- желательно, чтобы высота букв была около 100px
Чтобы определить шрифт по картинке, необходимо загрузить эту самую картинку на сервис либо указать её адрес в интернет. Оба эти действия производятся на главной странице WhatTheFont.
В качестве примера давайте определим шрифт в логотипе моего сайта MuzRelax.ru. Я то знаю, какой шрифт там использован, а вот посмотрим сможет ли сервис WhatTheFont корректно его идентифицировать.
Кстати, тем, кто еще не посещал этот сайт, крайне рекомендую сделать это – получите настоящее удовольствие).
Я сделал скриншот лого и загрузил картинку в таком виде:
Как видите, фон шрифта даже не контрастный, хотя это тоже желательно условие (черное на белом либо белое на черном).
На следующей странице сервис автоматически разобьет всю надпись на картинке на отдельные буквы и попытается их определить. Литеры, которые не определились, либо идентифицированы не верно, Вы можете вписать сами в маленьких окошках. В моем примере всё определилось верно в автоматическом режиме.
На финальном этапе сервис выдаст список шрифтов, которые выглядит схоже с тем шрифтом, который есть на картинке. В моем случае было предложено 4 варианта, самый первый из которых (Georgia) и есть тот тип шрифта, который я использовал в логотипе сайта MuzRelax.ru. Отличный результат!
К сожалению, WhatTheFont имеет несколько недостатков:
- Хотя база данных сервиса содержит огромное количество шрифтов, некоторые экзотические он определить не в состоянии
- Кириллические шрифты сервис не определяет. Однако этот недостаток достаточно условный, потому что в интернет нет ни одного сервиса определения шрифта по картинке, который бы работал с кириллическими шрифтами. К сожалению…
WhatTheFont является лидером среди себе подобных онлайн сервисов, имеет хорошее сообщество, куда можно обратиться за помощью при определении шрифта, полностью бесплатный и работает очень шустро. Рекомендую однозначно!
P.S. Не забудьте оставьте эту статью у себя в закладках и порекомендовать своим друзьям).
Я уверен, что у любого дизайнера был такой момент, когда он видел где-то какой-то шрифт, который так мог бы пригодится в проекте, но… что за шрифт?.. Ответ на этот вопрос затаился в глубине Вашего сознания, либо в глубине Вашего «незнания» (что разумеется простительно).
В этой статье мы рассмотрим несколько ресурсов, которые могут помочь вам в идентификации понравившегося шрифта.
Конечно, нельзя рассчитывать, что эти источники дадут вам 100 процентную уверенность в том что вы найдете нужный шрифт, но что помогут, так это точно.
Graphic Design Blog полезный ресурс, но может помочь лишь в том случае, если вы знаете имя дизайнера или студию, создавшего шрифт. Список студий и дизайнеров весьма обширный и поиск шрифта в разы упрощается. Но, что делать, если вы видите шрифт в первый раз?
Шаг 2: После загрузки картинки, проверьте, что What The Font правильно определил глифы, и лишь после этого жмите «поиск».
Вкратце, ГЛИФ — это графический образ знака. Один знак может соответствовать нескольким глифам; строчная «а», капительная «а» и альтернативный вариант строчной «а» с росчерком являются одним и тем же знаком, но в то же время это три разных глифа (графемы).
С другой стороны, один глиф также может соответствовать комбинации нескольких знаков, например лигатура «ffi», являясь единой графемой, соответствует последовательности трех знаков: f, f и i. Т.о. для программы проверки орфографии слово suffix будет состоять из 6 знаков, а графический процессор выдаст на экран 4 глифа.
Сначала я загрузил эту картинку:
Отличное сообщество, огромное количество ресурсов, блогов, новостей связных с типографской культурой. Есть даже typography Wiki.
Как определить, какой шрифт установлен на сайте
Предположим, вам понравился конкретный шрифт, но вы не знаете, как его идентифицировать. На самом деле, методик для определения шрифтов предостаточно.
Наиболее простая – взгляните на исходный код той страницы, которая «приглянулась». Безусловно, для нахождения нужного кода среди множества других, нужно хоть немного разбираться в HTML-кодах.
Предлагаю воспользоваться редактором текстов Microsoft Word пакета Office. Для этого сохраните конкретную веб-страницу, чтобы открыть ее потом в редакторе. Шрифт определится таким, каким он есть в оригинале.
Еще проще воспользоваться сервисом Whatfont. Для этого перетащите кнопку в закладки вашего браузера. Щелкните на вкладке того шрифта, который интересен, предварительно наведя курсор на нем. По каждому шрифту предусмотрена подсказка в виде краткой информации (при вызове контекстного меню можно получить более развернутую информацию).
В арсенале помощников имеются плагины под различные браузеры, определяющие шрифт на открытых интернет-страницах. Для браузера Google Chrome – это плагин Csscan, а под Mozilla FireFox – Firebug. Все, что нужно, так это скачать необходимый плагин для своего браузера.
Что делать, если нельзя запросто определить шрифт, например, с картинки? Выдернуть его оттуда весьма затруднительно, но можно. Существуют сервисы, позволяющие определять шрифты на логотипах и картинках. Например, такой сервис, как WhatTheFont дает возможность загружать изображения со шрифтом, а в результате обработки будет выведен шрифт, наиболее похожий на исходный с картинки. Точнее, – целый перечень шрифтов на выбор.
Кстати, подборку шрифтов могут обеспечить сайты Identifont, ITC Fonts и Fonts.com. Это целая система целенаправленного подбора шрифтов онлайн, Единственный минус таких ресурсов состоит в том, что они англоязычные. Однако, если поднапрячься, то можно разобраться во всем.
Приступим к утилитам (десктопному софту)… FontMatch является настольным приложением с функцией загрузки изображений и может выдавать наиболее подходящий шрифт, а в случае отсутствия требуемого, выводит любой другой. Постоянная работа с этой программой потребует от вас большой подборки шрифтов.
И, наконец, программка Kleptomania предоставляет возможность копирования текста из окна, которое, по умолчанию, не поддерживает этой функции. В качестве бонуса софта появляется возможность установления шрифта, которым написан текст. Главными достоинствами подобной программы считается скорость работы и отсутствие оплаты.
Вышеперечисленные основные способы позволяют идентифицировать практически любой шрифт на веб-сайте.
Как выбрать шрифт для медиа
DrumВ медиа чаще всего используются гарнитуры антиква и гротеск.
Андрей Абрамов, арт-директор дизайн-студии AIC:
Выбор самой гарнитуры — вопрос вкуса и стиля медиа. Здесь стоит ориентироваться на ощущения. Я рекомендовал бы почитать историю понравившегося шрифта — как и для каких целей автор создал его. Как минимум, это поможет избежать казусов при общем взгляде на проект.
Шрифты различаются по нескольким параметрам:
• кегль — размер шрифта;
• начертание — прямой, курсивный, перечеркнутый;
• насыщенность — тонкий, жирный, полужирный;
• ширина — нормальный, узкий, широкий;
• четкость — четкий, размытый;
• контраст.
Перед тем, как выбрать шрифт, выясните, платный он или бесплатный. Если шрифт платный, нужно понять, какой у него тип лицензии. Это можно сделать на сайте myfonts.com.
Также существуют условно-бесплатные шрифты. Их можно использовать при соблюдении условий, выдвинутых правообладателем. Например, в некоммерческих целях.
Дмитрий Осадчук, креативный директор Mail.Ru Group:
Шрифт — объект авторского права. Покупая или загружая шрифт, вы приобретаете лицензию — право использовать данный шрифт. Шрифтовые компании следят за использованием своих работ и, за использование шрифтов без лицензии могут подать в суд и взыскать огромные штрафы.
Отличная новость — хороших бесплатных шрифтов (в том числе и кириллических) становится все больше и больше. Но лицензионное соглашение на них также стоит читать внимательно (например paratype.ru/help/license/ptfree.asp )
Бесплатные шрифты имеют лицензию, позволяющую использовать их в коммерческих и личных целях. Такие можно найти в библиотеке Google Fonts или на Behance в разделе Typography по запросу free.
Есть два основных вида лицензий на шрифты:
Настольная лицензия — вы скачиваете установочный файл шрифта и используете его в графических редакторах и для печати.
Веб-лицензия — для использования шрифта на сайте. Она делится на три вида:
• с оплатой за просмотры;
• с подпиской на определенный срок;
• с подпиской на тариф: внутри тарифа могут стоять ограничения по количеству просмотров или времени использования.
Инструмент, который отвечает на вопрос «Что это за шрифт?»
Интернет — от самого ядра до самых удаленных периферийных частей — это огромная вселенная текста.
Мне напомнили об этом факте сегодня утром, когда я читал стенограмму разговора между моим редактором Алексисом и соучредителем Pinterest Эваном Шарпом.
«Так устроен Интернет», — сказал Шарп. «HTML — это архитектура Интернета, и он предназначен для представления текста. Это Hyper Text Markup Langauge… это то, что делает код в Интернете. Он размечает текст ».
Helvetica настолько популярен, как предполагают некоторые графические дизайнеры, потому что он представляет собой кульминацию давно развивающейся линии дизайнерских рассуждений.Помните: это от основателя Pinterest, в высшей степени визуального сайта. И так для всех GIF-файлов, видео и фотографий, которые неразрывно связаны с культурой Интернета, опыт пребывания в сети — как мы перемещаемся из одного места в другое, что мы делаем, когда мы там, — во многом определяется текстовыми конструкции.Текст незримо закодирован в нашем взаимодействии с веб-сайтами, и, помимо этого, он повсюду на виду. Но даже текст, который мы видим, слова, которые вы сейчас читаете, обычно скрыты смыслом. В большинстве случаев контекст важнее эстетики. Например, возможно, вы не зациклились на том, что эти буквы, которые вы сканируете, набраны шрифтом Georgia на 16 пунктов. (Да, если вы используете обычный старый ноутбук или настольный компьютер.) Или заголовок в верхней части этой статьи выделен жирным шрифтом Джорджии, 34 балла.
Отчасти поэтому так увлекательно иметь возможность навести курсор мыши и идентифицировать любой шрифт, который вы видите в Интернете. Это позволяет плагин для браузера FontFace Ninja. Есть даже кнопка, которая позволяет скрыть все на странице, кроме текста. Так что вы можете насладиться знакомыми изгибами жирных заголовков The New York Times в Cheltenham. Или полюбуйтесь сочетанием шрифтов без засечек на веб-сайте American Apparel — Helvetica Neue, Verdana, Arial bold. Или сравните использование Helvetica Neue и Gotham Narrow в Twitter.
(Одно ограничение: FontFace Ninja работает только с текстом, поэтому изображение текста — например, логотип — не зарегистрирует ответ. В таких случаях такие сайты, как WhatTheFont, будут принимать снимки экрана и определять за вас загадочные рисунки.)
Сегодня я узнал, что короткие заголовки без засечек Vox выделяются жирным шрифтом Balto. (Здесь также используется шрифт с засечками под названием Harriet.) Вот пример Balto с веб-сайта Vox:
Снимок экрана VoxThe Verge использует в заголовках как Adelle Regular, так и какой-то сумасшедший шрифт с заглавными буквами под названием FF DIN Web.Mashable идет с Museo Slab Regular, который напоминает мне дальнего родственника Courier New. Перейдите на домашнюю страницу The Atlantic , и вы найдете смесь: полужирный шрифт Times New Roman, Helvetica Neue и Arial. (А еще есть логотип The Atlantic , который, по сути, мы немного изменили в прошлом году. Это собственный шрифт, основанный на сокращенном курсиве Bauer Bodoni.) Еще одна интересная особенность FontFace Ninja заключается в том, что он не только сообщает вам, какой шрифт вы видите, но позволяет вам проверить все, с чем вы сталкиваетесь.Активируйте плагин, наведите курсор на интересующий вас шрифт и щелкните: В верхней части окна браузера есть область, где вы можете вводить все, что хотите, в том же стиле.
Это забавный инструмент, потому что он раскрывает некоторые нюансы шрифта, которые обычно не выделяются. Используя FontFace Ninja для ввода моего имени в Proxima Nova Semibold от BuzzFeed, я мог оценить, насколько резко заканчивается дуга строчной буквы «r» по сравнению с более выпуклым полужирным шрифтом Georgia, который мы используем для заголовков статей по адресу The Атлантический.
И обратите внимание, как строчная буква «r» NPR отличается в шрифте, который она использует для заголовков (жирный шрифт Gotham SSm), по сравнению с символическим логотипом сети (полужирный Trebuchet).
(О, и чего бы это ни стоило, FontFace Ninja использует полужирный шрифт Brandon Grotesque в стиле Futura на своем собственном сайте.)
Когда вы начинаете думать о том, как выглядят слова, и как форма каждого из них влияет на то, как вы чувствовать то, что ты читаешь, трудно остановиться. Сделайте паузу на минуту и осмотритесь. Буквы везде , что означает, что мы почти все время окружены типографским выбором.
«Я бы сказал, что всех нас побуждают подсознательно», — говорит британский писатель-дизайнер Рик Пойнор в документальном фильме 2007 года « Helvetica ». Некоторые графические дизайнеры предполагают, что Helvetica настолько популярна, потому что представляет собой кульминацию давно развивающейся линии дизайнерских рассуждений.
«Может быть, чувство, которое вы испытываете, когда видите определенные типографские варианты, используемые на части упаковки, — это просто:« Мне нравится, как это выглядит. Это приятно. Это мой продукт », — сказал Пойнор.«Но это тот тип, который накладывает свое секретное заклинание».
И в этом вся суть дизайна. Мы не всегда видим это, даже когда смотрим прямо на него.
Какие шрифты и размеры электронных книг следует использовать для моих электронных книг? BookBaby Blog
Обновлено в июне 2017 года.
Когда дело доходит до шрифтов для электронных книг, лучше всего придерживаться стандартных шрифтов и позволить читателям выбирать размер и стиль, которые им больше всего нравятся.
Независимо от шрифта, который вы выберете для рукописи электронной книги, после преобразования файла в формат ePUB ЗАКАЗЧИК решит, какой шрифт он хочет использовать для чтения вашей книги. Этот факт иногда расстраивает книжных дизайнеров / наборщиков, но он полезен для конечного пользователя — и вас!
Чтобы обеспечить максимальную читаемость (на нескольких устройствах, размерах экрана и т. Д.), Вам нужно удалить в рукописи все, что могло бы излишне усложнить процесс преобразования электронных книг. Что касается шрифтов для электронных книг, мы рекомендуем использовать в книге только ОДИН шрифт, и это должен быть стандартный шрифт: Arial, Times New Roman или Courier.
Необычные шрифты (особенно необычные шрифты с засечками) могут выглядеть великолепно, но часто они преобразуются в странные символы и символы.Ваша электронная книга может выглядеть как испорченный беспорядок. Если вы сноб шрифтов, посмотрите на это так: , придерживаясь безопасного, скучного шрифта, вы ничего не потеряете при переводе или преобразовании. Вы не хотите рисковать самим языком ради типографики.
Если вы хотите включить другие элементы, например полужирный, , курсив, или с подчеркиванием , используйте меню форматирования шрифтов или кнопки на панели инструментов. Если вам нужно использовать символы, которых нет на клавиатуре, обязательно выберите их из меню с тем же именем, что и ваш шрифт, а не крылья, символы или специальные символы.
Как и сам шрифт, размер шрифта может быть изменен читателем. Процесс преобразования пройдет гладко, если вы избегаете шрифтов очень большого или очень маленького размера. Мы рекомендуем размер шрифта 12 пунктов для основного текста и 14-18 пунктов для заголовков глав .
В мире, где текст может быть обнаружен, доступен и настроен в соответствии с предпочтениями читателя на нескольких устройствах (компьютеры, телефоны, электронные книги, планшеты и т. Д.), Максимальная удобочитаемость приносит пользу как автору, так и потребителю.
Надеюсь, эти советы по шрифтам помогут вам избежать любых конверсионных гремлинов на этом пути.
Позвольте BookBaby помочь вам с преобразованием электронных книг, чтобы вы могли беспокоиться о важных вещах (например, о написании и продвижении)!
Похожие сообщения
Что такое электронная книга?
Сейчас самое время для самостоятельной публикации.
Семь основных, но важных вопросов об электронных книгах
Что такое электронная книга?
Создание печатной книги? Вот три решения, которые вам нужно принять.
Типографские шрифты Плюсы и минусы и бесплатные онлайн-ресурсы по шрифтам
С самого начала появления Интернета типографические шрифты, используемые в Интернете, и способы их использования сильно изменились. Интересно, почему веб-сайт 90-х годов выглядит… ну, он был создан в 90-х? Часто это выбор типографики на сайте. Ранние веб-шрифты, которые использовались слишком часто или были неэффективными, часто придали дизайну веб-сайта устаревший вид. Когда определенный шрифт становится популярным на короткое время и все начинают его использовать, а затем он вымирает, часто легко определить, когда сайт был создан.
Плюсы новой эры шрифтов: красивый внешний вид, новые стили и многое другое
Эволюция типографских шрифтов для онлайн-читателей — это часть решающей эволюции Интернета. Сайты быстро перешли от простого размещения брошюры с 4 страницами информации к сайтам, на которых размещались десятки тысяч страниц содержания, которое необходимо было упорядочить и прочитать. Веб-дизайнеры и производители онлайн-контента быстро поняли, что онлайн-контент часто сканируется больше, чем читается слово за словом, и что для облегчения усвоения онлайн-чтения требуются мультимедийные элементы, связывающие визуальные эффекты с письменными идеями.
Ранние распространенные веб-шрифты для информационных сайтов «web 2.0», таких как Times New Roman, Courier New и Comic Sans, часто сопровождались отвратительными цветовыми схемами и не создавали правильного настроения для их содержания. Как и в случае с печатью, веб-дизайнеры вскоре поняли, что подойдет не любой шрифт: их клиентам нужно, чтобы их контент имел авторитет и соответствовал их профессиональному тону.
Сегодняшний веб-дизайн предлагает бесконечный выбор шрифтов для логотипов, веб-графики и гораздо более открытую арену для разработки копий сайта с новыми достижениями в стилизации страниц CSS.Ранний беспорядок в Интернете был заменен более чистыми и удобными для чтения шрифтами и настраиваемым текстом для мобильных и планшетных устройств в рамках адаптивного дизайна. Другими словами, веб-текст стал не только более стильным, но и интеллектуальным, способным определять, что кто-то использует для его чтения, и автоматически корректировать.
Движение в веб-дизайне, заключающееся в беспорядочном открытии сайтов для клиентов, чтобы они просто «были в сети» в первые годы существования Интернета, часто не приносило предприятиям такого большого успеха, как они надеялись.Вскоре стало очевидно, что отличный дизайн и контент должны сопровождать функциональный код в профессиональном дизайне веб-сайтов.
Минусы развивающейся типографики: преувеличенные тенденции, скорость загрузки страницы
В современном веб-дизайне существует досадное движение, которое ставит стиль выше, а иногда и в ущерб практичности и функциональности. Сторонники говорят, что до тех пор, пока дизайн модный и современный, люди будут приходить, и сайт будет успешным. Но сам дизайн — это эффективное визуальное и письменное общение, поэтому, когда очень необходимый информационный контент и возможности чтения исключаются, чтобы использовать новый крутой шрифт, который используют все другие веб-дизайнеры, это часто больше вредит, чем помогает.Не говоря уже о том, что через 2 месяца ваш сайт не будет выглядеть таким свежим, потому что шрифт забит до смерти во всем Интернете дизайнерами, стремящимися следовать тенденции.
Лучший выбор дизайна и веб-типов соответствует бизнес-целям веб-сайта, типу представляемой информации и индивидуальности бренда. Сами шрифты обладают сильным характером, поэтому важно, чтобы выбор типографики соответствовал индивидуальным особенностям клиента и отрасли на профессиональном уровне, а не просто следовал крутым новым тенденциям в области шрифтов.Опытные дизайнеры являются экспертами в подборе внешнего вида различных шрифтов для брендов, независимо от тенденций на других сайтах.
Еще одно негативное движение, против которого пытаются бороться дизайнеры UX, — это выбор «причудливых» шрифтов, которые не являются широко совместимыми (при использовании в качестве форматированного текста) между браузерами и операционными системами. Важным моментом в современном веб-дизайне и адаптивном дизайне является то, что ваш шрифт должен быть читаемым на экранах разного размера, масштабируемым для устройств, включая мобильные, планшеты, и широко доступным на ПК, Mac и системах Linux.
Советы по выбору шрифтов в Интернете
При выборе из десятков тысяч шрифтов бывает сложно найти нужный или знать, где искать.
Поиск шрифтов: Если у вас ограниченный бюджет, существует множество сайтов с бесплатными шрифтами (например, dafont.com), но обратите внимание, что не все шрифты являются бесплатными для использования в каждом контексте и могут иметь ограничения для коммерческого использования. Ищите такие слова, как «бесплатно» или «бесплатное ПО» в правах на использование. Их использование более снисходительно для таких групп, как студенты, которые загружают шрифты для своих личных проектов, чем для использования в коммерческих целях.
Существует много серий высококачественных шрифтов, которые предназначены для пожертвований или с оплатой по принципу «плати сколько хочешь», например «Потерянный шрифт». Достаточно немного покопаться!
Если вы занимаетесь сложным проектом по брендингу и у вас есть очень конкретная потребность, платные шрифты могут быть лучшим вариантом для получения более уникального и качественного внешнего вида.
To Serif or Not to Serif: Отличия, такие как шрифты с засечками и без засечек, могут сбивать с толку новых веб-дизайнеров. Засечки обычно легче читать на более длинных страницах, потому что штрихи букв (засечки — это маленькие концевые штрихи на буквах) лучше отличаются друг от друга, но шрифты без засечек, которые имеют более округлый вид (нет знаков с засечками ) популярны в более чистом дизайне и современных логотипах.
Изображения и форматированный текст: Шрифты на изображениях встроены в изображение и могут быть видны на любом устройстве, которое может загружать изображение, что дает веб-дизайнерам гораздо больше свободы творчества. Дизайнеры по-прежнему должны учитывать время загрузки изображений, удобочитаемость шрифта и то, что текст в файлах изображений не читается поисковыми системами так же хорошо, как текст страницы (часто требуется использование HTML-тега «alt», чтобы объяснить, что такое изображение. говоря). Шрифты для простой копии на веб-страницах должны быть доступны для массовой аудитории, которая, вероятно, не использует ту же операционную систему или устройство.Планируйте заранее, используя шрифты форматированного текста / копии страниц, и обратите внимание, что один и тот же шрифт может не отображаться во всех операционных системах или браузерах.
Для адаптивного дизайна и дизайна электронной почты: Изменение размеров заголовков, размера шрифта и объема контента для мобильных устройств может стать прекрасным методом повышения эффективности рассылки сообщений электронной почты и адаптивных страниц. Как правило, читать мелкий текст на смартфонах намного сложнее. Новая тенденция в адаптивном дизайне электронной почты — сделать текст немного больше и использовать более крупные сенсорные элементы для ссылок.
Type Zebra — Тестер шрифтов
Введите Zebra — проверьте свои шрифты в веб-браузере. Вы можете редактировать этот текст.Или вы можете изменить режим из меню выбора вверху.
Введите разные шрифты и посмотрите, как они будут выглядеть автоматически. Попробуйте и сравните их визуально, прежде чем использовать в своих логотипах и дизайне, ориентированном на типографику.
Алиса открыла дверь и обнаружила, что она ведет в небольшой коридор, не намного больше крысиной норы: она опустилась на колени и посмотрела вдоль прохода в самый красивый сад, который вы когда-либо видели.Как ей хотелось выбраться из темного холла и побродить среди грядок с яркими цветами и этих прохладных фонтанов, но она не могла даже просунуть голову в дверной проем; «И даже если бы моя голова прошла, — подумала бедная Алиса, — без моих плеч было бы очень мало толку».
Через некоторое время она услышала легкий топот ног. Вдалеке, и она поспешно вытерла глаза, чтобы увидеть, что приближается. Это был Белый Кролик, возвращающийся, великолепно одетый, с парой белых детских перчаток в одной руке и большим веером в другой; он мчался в большой спешке, бормоча себе под нос: «О! Герцогиня, герцогиня! О! Разве она не будет жестокой, если я заставлю ее ждать! »
«Начни с начала, — очень серьезно сказал Король, — и продолжай, пока не дойдешь до конца; затем остановись.»
Очень скоро Кролик заметил Алису, которая шла на охоту, и крикнул ей сердитым тоном: «Почему, Мэри Энн, что ты здесь делаешь? Беги домой сейчас же и принеси мне пару перчаток. и фанат! Быстро, сейчас же! » И Алиса была так напугана, что сразу же побежала в указанном направлении, не пытаясь объяснить ошибку, которую она совершила.
«Я знаю , что обязательно произойдет что-то интересное, — сказала она себе, — когда я что-нибудь ем или выпью: так что я просто посмотрю, что делает эта бутылка.Я очень надеюсь, что это заставит меня снова вырасти, потому что я действительно устал быть таким крошечным существом! «
« Раньше ты был намного больше …» намного больше «. Ты потерял свою индивидуальность. »
«Выпей еще чаю», — очень серьезно сказал Мартовский Заяц Алисе. «У меня еще ничего не было», — ответила Алиса обиженным тоном, — «так что я не могу больше». «Вы имеете в виду, что вы не можете взять меньше, — сказал Шляпник, — очень легко взять больше, чем ничего». «Никто не спрашивал вашего мнения, — сказала Алиса. —
Отрывки из книги Льюиса Кэрролла «Алиса в стране чудес» .
Использовать пользовательские шрифты — Таблица
Tableau предоставляет вам множество шрифтов для использования в ваших визуализациях, включая шрифты в его гарнитуре по умолчанию: Tableau. Однако вы можете использовать шрифт, отличный от предоставленного. Например, вы можете захотеть использовать шрифт, уникальный для бренда вашей компании.
Чтобы использовать настраиваемый шрифт в Tableau, первым делом необходимо установить его на компьютеры, на которых работает Tableau. Это включает в себя Tableau Desktop и, если вы публикуете на Tableau Server, любые компьютеры, на которых работает Tableau Server.
Если шрифт, указанный в Tableau Desktop, также не установлен на всех узлах Tableau Server, Tableau Server заменяет шрифт по умолчанию.
Чтобы убедиться, что Tableau Server может правильно отображать шрифт, убедитесь, что шрифт находится в списке шрифтов, установленных в большинстве браузеров. Эти обычно устанавливаемые шрифты называются «веб-безопасными» шрифтами, как подробно описано здесь.
Примечание. Если вы загружаете книгу с Tableau Server, пользовательские шрифты не загружаются вместе с книгой.
Для получения дополнительной информации об установке шрифтов перейдите по следующим ссылкам:
После установки шрифта он появляется на панели форматирования в Tableau Desktop, где вы можете использовать его для изменения шрифтов на уровне книги или рабочего листа. Подробности см. В разделах «Форматирование на уровне книги», «Форматирование на уровне рабочего листа» и «Форматирование текста и чисел».
Публикация пользовательских шрифтов
Правильная публикация книги с настраиваемым шрифтом зависит от знания того, как взаимодействуют автор и опубликованная книга.
Рабочий процесс публикации пользовательского шрифта
|
A- Книга создается в Tableau Desktop. | В книге можно использовать любой шрифт, установленный на вашем компьютере. |
B- Книга создана с использованием веб-разработки. | При форматировании текста работают только шрифты, установленные на Tableau Server или Tableau Online. |
C- Книга опубликована на сервере Tableau. | Любой пользовательский шрифт должен быть установлен на всех узлах сервера. Если шрифт не установлен на сервере Tableau, удаленный шрифт будет заменен замещающим шрифтом при публикации. |
D — Учебное пособие опубликовано в Tableau Online. | Будут отображаться только шрифты, поддерживаемые Tableau Online. Любые неподдерживаемые шрифты в книге будут заменены замещающим шрифтом при публикации. Список поддерживаемых шрифтов см. В базе знаний: шрифты не отображаются должным образом (ссылка открывается в новом окне). |
Устранение неполадок пользовательских шрифтов в опубликованных книгах
После публикации любому пользователю, просматривающему опубликованную книгу, потребуется установить на своем компьютере пользовательские шрифты.Вот почему рекомендуется ограничивать шрифты либо шрифтами Tableau, либо веб-безопасными шрифтами.
Некоторые шрифты отображаются правильно, а другие — нет. | Если в представлении много меток, сервер отобразит метки на стороне сервера и отобразит метки как статическое изображение. Это может привести к тому, что некоторые шрифты в представлении будут несовместимы с остальной частью представления.Чтобы решить эту проблему, уменьшите количество отметок на просмотр. |
Интервал шрифта отличается для разных зрителей. | Если на компьютере программы просмотра установлен пользовательский шрифт, она будет точно отображать шрифт. Однако в каждом браузере используется несколько иной метод рендеринга шрифтов, поэтому можно ожидать небольших различий в шрифтах между браузерами. |
Для зрителей отображается другой шрифт. | Если у средства просмотра не установлен пользовательский шрифт на своем компьютере, любые неустановленные шрифты в книге будут заменены замещающим шрифтом, выбранным браузером. |
Пары шрифтов для электронной коммерции, которые хорошо смотрятся вместе
Нельзя отрицать: как и люди, одни шрифты работают вместе лучше, чем другие.Но как решить, какие сочетания шрифтов способствуют повышению конверсии, а какие заставляют зрителя хотеть большего?
Поиск наилучшего сочетания шрифтов для электронной коммерции — не точная наука, но дизайнеры любят следовать общему правилу: противоположности притягиваются. Два шрифта должны иметь достаточный визуальный контраст, чтобы хорошо сочетаться друг с другом. Используя такие атрибуты, как цвет, размер, вес и классификация, вы можете создать пару противоположностей, которые добавят интригу и текстуру вашему дизайну. Хотя не все дополнительные пары следуют этому правилу, обычно это хорошее место для начала.
Вот несколько примеров прекрасных сочетаний шрифтов для электронной коммерции с использованием бесплатного ресурса шрифтов, который мы любим, Google Fonts. Чтобы получить максимальную отдачу от этих сочетаний шрифтов в вашем собственном магазине электронной торговли, попробуйте использовать более сложный шрифт для заголовков и более простой шрифт для основного текста или подтекста.
1. Crimson Text Regular и Source Sans Pro Regular
Сочетание шрифта без засечек и шрифта с засечками — один из самых популярных стилей сочетания шрифтов. Здесь мы используем шрифт с засечками Crimson Text с шрифтом без засечек Source Sans Pro.Это классическое сочетание успокаивает зрителей, поэтому отлично подходит для ухода за кожей, спа, йоги и других сайтов электронной коммерции, посвященных релаксации.
2. Lato Light и Lato Regular
Иногда также может работать использование разных шрифтов из одного семейства — просто убедитесь, что вы создали адекватный визуальный контраст между ними. Для элегантного образа попробуйте Lato Light большего размера и Lato Regular меньшего размера. Эта комбинация лучше всего работает с сайтами электронной коммерции о моде и ювелирных изделиях.
3.Luckiest Guy и Bitter Regular
Для более веселых и игривых сайтов вы можете выбрать дисплейный шрифт, который демонстрирует юную индивидуальность вашего бренда. Здесь мы использовали игривый шрифт Luckiest Guy в сочетании с плоским шрифтом Bitter. Это сочетание шрифтов лучше всего подходит для интернет-магазинов, продающих товары для детей.
4. Montserrat Bold и Roboto Regular
Иногда вам просто нужно чистое минималистичное сочетание шрифтов. Montserrat Bold — это более тяжелый шрифт, который хорошо сочетается с более светлым Roboto Regular.Хотя эти два шрифта без засечек не совсем противоположны, вы можете настроить их вес, чтобы создать больший контраст между двумя шрифтами. Это сочетание лучше всего подходит для сайтов электронной коммерции, продающих электронику или промышленные детали.
5. Bebas Neue и PT Serif Regular
Для другого классического сочетания шрифтов без засечек и шрифтов с засечками попробуйте комбинировать жирный шрифт в шрифте без засечек Bebas Neue, чтобы контрастировать с более легким шрифтом с засечками, PT Serif Regular . Для сайтов электронной коммерции это сочетание шрифтов достаточно универсально, чтобы работать в самых разных отраслях.
6. Josefin Sans Light и Crimson Text
Для успокаивающего и изысканного образа попробуйте сочетать Josefin Sans Light с Crimson text. Тонкие буквы в Josefin Sans создают ощущение легкости, а шрифт с засечками Crimson Text добавляет классический и профессиональный вид. Этот дуэт отлично подходит для магазинов, торгующих косметикой, украшениями или средствами по уходу за кожей.
7. Short Stack и Podkova Regular
Чтобы получить веселый и игривый вид, попробуйте соединить Short Stack и Podkova Regular.Эти шрифты работают вместе, чтобы создать беззаботное настроение, которое будет хорошо смотреться в магазинах, торгующих товарами для детей.
8. Titillium Bold и Titillium Regular
Иногда использование одного и того же шрифта разного веса может придать вашему магазину столь необходимый импульс индивидуальности. В этом примере мы соединили Titillium Bold с Titillium Regular. Квадратные буквы Titillium создают сильную мужскую атмосферу, а контрастирующие веса создают существенную иерархию. Эта пара шрифтов отлично подойдет для магазинов, торгующих автомобильными или промышленными запчастями.
В заключение
Теперь, когда у вас есть хорошее представление о некоторых красивых сочетаниях шрифтов, попробуйте протестировать их в собственном магазине — но всегда помните, что шрифты также должны дополнять ваш логотип, чтобы вызывать желаемое настроение и ощущение вашего бренда. Заинтересованы в создании собственного сочетания шрифтов? Используйте размер, вес и классификацию, чтобы сделать свой выбор, и помните золотое правило: противоположности притягиваются.
О Мэг Нэнсон
Мег Нэнсон — контент-стратег в Grow With Studio, агентстве цифрового маркетинга.Обладая почти десятилетним опытом, Мэг помогает компаниям найти свой голос и масштабировать свои органические стратегии.
Посетите их сайт здесь .