[BNM] CSS image replacement techniques (H1s etc)

James Wragg james.wragg at gmail.com
Tue Dec 13 17:09:36 GMT 2005

On 12/13/05, Nick Sayers <mail at nicksayers.com> wrote:
> I want to use some GIFs as headlines (H1s etc) in my XHTML. I was going to
> use the well-known Fahrner Image Replacement technique, but this seems to
> have been discredited lately:
> What techniques do BNMers use these days? Any recommendations?

I use spans either side of the text, and use a "position:absolute" on
the content to pull it off the side of the screen (e.g. left:
-10000px), leaving the background image of the block to show through.
Screen readers will read the text using this method opposed to
"display: none".

Alternativley use sIFR - http://www.mikeindustries.com/blog/archive/2004/08/sifr

Although it doesn't resize the text on the fly (you have to scale the
text up then refresh the page), which is probably not an issue if you
browse with large text anyway..


More information about the BNMList mailing list
BNMList is hosted by Screenlists, a Screen-Play.net service