Why I hate sIFR

There is no way to be polite about this, so I’m not even going to try: I hate “sIFR”:http://www.mikeindustries.com/sifr/ with a passion, and I think it should die.
I know that it probably gives some designers orgasms, I know that these designers care about typography. I know that you think sIFR is accessible. I’ve got a surprise for you: *It’s not.* Some of you may also think that it offers usability improvements. Another surprise: *It doesn’t.*


h3. Keyboard navigation
While some people may prefer using the mouse for navigating their way around documents, not everyone does.
I frequently navigate my way around documents by using the keyboard. You see, I use this nifty browser named “Opera”:http://www.opera.com/, that allows me to move between document links using the Q and A headings using the W and S keys, and I can move between arbitary document elements using E and D. When you navigate by keyboard this way, Opera selects whatever text you have just moved to. This text selection works as an important placeholder, since you will want a visual clue of where you are when you don’t use a pointing device.
sIFR breaks that, so you end up accessing something you can’t see. *Inaccessible, and unusable.*
h3. Mouse selection
Guess what. Even if I am a keyboard user, I also have a mouse, and I frequently use it to select text. Yes, if you write interesting stuff, I will want to quote it. sIFR prevents me from doing that in any useful way.
If I start text selection outside of the little, replaced Flash object, I, again, don’t actually see what I’m selecting when my selection begins before and ends after the Flash object. Which always makes me wonder: “What did it select”. *This is, unsurprisingly, unusable.*
What’s worse, though, is if I, God forbid, want to actually start my selection with a heading. I then get a visual clue that I’m selecting something with my mouse, but since it’s the Flash object that now has focus, I can’t select past the end of the object. I first have to copy the Flash text, go paste it wherever I want, and I then have to go back to the document, and copy the rest of the text I want to paste. *This is, even more unsurprisingly, totally unusable.*
h3. Zoom
Here’s another surprise: Not everyone uses the same font sizes as you do. When I was still in university, one of my fellow students had vision problems. She was not blind, but she was dependent on assistive technology, and she _did not use a screen reader._
In fact, she managed quite well with the zoom facility of her browser (again, Opera), surfing at something like 500% zoom.
Guess what: sIFR breaks that. sIFR-replaced text is *totally inaccessible if you are dependent on zooming pages.* The simple reason for this is that in your oh-so-holy quest for “orgasm-inducing typography”, you are using _bitmap fonts,_ which unlike normal fonts won’t zoom when you use Opera to zoom a page. Flash bitmaps stay at the same fixed size.
*Utterly, totally inaccessible*
Here’s another surprise for you: Not everyone that uses Opera’s zoom feature, or Firefox’s font sizing is blind. I have a high-quality monitor from Eizo. It’s a CRT, which means I can change my resolution to something sensible, and I’m running 1440×1080 on a 17″ screen. I could have used an ever higher resolution. Because of this, I frequently zoom pages, often to the 180-200% range, so I can run my browser full-screen, and just lean a bit back to read.
Everything on my screen looks nice, from the images that are resized, to the text that’s in a size I can easily read. Even regular Flash applications zoom, so that if I decide to play a Flash game, I get it at a size I feel comfortable with.
There is one exception to that everything: sIFR-“enhanced” text. It stays at the same size. While I can still read it, it breaks all that nice typography and layout, and the carefully designed page now looks unusually ugly.
So: use text to display text. Not Flash.

16 Comments

  1. Hey, you didn’t even mention it generates DOM elements which are invalid!

  2. Mark: I hadn’t even bothered to actually check what it does to my DOM elements. Knowing that sIFR creates a horrible user experience is more than reason enough to hate it.

  3. *gasp* You Can Mute Sound From Flash?!?!? – Proclaiming that You *Hate* Standards

    I’ve just been reading a couple of posts by Virtuelvis. Apparently there’s an app that runs in the background that can make sure you never have to endure the shocking terror that is flash-embedded-music. I honestly tend to jump whenever…

  4. Also, don’t forget that Flash is responsible for the death of millions of children in Uganda as well as a major source of nuclear radiation. If it is not stopped, we could all be dead by the year 2006.

  5. Oh, I almost forgot… the way for you to stop yourself from being horribly tortured like this is to not install Flash or simply prevent the loading of sifr.js. Or maybe even stop using a computer. 🙂

  6. Mike D., while I normally delete off-topic comments, flames, ad hominems, appeal to spite, and any other “logical fallacy”:http://fallacyfiles.org/ you may find it neccesary to resort to, I am going to let yours stand.
    Mostly because both of your comments goes a long way to demonstrate why I have problems with it: sIFR does have accessibility problems. It does have usability problems, and the only way to “solve” said problems is for users to either disable functionality in their browser, or to actively disable sIFR on sites where it can recognize it, using extensions/user scripting.
    Your “solution” is only a solution for the 1% of the users who are technically savvy enough to actually do this. The rest will have to rely on pure luck to be able to access documents on the web. That is not the web I want.

  7. Hey, I got a great upgrade for sifr.js for you, Mike! It lets you use whatever typeface you want, works in all browsers, even degrades gracefully in text/speech browsers. It doesn’t require Flash, or any plugins at all for that matter. in fact, you can even ditch the whole sifr.js file! Check this out!
    bc.
    It’s a dynamically generated image with alt-text fallback. Man, my brain hurts after thinking that one up.
    Cool, eh?
    Get code here

  8. ghola

     /  2005-04-29

    Thank you for saying all that, with detailed arguments.
    I bumped into some of the usability problems you mention (text selection). I’m not blind or anything.
    sIFR definitely generates usability problems.

  9. Ok, so here’s the thing: I don’t object to people saying things like “I don’t like the fact that visual cues on text selection with sIFR are a bit weird” or “When I use the W and S on sIFR headings in Opera, it actually does work, except I wish the text were highlighted”, but the amount of anger, confusion, and hyperbole in your post is just unnecessary to me… that’s all. If you want to say that sIFR has certain shortcomings which you don’t like, fine, you’ll get no argument from me. But if you instead want to get on a soapbox with a megaphone and proclaim that sIFR is inaccessible, then I have to call you on that.
    Let’s examine your post:
    1. First of all, lets figure out what audience we’re talking about. Opera, which if I’m generous, I’ll give a 1% browser share. Fine, I don’t particularly like Opera but I’m not going to denigrate it because of its browser share. Version 8 is a fine browser. Then, we’re talking about people who use keys like W and S to navigate. Again, let’s be extremely generous and say that 10% of all Opera users actually do this (or even know about it). Again, 10% is extremely generous, but I’m fine with it. Ok, so your entire post is related to, generously, 0.1% of the world. That’s not to say this 0.1% are a bunch of unimportant people… they’re not. I just want to properly frame what portion of the general world audience we’re talking about here.
    2. Now let’s look at some of your statements:
    bq. I know that you think sIFR is accessible. I’ve got a surprise for you: It’s not.
    I suggest you look up the definition of accessible. It doesn’t mean “selectable” and it doesn’t mean “able to use certain things Opera has put into their browser”. It means readable/usable by people both with and without disabilities. sIFR is perfectly usable by people both with and without disabilities, and therefore it is accessible. If you don’t like certain quirks of it, that means “you don’t like certain quirks of it”… it doesn’t mean it’s “inaccessible”.
    bq. sIFR breaks that (navigating by keyboard and pre-selecting the text), so you end up accessing something you can’t see. Inaccessible, and unusable.
    sIFR *does* respect the very keyboard shortcuts you mention. Why? Because it doesn’t touch your HTML. I assume this was one of the first things you checked because you figured it would break… but it didn’t. So instead, you had to resort to complaining that although it works, the text isn’t automatically selected for you. Again, I don’t see how this has anything to do with accessibility or usability. It works.
    bq. Yes, if you write interesting stuff, I will want to quote it. sIFR prevents me from doing that in any useful way.
    Wrong again. Best practices say not to use sIFR on paragraphs of text. Generally, paragraphs of text are what people like to quote. Select-All also works. As does drag-selecting. You are complaining about an edge-case which actually does work although the visual feedback is less than ideal… and again, if you’d just *point this out* without making it sound like a world-ending problem, I’d agree with you.
    bq. sIFR-replaced text is totally inaccessible if you are dependent on zooming pages. The simple reason for this is that in your oh-so-holy quest for “orgasm-inducing typography”, you are using bitmap fonts, which unlike normal fonts won’t zoom when you use Opera to zoom a page.
    Probably the most incorrect statement of the entire post and again, I love the use of the term “totally inaccessible”. TOTALLY INACCESSIBLE! Run for the hills! sIFR does *not* use bitmap fonts… it uses vector fonts. Opera, on the other hand, *does* use bitmap fonts… only difference being that it physically re-renders the bitmaps when a page is zoomed. sIFR text, when zoomed in Opera is perfectly readable and perfectly accessible but it falls victim to the same thing that every other non-text element does in Opera: pixel interpolation. Again, this just isn’t anything close to a showstopper in my book.
    —-
    So anyway Arve… to sum up… a lot of the things you bring up are indeed “minor quirks” which affect a tiny sliver of the population and were your statement worded more diplomatically, I’d be the first to chime in and say “Yep, you’re right about some of that stuff.” But unfortunately, I think hyperbole reduces your message to “shouting for the sake of shouting” and that sort of stuff generally doesn’t mean much. I humbly suggest that there are more important things to “hate with a passion” that sIFR, Flash, HTML, CSS, or anything else on the web.

  10. Mike D., I second your examination of the post. But I have to pose another question, here… First of all, yes, this is a problem that is affecting .1% of the browser population, and that is with generous guesstimates. (Yes, I too believe that even .1% is important, but…)
    On top of this already small sliver of users, how many view websites that actually USE sIFR? And of this even tinier cross-section, of those few that use Opera that visit sIFR sites, how many have regular need to select and copypaste text?
    Really, if it’s a problem, then I cannot possibly imagine that it is a recurring one. I don’t mean to be callous, but seriously, just deal with it. There’s no using the internet without encountering this or that website that does something to your disliking. You can be tough enough to deal with a little sIFR on the few occassions that it’s a problem. 🙂
    As webdesigners, what we can do is design the things we like to see, and hopefully, if visitors like them they will take the cue. But designers don’t always see eye to eye, and it is inevitable that some will use tools to create that may be to your distaste.
    I *hate* to paint, but I can respect a beautiful painting.

  11. bq. sIFR does respect the very keyboard shortcuts you mention. Why? Because it doesn’t touch your HTML. I assume this was one of the first things you checked because you figured it would break… but it didn’t. So instead, you had to resort to complaining that although it works, the text isn’t automatically selected for you. Again, I don’t see how this has anything to do with accessibility or usability. It works.
    I don’t know what your idea of usability is, but my usability is affected. I only just learned that the text actually is selected (and a few tests following that showed that the selecting is quite a random matter). To me, that’s a significant usability degradation.
    Don’t get me wrong, sIFR is a lot better than everything else for the same purpose and I can most certainly see the usefulness of it, but usability is most certainly affected.

  12. You’re forgetting the use case for sIFR. It’s probably not something you will ever have to use, depending on the type of work you are doing. No one is saying use it on your blog for a couple of thousand hits a day – that would be mad.
    Mike developed sIFR for sites counting millions of page views a day, where there was a requirement for a custom typeface on headings. In that situation you will not find a better solution than sIFR. Period.

  13. Couple of points, and since it’s late I’ll make them as incomprehensible as possible.
    1) Regarding percentages of users of certain browsers. Let’s not forget that we all fight the good fight when we declare support for the underdogs. It was an underdog named Firefox who not long ago started eating away, percentile by percentile, at the dominance of IE. Opera has been doing this for a lot longer and helped introduce tabbed browsing before Firefox was even a Phoenix. That “0.1% of the world” helped to popularize alternative browsers. Don’t turn a blind eye to them just because their numbers are small. Would you say the same thing if this was an issue in Firefox (currently with
    | |sIFR|Orca|
    |cacheable by the browser|no|no|
    |selectable text|yes|no|
    |need flash to customize|yes|no|
    |need js knowledge to customize|yes|no|
    |need server-side language on server|no|yes|
    |need scripting knowledge to customize|yes|yes|
    |need special php modules|no|yes[1]|
    |need fonts installed on server|no|yes|
    |browser shows focus rectangle|no|yes|
    |zoomable in Opera|no|yes|
    |zoomable in IE|no|no|
    |zoomable in Firefox|no|no[2]|
    |degrades gracefully in unsupported browsers|yes|n/a|
    |meets accessibility standards|yes|yes[3]|

    fn1. Requires GD 2.0.8+ or bundled equivalent
    fn2. I’m sure there’s a firefox extension for zooming images, but it’s not included as a deliverable
    fn3. Assuming the page author adds the proper alt text. The script only delivers the image from what I can tell (the link is 404’d but going to the PHP section of the website gives you a link to the Auto-trim Text to Image code, which is what Orca linked to)

    So, the real decision comes down to what’s available to the user. If you have access to a server with the proper modules and the required font, then go for the image replacement. If not, then sIFR works great and is easy to install with only FTP access to the server.
    4.) As noted above, if you were to use a different image-replacement technique, the images wouldn’t zoom in IE or Firefox without separate plugins.
    5.) Most of the real problems here are related to Flash, not the sIFR technique itself. We can hope that the next release of Flash will address these issues. But there’s no reason to not push the envelope until then. It’s often these initiatives that bring light to the shortcomings of a product like Flash and give the developers a reason to address them.
    The end.

  14. grrr. you’re comment form is busted…

  15. It likely has to do with the table you pasted. I’ll look into it.

  16. Arve, thank you for an interesting article. The problem I ran into with sifr is that it does not zoom with the rest of the text when using Mozilla (CTRL + mouse wheel). This is not “just a quirk”, it is an accessibility problem. By using sifr, you are sacrificing some accessibility. However, you get cool headlines, no doubt.
    Chris Bloom, thank you for the side-by-side comparison. The last one you mention, “meets accessibility standards”, what standards are you referring to?