DEV Community

Save page weight with web font subsetting

Benjamin Black on September 13, 2018

My posts are usually notes and reference materials for myself, which I publish here with the hope that others might find them useful. Web Fonts ar...
Collapse
 
ahmedmusallam profile image
Ahmed Musallam

This is very cool! I remember wanting to do something like this, but did not know the tools you mentioned existed. I ended up using FontForge and deleting glyph ranges by hand through the gui. If I recall correctly, it worked. I really wish I had documented that!!

Collapse
 
ben profile image
Ben Halpern

How does this work with a CDN? You're telling the host what data to send over?

Collapse
 
stereobooster profile image
stereobooster

This data should be communicated through URL, like this:

@import url("http://fonts.googleapis.com/css?family=Lato:300,400,700&subset=latin");
Collapse
 
benjaminblack profile image
Benjamin Black

Google Web Fonts, for example, lets you choose a subset of the font you intend to use so that the font includes only, e.g., the so-called "Latin-1" characters, and not all of the extended characters.