Subsetting web fonts with glyphhanger

glyphhanger is a great tool to work with web fonts, developed by the folks at Filament Group. It serves two goals: It shows what unicode-ranges are used on a web page: # local and remote URLs $ glyphhanger ./test.html $ glyphhanger https://example.com # output characters instead of Unicode code points $ glyphhanger ./test.html –string # […]

Fontastic Web Performance

Emojineer Monica Dinculescu: Web fonts are awesome. They make your sans-serifs slabby, your headers special and your website look gorgeous. But fonts are a resource, and downloading resources always comes as a cost β€” if you don’t load web fonts efficiently, what you get instead are phantom underlines, blank pages, and user rage. Let’s talk […]

Minimize FOUT with Font Style Matcher

Great tool by Monica Dinculescu (@notwaldorf): If you’re using a web font, you’re bound to see a flash of unstyled text (or FOUC), between the initial render of your websafe font and the webfont that you’ve chosen. This usually results in a jarring shift in layout, due to sizing discrepancies between the two fonts. To […]