Web Design in a Nutshell, 3rd Edition

sIFR text

One of the most interesting web typography solutions to come along is sIFR, which stands for Scalable Inman Flash Replacement. It draws inspiration from the image-replacement techniques that were growing popular in CSS-based designs, but uses small Flash movies instead of bitmapped GIF, JPEG, or PNG images. The advantage is that text in Flash movies is vector-based, so it is smooth, anti-aliased, and able to resize with the page. Using a combination of CSS, JavaScript, and Flash technology, sIFR allows authors to “insert rich typography into web pages without sacrificing accessibility, search engine friendliness, or markup semantics.”

sIFR (in Version 2.0 as of this writing) was created by Mike Davidson, who built upon the original concept developed by Shaun Inman (the “I” of sIFR). Here’s how the process works (taken from the official sIFR site at http://www.mikeindustries.com/sifr).

1. A normal (X)HTML page is loaded into the browser.

2. A JavaScript function is run that first checks that Flash is installed and then looks for whatever tags, IDs, or classes you designate.

3. If Flash isn’t installed (or obviously if JavaScript is turned off), the (X)HTML page displays as normal and nothing further occurs. If Flash is installed, JavaScript traverses through the source of your page, measuring each element you’ve designated as something you’d like “sIFRed.”

4. Once measured, the script creates Flash movies of the same dimensions and overlays them on top of the original elements, pumping ...