Загрузка отдельных семейств шрифтов TypeKit без JavaScript и без загрузки статического набора - PullRequest
1 голос
/ 12 октября 2019

Это и это было похоже, но не помогло.

Цель состоит в том, чтобы загрузить отдельные семейства шрифтов TypeKit, аналогичные Google Fonts, но без загрузки статическогокомплект и без JavaScript.

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

С помощью Google Fonts мы можем сделать что-то вродеthis:

<link href="https://fonts.googleapis.com/css?family=Comfortaa:regular" rel="stylesheet">

В соответствии с этой страницей Adobe / TypeKit , возможно встраивать шрифты без JavaScript следующим образом:

<link rel="stylesheet" href="https://use.typekit.net/xxxxxxx.css">

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

Можно ли загрузить этот этот китайский шрифт и все его веса вместе с другими динамическиопределенные шрифты (1) без использования JavaScript;и (2) без загрузки ненужных семейств шрифтов?

Ответы [ 2 ]

2 голосов
/ 18 октября 2019

Да, вы можете встраивать веб-шрифты Typekit с помощью CSS (точно так же, как и шрифты Google), однако вам необходимо настроить веб-проект TypeKit и , чтобы зарегистрировать свой домен , прежде чем вы сможете это сделать. сделай это. Шрифты Typekit не бесплатны, и Adobe хочет отслеживать, как часто они используются. (вы также можете назначить шрифты этим инструментом)

Однако вам все равно придется каким-то образом ввести шрифт, чтобы сделать его доступным для браузера. Вы можете включить его в обслуживаемый HTML-код на стороне сервера (например, включить PHP) или добавить его с помощью JavaScript. Typekit также должен дать вам код для Javascript.

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


Изменить: Все веса шрифта в семье

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

Возможно, кто-то, кто живет в этой части света, мог бы весить?

0 голосов
/ 15 октября 2019

Вы можете играть с "font-display" свойством CSS в зависимости от ваших потребностей. font-display: optional будет работать для вас.

См .:

https://css -tricks.com / almanac / properties / f / font-display /

https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display

...