FIR stands for Fahrner Image Replacement named after Todd Fahrner.
It is a standard compliant technique in which <h1> and <span> tags are used to have nice headings and highlights.
Key fact in this technique is that the text will get displayed even if the CSS is disabled for some reason, hence presenting the text beneath it.
Sample CSS in HTML context
<h1 id="myheading"> <span id="mytext">Kurinchi Blogger</span> </h1>
CSS Definition
myheading{background: transparent url(images/logo.gif) no-repeat scroll left top; display:block; float: left; width: 200px; height: 65px;}
#myheading #mytext{display: none;}
To test various possibilities in Firefox browser …
1) Disable CSS, Enable Images: View > Page style > No style
Now check the page where FIR is applied by refreshing the page.
2) Enable CSS, Disable Images: Tools > options > content > UNCHECK “Load images automatically”
Now check the page where FIR is applied by refreshing the page and the text will not get displayed in this case.
Check Zen Garden website to see how FIR is used.
FIR behaved indifferently when in quirksmode and rendered ineffective in screen readers which brought in questions about the usage of this technique.
sFIR technique supersedes FIR technique with its Flash replacement on text rendering styled texts.
Tags: CSS, Fahrner Image Replacement, FIR, quirksmode, sIFR
[...] Key fact in this technique is that the text will get displayed even if the CSS is disabled for some reason, hence presenting the text on browsers and in screen readers. Read more [...]