CSS3 Web Fonts issue with ‘block on download’

Hi All,

I recently came across an issue when an @font-face takes a long time
to download (eg large font, slow server etc). In the font-matching
algorithm the CSS3 Web Fonts working draft says:
4.4 “The UA may choose to block on this download or may choose to
proceed to the next step while the font downloads.”
    http://www.w3.org/TR/css3-webfonts/#algorithm

Firefox implements this by proceeding with the font matching algorithm
while the @font-face downloads. This results in the content being
drawn quickly, with a redraw once the @font-face font has downloaded.
Safari implements this by ‘blocking on download’ (I’m guessing that
means ‘stop the text layout algorithm until @font-face finishes
downloading’), which if the @font-family font takes a long time to
download can mean the user sees what appears to be a broken page. This
is especially noticeable if the font is used for body text. This has
led to the following Webkit bug:
    https://bugs.webkit.org/show_bug.cgi?id=25207
which contains this demonstration:
    http://hsivonen.iki.fi/

While requiring a redraw has visual and performance drawbacks, I think
permitting nothing to be displayed until a font downloads presents a
serious usability issue, especially for people accessing pages with
large double-byte fonts or over slow connections. I humbly submit this
sentence should be changed to “The UA must proceed to the next step
while the font downloads.”

Thank you for your time

peace - oli studholme

Received on Thursday, 7 May 2009 11:29:24 UTC