Как подключить шрифт в css локально
Перейти к содержимому

Как подключить шрифт в css локально

  • автор:

Использование веб-шрифтов с CodePen

CodePen представляет собой веб-редактор кода HTML, CSS и JavaScript, который позволяет экспериментировать с кодом прямо в браузере. Вы можете использовать собственные веб-шрифты непосредственно через свой инструмент «Перо».

Выбор шрифтов для использования

Процедура выбора шрифтов для использования в создаваемых проектах описана в руководстве по веб-шрифтам.

Добавление кода встраивания в инструмент «Перо»

Код для встраивания можно добавить в пользовательский интерфейс CodePen в поле «Stuff for » в меню настроек редактора HTML или в меню «CSS > Add External CSS»

Чтобы найти код встраивания для своего проекта, посетите страницу веб-проектов и найдите название своего проекта. Скопируйте и вставьте код встраивания CSS по умолчанию для этого проекта в одно из этих мест.

Использование CodePen с кодом встраивания CSS по умолчанию

Использование CodePen путем прямой ссылки на файл CSS

Применение шрифтов в CSS

Теперь вы можете использовать названия семейств шрифтов в редакторе CSS Pen, и шрифты сразу будут видны в интерактивном просмотре.

Редактор CodePen с примененным веб-шрифтом

Название семейства шрифтов, которое будет использоваться в CSS, также указано в веб-проекте; узнать больше об использовании шрифтов в CSS.

Данные CSS на странице веб-проекта

Дублирование перьев

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

Удаление проекта или отмена подписки

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

Справки по другим продуктам

Вопросы с меткой [шрифты]

Шрифт — файл, содержащий набор глифов, знаков, символов (в том числе псевдографических).

547 вопросов
Конкурсные
Неотвеченные

  • Конкурсные 0
  • Неотвеченные
  • Цитируемые
  • Рейтинг
  • Неотвеченные (мои метки)

Меняется шрифт при переводе страницы google translate

Я использую шрифт caladea которий скачал и подключил в . >» rel=’stylesheet’ type=’text/css’> Сам файл fonts.css /.

задан 30 сен 2022 в 8:22

Помогите пожалуйста найти шрифт

Можно ли как то найти шрифт имея лишь 1 слово написанное этим шрифтом? Если да то скажите как это можно сделать? Или скажите название этого шрифта: ��������

user451780
задан 28 сен 2022 в 8:19
246 показов

Powershell как увеличить шрифт?

Подскажите пожалуйста, как увеличить текст в кавычках, например у меня есть: $Title =»ED503: Конверт для передачи финансовых сообщений о переводе денежных средств. $EDNo=&.

задан 21 сен 2022 в 14:19

отображение шрифтов font awesome

В один момент на сайте вместо иконок font awesome стали отображаться квадратики. В элементах консоли на вкладке Вычисления в разделе Отображаемые шрифты написано Times New Roman—Локальный файл(1 глиф).

задан 19 сен 2022 в 11:46

В какой момент браузер подгружает шрифты?

При верстке я «объявляю» в css-файле все виды и размеры используемого шрифта. К примеру, шрифт Raleway содержит 90 файлов .woff2. Однако на страницах я обычно использую из этого множества 3-.

задан 15 сен 2022 в 9:20
493 показа

Как сделать жирный цвет в сообщении телеграмм бота?

Делаю через parse_mode=»Markdown», но у меня в ссылке на есть нижнее подчеркивание (‘_Запись на консультацию_ по контактам @ron_pozharyts’, parse_mode=»Markdown») выдает ошибку

Как подключать шрифты

Если говорить в очень общем смысле, то способов подключить сами шрифты к странице — это локально и внешне через какой-то сервис вроде Google Fonts.

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

Если же вы в поисках легкого пути, то вам тут делать особо нечего =)
(Но можно прочитать последнюю часть, там про указание шрифта)

Из чего состоят шрифты

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

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

Прежде всего, шрифты делятся на несколько типов. Вот самые основные (иное едва ли встретится):

  • шрифты с засечками (serif);
  • шрифты без засечек (sans-serif);
  • моноширинные (monospace).

Возьмем, например, семейство Open Sans. Это семейство без засечек, оно попадает в категорию sans-serif. Стоп! Мы только что говорили про шрифты, какое еще “семейство”?

Семейство — это набор шрифтов, объединенных общей стилистикой (это еще можно назвать “гарнитура”, но нам в вебе ближе термин “семейство”). Именно семейства имеют названия: Arial, Times New Roman, Helvetica . И Open Sans в том числе. Давайте откроем Open Sans на Google Fonts и посмотрим что там есть:

Семейство Open Sans на Google Fonts

Итак, куча разных вариантов. По сути, каждый вариант — это и есть шрифт, входящий в семейство Open Sans.

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

Файлы семейства Open Sans

Можно легко заметить, что шрифты отличаются друг от друга по двум параметрам: толщине (или весу, weight) и начертанию (style).
Чуть ниже находится список глифов — букв и символов, которые есть в этом семействе (но нам это важно, только если мы захотим упороться на оптимизации):

Глифы семейства Open Sans

Ну, со структурой шрифта разобрались, давайте подключать!

Разбираем @font-face по кусочкам

Итак, чтобы подключить шрифт, нам нужно в CSS использовать правило @font-face :

@font-face  
.
>

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

Основные параметры шрифта

  • font-family — указывает, к какому семейству относится шрифт;
  • font-weight — указывает вес шрифта;
  • font-style — указывает начертание шрифта.

Будьте внимательны с параметром font-family. Там должно быть указано именно семейство шрифта, то есть в нашем случае это ‘Open Sans’ . Многие по ошибке указывают ‘Open Sans Bold’ , ‘Open Sans Italic’ и создают тем самым семейства с одним шрифтом. И каждый раз, меняя толщину шрифта, приходится менять и семейство.
Так делать не нужно, @font-face как раз позволяет нам подключать к одному семейству разные шрифты с указанным весом и начертанием, чтобы браузер по этим параметрам брал нужный файл.

Получается что-то такое:

@font-face  
font-family: 'Open Sans';
font-weight: 400;
font-style: normal;
>

@font-face
font-family: 'Open Sans';
font-weight: 600;
font-style: normal;
>

Подключаем файлы

Как мы помним, каждый шрифт представлен отдельным файлом. Поэтому, для каждого @font-face правила нужно подключить свой файл. Но с ними не все так просто (ну а как же).

У шрифтов очень много различных форматов. К счастью, для современных браузеров на данный момент используется всего 2: woff и woff2. woff2 чуть современнее и лучше оптимизирован.

Чтобы подключить файлы, нужно воспользоваться параметром src :

@font-face  
font-family: 'Open Sans';
font-weight: 400;
font-style: normal;
src:
url('../fonts/open-sans.woff2') format('woff2'),
url('../fonts/open-sans.woff') format('woff');
>

@font-face
font-family: 'Open Sans';
font-weight: 600;
font-style: normal;
src:
url('../fonts/open-sans-semibold.woff2') format('woff2'),
url('../fonts/open-sans-semibold.woff') format('woff');
>

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

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

Оптимизация загрузки

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

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

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

Как раз за это отвечает параметр font-display . Про нюансы его работы можно писать отдельную статью (хотя, что значит можно, вот статья Зака Лезермана в переводе на CSS-live с кучей слов и жуткими аббревиатурами типа FOIT, FOUT и FOFT).

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

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

@font-face  
font-family: 'Open Sans';
font-weight: 400;
font-style: normal;
font-display: swap;
src:
url('../fonts/open-sans.woff2') format('woff2'),
url('../fonts/open-sans.woff') format('woff');
>

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

link rel="preload" href="fonts/open-sans.woff2" as="font" type="font/woff2" crossorigin>

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

@font-face  
font-family: 'Open Sans';
font-weight: 400;
font-style: normal;
font-display: swap;
src:
local('Open Sans'),
url('../fonts/open-sans.woff2') format('woff2'),
url('../fonts/open-sans.woff') format('woff');
>

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

Ну и напоследок: можно разделить шрифт по глифам и загружать его только при необходимости использования символов из определенного диапазона.
В рамках курса этого не только не требуют, но и не рассказывают о таких возможностях. Если же очень интересно, то рекомендую посмотреть выступление Вадима Макеева _____ ___ _____?

Как указывать шрифт

Ну и последнее: как правильно шрифт указывать? Кажется, все очень просто: есть свойство font-family:

font-family: 'Open Sans';

Но на самом деле этого недостаточно, нужно указать еще 2 параметра:

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

И получится что-то такое:

font-family: 'Open Sans', 'Arial', sans-serif;

Небольшой оффтоп. И сразу предупреждаю: на курсе так не делаем =)
В общем, на мой взгляд веб-безопасный шрифт вещь довольно бесполезная. Ни один из этих старых допотопных шрифтов не будет похож на современный.
Более того, если выставить сразу sans-serif, то система применит свой шрифт. Для современных macOS это будет San Francisco, а для Windows это будет Segue UI. Так вот, любой этот шрифт будет больше похож на Open Sans, чем допотопный Arial или его братья.
Так что получается, что веб-безопасный шрифт только мешает.

И есть еще один важный момент, который касается наследования. Это относится не только к шрифтам, но тем не менее рассмотрим этот момент. В самом свойстве font-family все довольно просто: браузер пытается подключить первый шрифт, и если не получается, то пытается подключить следующий, пока не получится. Если совсем не получится, браузер в итоге подключит Times New Roman (поэтому и указываем в конце семейство). Однако, внимание обратить нужно вот на что. Многие, указав весь необходимый набор шрифтов для body, для вложенных элементов с другим шрифтом уже не прописывают веб-безопасный и семейство:

body  
font-family: 'Open Sans', 'Arial', sans-serif;
>

.some-class
font-family: 'Gotham';
>

И это большая ошибка, потому что браузер, когда он не сможет подключить Gotham, не пойдет в родительский элемент смотреть какие шрифты там указаны в font-family . CSS так не работает. Свойство font-family будет считаться перезаписанным полностью, и для элемента .some-class уже не будет иметь никакого значения что там за шрифты на body . И браузер попробует подключить Gotham, а затем двинется дальше, не найдет вариантов и подключит Times New Roman.

Поэтому правильное подключение будет выглядеть так:

body  
font-family: 'Open Sans', 'Arial', sans-serif;
>

.some-class
font-family: 'Gotham', 'Arial', sans-serif;
>

Ну, вот теперь всё.
Успехов!

Оптимизация шрифтов. Как подключить Google Fonts локально?

Размещение шрифтов Google локально в WordPress

Сегодня, друзья, вы узнаете — как подключить шрифты Google (Google Fonts) локально в WordPress (оптимизация загрузки шрифтов). В данном руководстве я собираюсь показать вам, как загружать шрифты Google с вашего сервера / хостинга, а не из внешних источников. Зачем? А чтобы ускорить ваш веб — ресурс и достичь максимальное количество баллов производительности сайта WP в PageSpeed Insights. Избавимся в PageSpeed Insights от строчки: Показ всего текста во время загрузки веб-шрифтов. Она переместится в зелёную зону — Успешные аудиты .

Показ всего текста во время загрузки веб-шрифтов

В Интернете полно инструкций как оптимизировать шрифты в WordPress путем размещения Google Fonts локально. Но если честно, они только для профи.

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

Зачем размещать шрифты локально в WordPress?

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

Ничто так не замедляет работу веб-сайта WordPress, как слишком много внешних HTTP-запросов. Скорее всего, ваша тема ВордПресс содержит запросы шрифтов Google, которые предварительно загружаются разработчиком. При правильных условиях размещение Google Fonts локально на вашем собственном хостинге / сервере может уменьшить HTTP-запросы и время загрузки WordPress.Чем меньше запросов, тем быстрее время загрузки сайта ВордПресс.

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

С Google Fonts у вас также есть один дополнительный HTTP — запрос (к таблице стилей шрифтов Google) для поиска fonts.googleapis.com , чтобы получить файл CSS. Затем из этой таблицы стилей делается запрос на сам шрифт из fonts.gstatic.com для загрузки файлов шрифтов. Выполнение дополнительных HTTP — запросов на ваших сайтах требует времени.

Google Fonts API устанавливает минимальный срок действия в 1 день для кеширования шрифтов. Вы не можете изменить это, поскольку Google создает файл CSS автоматически на основе нескольких факторов.

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

Когда вы размещаете локально, все запросы поступают из одного домена (вашего) и скорее всего, вам не понадобится другой файл CSS, поскольку он будет внутри файла CSS вашей темы WordPress. Плюс, вы добавите display=swap параметр в запроса, для удовлетворения рекомендации PageSpeed, чтобы текст оставался видимым во время загрузки веб-шрифта.

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

В следующем разделе рассказывается, как вы можете сделать это на своем сайте WordPress. Самый простой способ оптимизировать и разместить шрифты локально на своем сайте WordPress — это бесплатный плагин OMGF WordPress и новый Local Google Fonts.

Local Google Fonts (Локальные шрифты Google)

Разместите используемые шрифты Google на своем сервере/хостинге и сделайте свой сайт WP более совместимым с GDPR. Плагин типа Установи и забудь. Это может быть хорошим вариантом для нетехнических пользователей:

Локальные шрифты Google для WordPress

Универсальный плагин Local Google Fonts, который автоматически определяет источники шрифтов Google и дает пользователям возможность загружать их и использовать локально.

Установите и активируйте плагин Локальные шрифты Google. Перейдите в Настройки — Google Fonts (Шрифты Google) и решите, какие шрифты должны загружаться локально:

Настройки плагина Local Google Fonts

На этой странице показаны все обнаруженные шрифты Google с течением времени. Нажмите кнопку Host locally. И шрифты Google загрузятся на ваш хостинг.

Мои шрифты не отображаются на странице настроек, что мне делать?

Шрифты обнаруживаются после их использования. Попробуйте сначала просмотреть свой сайт и вернуться на страницу настроек.

Следующий плагин OMGF | Host Google Fonts Locally, который имеет несколько дополнительных функций.

Оптимизация шрифтов автоматически с помощью плагина OMGF

Теперь в нашем распоряжении есть мощный плагин WordPress. И он называется OMGF | Размещение шрифтов Google локально. Расшифровка аббревиатуры OMGF — Оптимизировать мои шрифты Google.

Используйте кэш браузера и минимизируйте запросы DNS с помощью OMGF (Optimize My Google Fonts, ранее известного как CAOS for Webfonts). Поддерживайте высокий балл в Pagespeed Insights и продолжайте использовать свои шрифты Google, разместив их локально.

Как загрузить Google шрифты локально в WordPress

OMGF написан с учетом производительности и удобства использования. Он использует Google Fonts Helper API для автоматической загрузки нужных шрифтов в папку содержимого WordPress и создания для них таблицы стилей.

Таблица стилей автоматически включается в заголовок вашего сайта и на 100% совместима с плагинами оптимизации / минификации CSS и JS, такими как Autoptimize или W3 Total Cache. OMGF может эффективно удалять любые запросы к внешним шрифтам Google (загруженным с fonts.gstatic.com или fonts.googleapies.com ).

Это уменьшит время загрузки вашей страницы , задействует кеш браузера , минимизирует DNS-запросы и фактически принесет вам отличную оценку в Pagespeed Insights, не сказываясь на производительности вашего веб-сервера.

Возможности OMGF:

  • Автоматически определять, какие шрифты Google Fonts использует ваша тема;
  • Загружать их и создавать таблицу стилей, которая автоматически добавляется в ваш заголовок с помощью функции WordPress wp_head ();
  • Изменять путь кэширования (где сохраняются шрифты и таблица стилей) для повышения совместимости с мультисайтовыми средами и плагинами кэширования и безопасности, такими как WP Super Cache, Autoptimize и WordFence;
  • Включать загрузчик веб-шрифтов Typekit для асинхронной загрузки шрифтов и дальнейшего повышения вашего рейтинга Pagespeed Insights;
  • Управлять производительностью шрифтов, добавляя свойство font-display Swap (оптимизация загрузки шрифта);
  • Предварительно загружать всю таблицу стилей или только шрифты, загруженные в верхней части страницы;
  • Автоматически генерировать локальный источник для веб-шрифтов;
  • Автоматически удаляйте все шрифты, загруженные с fonts.gstatic.com или fonts.googleapis.com.

Вам не нужно ничего скачивать. Вам не нужно ничего распаковывать. Вам не нужно ничего загружать. И вам не нужно ничего создавать — особенно чертову таблицу стилей. Без обид.

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

Установка OMGF

  1. В админ панели WordPress перейдите в Плагины — Добавить новый;
  2. Введите OMGF в строку поиска по плагинам;
  3. Выберите с розовой полосой и нажмите «Установить».
  4. После установки нажмите «Активировать».

Установка плагина OMGF из репозитория WordPress

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

Настройка OMGF: Оптимизация производительности Google Fonts

Пришло время для самого интересного! Размещение ваших шрифтов в WordPress локально.

Зайдите в Настройки, выберите новый пункт — Optimize My Google Fonts (оптимизировать шрифты Google). Нажмите кнопку Auto detect (Авто определение):

Авто определение шрифтов и плагинов

Инструмент определит какие шрифты использует ваша тема и плагины. Если не удаётся сразу найти используемые шрифты, то откройте любую запись в новой вкладке и попробуйте снова. Используемые подмножества и шрифты вашей темы автоматически появятся в списке. У меня получилось так. Авто определение обнаружило у меня на сайте seojournal.ru 2 шрифта в 2 разных подмножествах и 5 стилей шрифтов:

5 шрифтов установлены для предварительной загрузки локально

В доступные стили шрифтов отметьте нужные. Пожалуйста, проверьте результаты и продолжите загрузку шрифтов и создание таблицы стилей. Для этого, кликните кнопочку » Download Fonts » (Загрузить шрифты) и дождитесь завершения загрузки шрифтов на ваш хостинг.

В зависимости от размера вашего списка шрифтов и скорости вашего хостинга / сервера это может занять несколько минут. Как только процесс завершиться появится подсказка. Например, у меня так:

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

Через пару секунд появится надпись: Поздравляю! Ваша таблица стилей была успешно создана и добавлена ​​в заголовок вашей темы. Готово!

Видите, как это было легко? Никакой 12 — шаговой программы! Ваши шрифты были загружены и сохранены на вашем хостинге. Таблица стилей была создана и добавлена ​​в заголовок вашей темы. Всё автоматически! Круто.

Удаление внешних шрифтов Google

Теперь остается только удалить любое упоминание о внешних шрифтах Google из вашего блога / сайта. OMGF поддерживает функцию «Удалить шрифты Google». Модуль позаботится обо всех шрифтах Google, добавленных обычными методами. Откройте вкладку Advanced Settings (Расширенные настройки) и поставьте галочку напротив Auto Remove (Автоматическое удаление):

Удалите любые запросы к внешним таблицам стилей Google Fonts из вашего WordPress

Удалите любые запросы к внешним таблицам стилей Google Fonts из вашего WordPress-блога. Нажмите «Сохраните изменения». Если это не сработает, ваша тема и / или плагины используют не традиционные методы для загрузки шрифтов Google.

Некоторые темы предлагают возможность отключить шрифты Google. Если ваша тема не работает, есть много других способов добиться этого. Например, в плагине WP-Optimize раздел Minify, вкладка Fonts можно отключить шрифты от Гугла:

Удаление внешних шрифтов Google Fonts

В модуле Autoptimize также есть опция для удаления Google Fonts:

Параметры Extra позволяют удалить или оптимизировать шрифты Google

В заключение

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

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

Напомню вам: Если вы видите огромное влияние шрифтов на свой сайт WordPress, можно просто использовать системные шрифты! Инструкция на этой странице.

По-прежнему возникают проблемы с Google Fonts и их оптимизацией? Если у вас есть вопросы или предложения, оставьте комментарий ниже.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *