Как получить настоящие маленькие заглавные буквы из веб-шрифта от Google-шрифтов - PullRequest
Новая
       105

Как получить настоящие маленькие заглавные буквы из веб-шрифта от Google-шрифтов

2 голосов
/ 16 апреля 2019

Я использую Alegreya семейство шрифтов от Google Fonts на веб-сайте.Похоже, что Google исключает функцию шрифта с маленькими заглавными буквами, поэтому, хотя Alegreya имеет заглавных букв (см. Ниже), они, похоже, не работают со шрифтами Google.Как я могу получить true small-caps в этом сценарии (шрифт из Google Fonts)?

Alegreya содержит настоящие small-caps (как функция OpenType),и также имеет сестринскую семью только для маленьких заглавных букв, Alegreya SC .Я скачал шрифт Regular из обоих семейств (напрямую из Google Fonts) и сравнил Alegreya-with-small-caps с Alegreya SC.Они идентичны, например, Alegreya имеет те же маленькие заглавные буквы , что и ее сестра.Но когда я попробую CSS ниже: 

.variant-smcp {
  font-family: Alegreya, serif; /* Alegreya from Google Fonts */
  font-variant: small-caps; /* should use OpenType smcp feature */
}

Я получаю только поддельные маленькие заглавные буквы (например, заглавные буквы, уменьшенные браузером).

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

Редактировать : Я такжепротестировано с использованием font-feature-settings: "smcp" on;, с точно таким же результатом: поддельные заглавные буквы, из smcp -кабельного шрифта (Alegreya).И я протестировал все эти вещи в Firefox 66 (для Windows и для Android) с точно таким же результатом.(Спасибо @Parapluie)

1 Ответ

0 голосов
/ 20 апреля 2019

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

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

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

У вас осталась та же проблема, что и у венецианского принтера 550 лет назад.Если он хотел маленькие заглавные буквы, он должен был купить и складировать полный ящик с 22 фунтами ведущих персонажей.Или он?

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

Чтобы добиться этого с помощью Google Fonts API, после выбора шрифта перейдите на вкладку «1 выбранный шрифт» и выберите «Настройка».Здесь вы можете уменьшить выбор шрифта только до требуемого размера и языков, тем самым уменьшив размер файла.

Чтобы добиться этого с помощью шрифта, загруженного с вашего сервера, рассмотрите возможность использования некоторого инструмента поднабора шрифтов, как обсуждалосьздесь:

Какой Fontfile использовать на веб-сайте?

Надеемся, что это поможет.

...