fix(fonts): Add support for more languages (#35871)

* fix(fonts): Add support for more languages

* ref(font): Add subsetting instructions to README file

* ref(fonts): Remove -latin suffix from font names

* ref(fonts): Remove font-display: swap

* Revert "ref(fonts): Remove font-display: swap"

This reverts commit 219a3c99f8763c95e2fe3efcff6fbc0951261a20.

* ref(fonts): Use base-1000 font scaling

static/fonts/README.md

@@ -19,5 +19,12 @@ The modified metrics are:
 
 These files have been reprocessed using [FontSquirrel's Webfont Generator](https://www.fontsquirrel.com/tools/webfont-generator) to reduce their size. Note that the default Optimal option will remove certain useful font features and settings. Before processing, select the Expert option, and change the following:
 
-- Vertical metrics: no adjustment
-- Opentype features: keep all features
+- **Vertical metrics:** no adjustment
+- **Opentype features:** keep all features
+- **Subsetting:** custom subsetting – read more below
+
+### Subsetting
+
+Subsetting narrows the list of glyphs (characters) included in the exported font files. We split our fonts into files with different glyph sets, each defined by a [unicode range](https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/unicode-range). This way, we can serve only the files with the glyphs that the user needs. If the page contains only latin characters, then the browser will only download the file with latin glyphs (e.g. `/rubik-regular-latin.woff2`). But if the page also has cyrillic text, then the browser will additionally download the file with cyrillic glyphs (e.g. `/rubik-regular-cyrillic.woff2`). This split reduces the total font loading time, since only the relevant glyph sets are downloaded.
+
+We support four glyph sets: `latin`, `latin-ext`, `cyrillic`, and `cyrillic-ext`. The unicode ranges for each of these sets can be found in [Google Fonts' Rubik stylesheet](https://fonts.googleapis.com/css2?family=Rubik&display=swap). In FontSquirrel's Webfont Generator, copy and paste these ranges into Subsetting -> Custom Subsetting -> Unicode Ranges. Once everything has been exported, check that each file contains the correct glyphs using [FontDrop](https://fontdrop.info/).