Rubenerd

There was a CSS statement that was very much in vogue a few years ago, and we're still dealing with vestiges of it today:

-webkit-font-smoothing: antialiased;

It was (ab)used in a misguided attempt to render thinner fonts, but all it did was lower their effective resolution. When you start messing with how an operating system renders fonts, you get into serious accessibility (and aesthetic) problems.

I was reminded of this today. Compare this screenshot from Twilio.com, taken with Safari (ala Webkit) and Firefox on my non–retina desktop monitor. No prizes for guessing which is which.

Using lighter font weights is fine, provided you can still make out the shapes. Using a narrow, poorly defined font with thin weight and abusing the webkit-font-smoothing property is a bad typeface trifecta.

If you ever find yourself asking "should I use this CSS property?", the answer is no. Ditto infinite scrolling, but that's for another post.