Как проверить размер и начертание шрифта на веб-сайте

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

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

Проверка типа и размера шрифта на веб-сайте

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

  1. Нажмите правой кнопкой мыши на странице, которая вам нравится, и выберите Проверить элемент (Firefox), <Проверить (Chrome) или F12 Инструменты разработчика (Edge).
  2. Выберите Inspector (Firefox) или Computed (Chrome) в новых нижних окнах и прокрутите вниз справа, пока не дойдете до Font или font-size. Он должен показывать семейство шрифтов, конкретный используемый шрифт, его размер, цвет и все остальное, что определяет страница.
    < /li>

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

Сторонние инструменты для определения типа и размера шрифта

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

WhatFont

WhatFont доступен в виде веб-сайта или расширения для браузера. WhatFont бесплатен и очень прост. Вот что нужно сделать.

  1. Найдите шрифт, который хотите исследовать. Сделайте скриншот образца (CMD+Shift+4 на Mac или клавиша Windows+Shift+S на ПК). Затем перейдите на веб-сайт WhatFont.
  2. Нажмите, чтобы загрузить снимок экрана со своего компьютера, или перетащите снимок экрана и поместите его в поле.
  3. Выберите образец шрифта. Затем нажмите значок синей стрелки.
  4. Прокрутите список и найдите тот, который лучше всего соответствует нужному шрифту.

Помимо названия шрифта, вы также можете приобрести его, если у вас его еще нет.

В зависимости от того, как настроена CMS или как спроектирована страница, это будет либо простая идентификация шрифта, либо полное поле с указанием размера, цвета, толщины и т. д.

Fontanello

Не путать с футболистом. Fontanello – отличное бесплатное расширение для браузера, позволяющее быстро и легко просматривать шрифт сайта. Хотя в настоящее время оно доступно только для Chrome и Firefox, его стоит загрузить. Вот как использовать Фонтанелло:

  1. Откройте Chrome и нажмите ‘Добавить в Chrome’ чтобы установить расширение браузера Fontanello.
  2. Откройте веб-страницу с вашим шрифтом’ хотелось бы осмотреть. Выделите образец текста, который вам нравится.
  3. Нажмите правой кнопкой мыши на выделенный текст затем нажмите ‘Фонтанелло’

В появившемся всплывающем меню вы увидите сведения о шрифте.

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

Часто задаваемые вопросы

Вот еще несколько ответов на ваши вопросы об онлайн-шрифтах.

Как узнать, какой шрифт используется в изображении?

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

Проверка веб-сайтов

Существует множество надстроек типа букмарклетов, которые могут идентифицировать шрифты; WhatFont — лишь один из них. Вы используете один? Убедила ли вас эта статья попробовать что-то новое? Дайте нам знать ниже.

Рейтинг
( Пока оценок нет )
Funtik/ автор статьи
Понравилась статья? Поделиться с друзьями:
Добавить комментарий