/, JavaScript/What is sIFR?

What is sIFR?

There’s a buzz spreading through the web design community like a virus. It’s called sIFR (Scalable Inman Flash Replacement). What is sIFR? Essentially, it’s a technology that replaces short passages of plain browser text with text rendered in the typeface of your choice, regardless of whether or not your users have that font installed on their systems.

It accomplishes this by using a combination of javascript, CSS, and Flash. Here is the entire process:

1. A normal (X)HTML page is loaded into the browser.
2. A javascript function is run which 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 the original browser text in as a Flash variable.
5. Actionscript inside of each Flash file then draws that text in your chosen typeface at a 6 point size and scales it up until it fits snugly inside the Flash movie.

It sounds a little too good to be true, yet it’s the breakthrough all designers and creative have been waiting for as it makes the display of vibrant text possible even in cases where you have no idea what the end users system capabilities are. The best part is text remains parsible the sIFR developers explain….

sIFR is fully accessible to screenreaders and other assistive technology. Don’t take our word for it……The knee-jerk reaction of some people whenever they see Flash is that it must be inaccessible because it’s Flash. What we’ve done with sIFR, however, is turn that model completely on its head. Your (X)HTML document is still the exact same document it was before sIFR kicked in. Your code is untouched and sIFR is completely abstracted to the javascript layer; therefore, your accessibility, your search engine friendliness, and your semantics are the same as they were before the day you decided you like nice fonts.

sIFR stands poised to revolutionize the way we think about design and typography on the web. what happens when text is no longer restricted to W3C universal fontypes? What happens when the visual becomes the markup instead of developers marking up the visual? Things start to look WAYYY better, that’s what and it’s one of the first steps towads Web 3.0 in the design community. So what about if users have javascript turned off in their browser?

sIFR snaps right in and lifts right out. This is an important point. Making the decision to use sIFR is often just a question of adding a .js include to your site, uploading a .swf and some .css files to your server, tuning your fonts, and that’s it. It generally doesn’t require any wholesale code or design changes, and should you decide at some point in the future that you don’t want to use it, simply remove the .js file and you’re back to browser text.

Needless to say sIFR is pretty incredible. You can read more about this new technology from the developers site at http://mikeindustries.com

2010-05-19T22:33:01+00:00 May 28th, 2008|General, JavaScript|0 Comments

About the Author:

Leave A Comment