This question is not answered. Helpful answers available: 0. Correct answers available: 1.


Permlink Replies: 5 - Pages: 1 - Last Post: 23-May-2020 12:40 Last Post By: jGromit Threads: [ Previous | Next ]
jret

Posts: 77
Registered: 5-Mar-2009
Story: google fonts
Posted: 22-May-2020 18:36
 
  Click to reply to this thread Reply
I'm using a google font for main page title. Sometimes (most of the time) the box title has a slight delay in displaying with the google font - i.e. the title first displays in one font then changes to the selected google font. https://jret.net

Is there a way to eliminate this delay so that the title displays with the correct font when the page is opened?
jGromit

Posts: 7,627
Registered: 31-Jan-2006
Re: Story: google fonts
Posted: 22-May-2020 23:25   in response to: jret in response to: jret
Helpful
  Click to reply to this thread Reply
Ah, the wonderful, murky, scary world of font loading! On a fast connection, whatever scheme you adopt has little effect, but if there's any kind of delay in getting to the font, especially the Google fonts, the choice of loading technique may have a noticeable impact.

You'll find all kinds of online debate about FOIT vs. FOUT, and their variants.

FOIT is "flash of invisible text." That says, don't show the text until you've got the correct font, but don't wait too long before you use the fallback font.

FOUT is "flash of unstyled text." That says, show the text immediately with the font that's available on the PC, then switch to the downloaded font when you've got it.

It looks like Laza has opted for FOUT in his skins - show the text immediately, then swap out the font (display=swap). Mine use a version of FOIT, instead, showing no text, but waiting no more than 100ms for the downloaded font to show up (display=fallback).

Once the font is cached on your machine, none of this matters - it comes up almost instantaneously. On your page, I don't see the unstyled text unless I hit CTRL-F5, which forces the page to go get the Cinzel Google font again. Otherwise, it's cached in my browser.

But even in my albums, a CTRL-F5 refresh causes a brief flash of unstyled text. The Google fonts are being served up by a CDN, but as is so often the case, the CDN can either be a big help, or a monumental roadblock, depending on current conditions.

I can get rid of the FOUT completely by forcing a longer wait (display=block), but that risks having no text at all show up for a full 3 seconds.

Not sure what approach is best, but no one else is, either. ;)
jret

Posts: 77
Registered: 5-Mar-2009
Re: Story: google fonts
Posted: 23-May-2020 02:11   in response to: jGromit in response to: jGromit
 
  Click to reply to this thread Reply
FOIT vs FOUT ... thanks for the excellent explanation. I just haven't encountered this situation before so really hadn't thought much about it, much less worried about it.

So is it less of an issue if you choose the more normal, or system fonts, rather than a Google or WOFF font? I'm asking out of ignorance and haven't done any A-B testing.

re: fast connection - I have DSL broadband and it is definitely not a speed demon ... and my internet connection choices are rather poor - one phone broadband provider and one cable provider - nothing else. Supposedly, it will soon change for the better - i.e. more choices and faster - but that talk has been around 10+ years. The sad part is that something may actually be done in the near future as a result of the pandemic and the local area needing greater bandwidth for both business and remote teaching. Ah, well.
jGromit

Posts: 7,627
Registered: 31-Jan-2006
Re: Story: google fonts
Posted: 23-May-2020 03:29   in response to: jret in response to: jret
Helpful
  Click to reply to this thread Reply
If your album uses only web-safe fonts, i.e., the fonts that are already installed on almost every PC and Mac in the world, there's no delay, and no problems. But those fonts are not exactly exciting or artistic. It's Arial, or Verdana, or Georgia, or Times New Roman, or.... All pretty prosaic.

A WOFF font will be reasonably quick, since it's being provided by your own server, along with the pages.

The problem with Google fonts is that you're not hosting them yourself. The page has to venture out to get the font from Google. That might be speedy, or it might be a dog. You never know.

When it comes to connection speed, I've gotten a bit spoiled. Even though I live in the boondocks, I have a very solid 110 mbps connection to the interwebs.
jret

Posts: 77
Registered: 5-Mar-2009
Re: Story: google fonts
Posted: 23-May-2020 04:08   in response to: jGromit in response to: jGromit
 
  Click to reply to this thread Reply
I'm envious ... my download speed, on a good day, is 5 or slightly above. Upload speed is typically around 0.65 - absolutely abysmal. If I could change it, I would.
jGromit

Posts: 7,627
Registered: 31-Jan-2006
Re: Story: google fonts
Posted: 23-May-2020 12:40   in response to: jret in response to: jret
 
  Click to reply to this thread Reply
jret wrote:
I'm envious ... my download speed, on a good day, is 5 or slightly above. Upload speed is typically around 0.65 - absolutely abysmal.

I get a consistent 11 mbps upload speed.

If I could change it, I would.

You're almost living "off the grid." I'm surprised you have electricity and running water. You're just going to have to move.
Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums