TheOverAnalyzed

What started out as a simple rant about the slowness of the web morphed into a series of posts about webfonts. Be sure to check out the first and second posts on the subject.

Just Not The Same ¶

Avenir Next is the typeface currently adorning TheOverAnalyzed, at least on Apple displays. It’s not meant to be permanent. It’s a stopgap. Until my favorite webfont comes without the burden of latency, that isn’t likely to change.

A Good Point ¶

A few days ago I found myself commanding the attention of none other than Ben Thompson, who had this to say about my hasty^[1] decision to ditch webfonts:

@ToniWonKanobi @gruber @marcoarment @TheOverAnalyzed the vast majority of computers don't have Avenir installed

— Ben Thompson (@benthompson) July 16, 2015

@benthompson @gruber @marcoarment @TheOverAnalyzed It should default to whatever sans serif is there if no Avenir: http://t.co/WiLvy1Lvai

— Anthony Craig (@ToniWonKanobi) July 16, 2015

Thompson was right. In modifying my CSS to call for generic font families in lieu of my webfont of choice, I am potentially allowing fonts I never approved of to be displayed on my site (e.g., in the case of the fallback to sans serif). That’s not ideal.

My website is faster for it, but it’s not really my website anymore.

A later tweet by Thompson seemed to suggest to me that perhaps Cloud.typography webfonts were more latency-prone and less performant than competitors’ webfonts:

@ToniWonKanobi yep. Don't feel it slows my site up 97% of the time

— Ben Thompson (@benthompson) July 16, 2015

Thompson’s blog Stratechery uses the Freight Sans font family, provided by Adobe’s TypeKit webfont repository:

For Liss Is More, Casey Liss uses Lato, another TypeKit font:

Further Experimentation, Lazy Style ¶

Yesterday afternoon, I thought some more about my alternatives to Cloud.typography. I decided to do a preliminary search on ‘Hoefler’s webfonts versus Adobe’s’. The very first DuckDuckGo result was a post by Chris Bowler, who had this to say about Hoefler’s [then] newbie webfont foundry:

Overall, Typekit is a slightly easier to use service. Both offer great fonts, decent pricing, and are technically sound. The primary reason a designer would use Cloud.typography is when he/she absolutely needs to use a H&FJ font in a design. Otherwise, the options lean toward Typekit.

Bowler wrote this post in 2013, right as Hoefler was launching its webfont service.^[2]

Bowler had nothing to say about latency, probably because the service hadn’t been live long enough to properly evaluate.

In that same post, Bowler linked to three websites, all of which helped beta-test Hoefler webfonts before Cloud.typography went live: kottke.org, Rands in Repose, and SimpleBits.

And of course I checked out their source code as well.

Pay close attention to the timeline view. Look familiar? Yes, that’s latency you see, found in two of the three sites that beta-tested Hoefler webfonts. Notice anything else? There is relatively no latency for SimpleBits, which now uses TypeKit for the webfont instead of Hoefler.

Compared to TypeKit, things weren’t looking good for Cloud.typography.

A Chance Meeting ¶

A couple of days ago, a patient of mine^[3] ended up being one of those typical web design / developer / entrepreneur-types. We started talking non-dental things like iOS and OS X, and after the conversation included the typical Apple blogosphere heavyweights like Gruber and Marco, we talked a bit about webfonts.^[4] After the “exam” was completed, I went back to my office. And like any [good] aspiring web developer, I snuck a peak at his website’s source code. He was using Google Fonts.

Before the girls up front checked him out, I stopped by to pick his brain one last time. I asked him what he thought about the Google Fonts webfonts, and whether he had ever experienced any latency on uncached page loads. He said he never experienced noticeable lag, and that Google Fonts were a “no-brainer.”

A pretty clear endorsement from a professional, wouldn’t you say?

TypeKit and Google Fonts—it seems both are less latent than Cloud.typography fonts.

Results ¶

So what does this tell me? Well, for starters, it tells me that I’m not crazy. I’m not just imagining that my site was slower than everyone else’s. Also, this tells me that I’m not completely incompetent. Apparently I haven’t done anything extremely idiotic with my website design, because other websites (ones built by way smarter people than me) are equally slow to load Hoefler webfonts.

It seems that across the board, Cloud.typography has significantly more latency than TypeKit. Or, put another way: Hoefler webfonts are slower than TypeKit.

Hoefler webfonts are slower than TypeKit

And that’s too bad, because Hoefler fonts really are the best fonts. Typography shouldn’t be about WebKit rendering, or CSS wonkery, or @font-face hacks. Typography is about conveying a language. But as long as Hoefler webfonts are this latent, it will be more about those other concepts, and any language that those fonts hoped to convey will be obscured by their own sluggishness.

I can’t imagine Hoefler wants his font foundry losing out to TypeKit or Google Fonts when it comes to expediency.

Hoefler & Co. ¶

Over the past three decades, Hoefler & Co (prev. Hoefler & Frere-Jones) has been a prolific font foundry. They have acquired a rather variegated clientele, from everyone’s favorite fruit company to presidential candidates (see below). Font nerds: do yourself a solid and check out their website.

Here are some of my favorites:^[5]

These are just a few of the great fonts available from Hoefler. And unfortunately, I can’t use any of them.

Final Thoughts ¶

If it isn’t immediately obvious, I am a big fan of the Hoefler font foundry. I wrote this post because I care about using great fonts like theirs. If by some strange miracle I am able to get Hoefler’s attention, perhaps they could work on making their webfont faster?

Since finishing TheOverAnalyzed 3.0 last month, I probably view my website multiple times a day. I love seeing that logo I made in Sketch. And, up until a few days ago, I loved seeing Ideal Sans, with all its humanist influences, adorning my website. I miss it.

I hope Cloud.typography webfonts can become less latent. As soon as they are, I’ll be back. You can count on that. In the meantime, Avenir Next will have to do.