Javascript – Alternative for SIFR

flashhtmljavascriptsifr

I wish to know if there is an efficient alternative for SIFR. We are facing performance challenges with SIFR and we wish to replace it. One option is that we just use system fonts. Can someone please provide any direction in which we can research and solve the performance issue that we are having with SIFR. Even a replacement suggestion is welcome. Thanks

Best Answer

I usually split this into 3 categories:

  • Local system fonts (what we have used for years, font-family: Arial, sans-serif;)
  • Remote system fonts (fonts linked and downloaded from the server with @font-face a.k.a. web fonts)
  • 3rd party solutions

sIFR is a 3rd party solution. So are Cufón, typeface.js, TypeKit (invite needed), TypeSelect and loads and loads of other libraries.

The main problem with remote system fonts are:

  • legal issues (hopefully the promise of WOFF (Web Open Font Format) will settle this, fx3.6 will support WOFF)
  • finding complete free fonts (with complete I mean as many glyphs as possible, usually free fonts don´t support enough glyphs to be viable, see Study of Free/Shareware Web Fonts done by Ascender Corporation)
  • You need to create a special font-file for the Internet Explorer UA called eot (Embedded OpenType)
  • Performance
  • FOUT (Flash of Unstyled Text)

Problems with 3rd party solutions might include:

  • legal issues
  • depend on JavaScript (and in some cases plug-ins like flash)
  • performance (mostly better then sIFR but still slower then local system fonts)
  • text can´t be selected and copied in some cases
  • in some cases they break the context manu
  • FOUT

The word of the web today is that Cufón is the new sIFR and that Cufón is the jQuery for fonts on the web. I however don´t like what they did in their latest releases using custom <cufon>-elements that break the validation of the document but I´m web standards puritan so my words are to be taken cum grano salis ;)