New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fonts update and stuff #19550
Comments
Thanks for the summary and details level, this is very educative. |
Very flattering, and a good bug, too, but a reduced test case is not this contributor’s strongest suite 😜. In any case, all credit goes to Herr Röttsches for fixing it. |
Font usage in emails is pretty inconsistent:
We should think about consolidating these. |
Yes. But proper consolidation can happen only after we set up pasteup 2.0, right? Until this happens, I would point to interactives.guim, where @Jholder112233 recently placed latest versions of Text Sans and Egyptian (and latest Guardian Headline was there before). |
Okay, thanks @paperboyo. I have updated the URLs to point to interactive.guim in #20628, and stripped out non-woff fonts as advised by this Litmus blog post. |
Thanks everybody for their effort! Let’s look to the future update! |
Issue just tracks the deployment and provides a description, I will close it as soon as the work is done.
This describes new quality standard of web and app fonts we use. Currently to roll out there are new versions of Text Egyptian and Text Sans. Scope of rollout:
New versions of these two families benefit from optimisations and fixes described below (similar to recently deployed GH Guardian Headline) and also:
Webfonts:
App fonts:
Historical context and current situation
Last time we updated our fonts, we optimised them to be half the size by e.g. removing
LTSH
,VDMX
,hdmx
and redundant legacykern
tables. We were also quick to appreciate the savings offered by WOFF2. We have also used different mixes of character set subsets depending on font file format to minimise the payload. Unfortunately, this last decision meant we’ve had to live with occasional ugly font substitutions and faux styles (even though we’ve tried to minimise the impact with clever fallbacks). This has grown increasingly at odds with our ambition to spell correctly whatever the language and our appreciation of good typography (faux italics in antiqua!).Because fixing it permanently using our current fonts would mean increasing the payload by various amounts depending on font format and charset mix used (e.g. WOFF2: 196KB→362KB; TTFautohint: 753KB→1782KB), we resorted to patching it here and there where the visual impact was deemed too much.
Lastly, we serve various flavours of hinting to different Windows clients and hinting substantially increases the payload.
Intent to implement
We’ve worked hard with our font provider – Commercial Type – and thanks to their expertise, invaluable help and patience (special thanks go to Mark Record, who did all the work!), been able to reduce the fonts file sizes by ~half again. This issue is meant to document the optimisations, bug fixes and changes, and to outline outstanding fixes. Lastly, we also list ideas for future optimisations which are outside the scope of this update.
With this update we hope to be able to greatly reduce or even eliminate (in WOFF2 at least) all faux styles and ugly glyph substitutions. It should eliminate the need for most or all hinting flavours reducing logic complexity. It also introduces some unrelated fixes.
Changelog
frac
,dnom
,numr
,sinf
,sups
,lnum
,onum
,ordn
,case
,tnum
,pnum
,ss01
,ss02
,salt
.Added a U+2010 Unicode codepoint to existing U+002D glyph. Harfbuzz only falls back from U+2011>U+2010, not from U+2010>U+002D. Browsers should have our back, but they don’t.
While “flattening” OT features, settled on Proportional Oldstyle figures style (instead of Tabular) as default for Text Egyptian to match other fonts and for better-looking text:
Adjusted Vertical metrics, so that baselines match between different families on Windows and Windows matches Mac rendering:
[note how kickers line up better, ignore changes in hinting]
[~10% smaller] Changed
post
tables to be version 3. And, yes, we are fine with a slight regression on a Mac (haven’t checked iOS, but unlikely to be there; it’s even less of an issue on HiDPI screens), maybe Apple will fix it one day:gasp
table to only allowVersion 1: Grid Fit, Anti-Alias, Symmetric-Smoothing, Grid Fit w/ Symmetric-Smoothing
(value15
) for all sizes to fix Windows rendering of non-hinted (and ClearType-hinted) fonts under some circumstances (e.g. Chrome<37 and any Firefox with OS set ClearType off, any Chrome on XP set to Standard).prep
program according to this recommendation attributed to Vern Adams (thank you!) to all unhinted fonts to fix Windows rendering (e.g. Chrome<37, any Win XP set to ClearType and all Firefoxes without hardware acceleration):[illustrates both pts. 8, 9]
[old versions of the fonts without Combining, just with spacing marks, decomposed form called for; Firefox – left, Chrome – right]
Future…
…is bright! I suspect possible further savings could exceed another 50%, by when, according to my math skillz, the fonts weight should be… negative 😜
Look into trying to productionise the idea behind Adam Twardoch’s super-clever ttfdiet. If only all other browsers would be as flexible as Chrome when doing composition and decomposition, maybe the whole hack wouldn’t even be necessary?
This requires impeccable Mark Positioning whenever it may provide result identical to precomposed forms (including kerning!) with alternate designs for cap marks working and all the goodness. The idea is for the fonts to be indistinguishable from the ones with precomposed forms.
Embrace OpenType 1.8 Variable Fonts. New format should provide file savings for current fonts, but should also help to combine Text and Headline families for even more radical savings!
Look into subsetting fonts on the fly to minimise loading for when component/projects cannot use dotcom’s fonts directly and there is no way to message them through.
Look into expanding (and standardising: Guardian Headline contains e.g. π & μ which are missing from other families) our Latin charset to cover more languages (e.g. Vietnamese!), so that we won’t have to be ashamed of ugly substitutions, won’t have to spend hours shaping individual glyphs for print manually and we won’t be hitting browser bugs (as rewarding as this is :-)). Hopefully, this should be helped by pt. 11 to avoid inflating font file sizes:
Fixes #17506 and properly fixes #8158 (pts. 3, 4). Properly fixes: #7630 and #7373 and #7912 and #7654 (pts. 8, 9; wrong
gasp
was causing jaggies in Blink browsers and wrong rendering of ClearType-hinted fonts). Properly fixes #7545 (pt. 6; Vertical metrics consistent between environments). Properly fixes: #5190 and #3253 (file-size should allow for serving full charsets, clever fallbacks were only so clever). And, most probably, a bunch of others.The text was updated successfully, but these errors were encountered: