Fonts are an important consideration for any good site design and often convey the overall tone. Similarly, text has always been at the foundation of SEO. Web fonts and typographer are yet another place where good design practices converge with optimization. Historically, there have been few options besides the dreaded image replacement technique. However, within the last 5 years viable alternatives have emerged and good options are now available; with varying degrees of drawbacks. Let’s settle the dispute the best way we know how, with a cage match.
Let’s meet our competitors.
Weighing in at an uncompressed 16kb, the heavyweight of the event is sIFR. Born in 2005, sIFR entered the arena with big expectations and didn’t let down. Beautiful typography and SEO were now finally playing nice together. However, with Flash at it’s core, sIFR was plagued by slow rendering speeds and issues with implementation and support. SIFR was in line with progressive enhancement and thus became a tool for the SEO community looking to make friends with designers. However, as load times became a variable for search + lack of Flash support on mobile, sIFR has run out of favor with both the design and SEO community. Once a pin-up, now washed up.
A CSS-based approach to typography makes @font-face a new, strong competitor. Implementation is relatively painless, requiring only a few lines of CSS. The main drawbacks are the lack consistent cross-browser support of the various font formats and font foundry licensing. Cross-browser syntax for @font-face is well documented at this point and less a concern.
The SEO Smackdown
So let’s get to the main event.
sIFR comes out the gates swinging with full cross-browser support but quickly gets knocked back due to slow rendering times and heavy code. Cufón and @ font-face are pretty evenly matched but ease of implementation and selectable text give @font-face the upper hand.
Our Typography SEO Cage Match Winner – @font-face!