@@KallePeng
- Frage: Werden die modernen Browser alle 14 Schriftschnitte vorladen, auch wenn aus dem Seitenaufbau hervor geht, das nur 4 von 14 definitiv genutz werden?
Ohne weiteres Zutun werden keine Fonts vorgeladen.
Sie werden bei Bedarf geladen, d.h. wenn Glyphen daraus auf der Seite benötigt werden. In deinem Fall heißt das: Es werden 4 Fonts geladen, nicht 14. @Robert B. schrieb ja schon, wie du das feststellen kannst.
„Bei Bedarf“ heißt aber nicht nur Schriftschnitte, sondern auch Unicode-Bereiche. Ich habe mich unlängst erst damit beschäftigt, Fonts aufzuteilen in Fonts mit ziemlich sicher benötigten Zeichen (basic, enthält die meisten ASCII-Zeichen, Umlaute, ß, €, typografisch korrekte Anführungszeichen und Gedankenstriche), Fonts mit eventuell benötigten Zeichen (extended, u.a. Buchstaben mit diakritischen Zeichen wie á, å, ă, ç, ć, č, ğ, ł, œ, ş) und Fonts mit sehr selten vorkommenden Zeichen (other).
☞ TIL about font subsetting₂, slide 14, Einbindung auf slide 18
Auf den meisten Seiten werden nur die Basic-Fonts geladen, die deutlich kleiner sind als es die Fonts mit allen Glyphen wären. Bei Bedarf wird auch mal der ein oder andere Extended-Font dazugeladen. Der Bedarf an Other-Fonts dürfte kaum auftreten; aber wenn, dann werden auch diese Zeichen in der gewünschten Schriftart dargestellt (vorausgesetzt, die Schriftart hat Glyphen dafür).
Um den flash of unstyled text (FOUT) zu vermeiden bzw. kaum sichtbar werden zu lassen, kann man den/die garantiert benötigten Font(s) vorladen: <link ref="preload" …>
(☞ slide 18), das sollte aber auch per HTTP-Header gehen. Dadurch wird dieser Font schon geladen, bevor das CSS geparst wird, steht also schon beim initialen Rendern der Seite zur Verfügung.
Das wird aber i.d.R. nur der Font mit dem Normal-Schriftschnitt für die Basic-Zeichen sein. Es macht keinen Sinn, alles vorzuladen, denn das würde ja die Priorität wieder zunichtemachen.
🖖 Живіть довго і процвітайте
„Im Vergleich mit Elon Musk bei Twitter ist ein Elefant im Porzellanladen eine Ballerina.“
— @Grantscheam auf Twitter