Web Development

General discussion

Gravatar
0 Votes
Locked

Using the Fahrner Image Replacement technique

By MaryWeilage Editor ·
This week's Design and Usability Tactics e-newsletter describes using the Fahrner Image Replacement (FIR) technique to punch up headings. Do you agree with author Michael Meadhra that FIR is the best technique available to solve the problem of sprucing up text headings? Have you used the FIR technique in your designs? If so, what are your impressions of this technique?

If you aren't subscribed to the Design and Usability Tactics TechMail, visit our e-newsletter subcenter to subscribe to this free e-newsletter:
http://nl.com.com/MiniFormHandler?brand=bu ilder&subs_channel=bldr_front_door&list_id=e614& tag=fb

* Please delete any extra spaces that appear when you paste this link into your browser.

This conversation is currently closed to new comments.

Thread display: Collapse - | Expand +

All Comments

gravatar
Collapse -

simple javascript enhancement

by alexcohn In reply to Using the Fahrner Image R ...

The FIR technique and its derivations remain an incomplete and somewhat flawed solution to the challenge of providing visually stimulating headings, but two lines of JavaScript can come to resque:

function image_loaded()
{
window.event.srcElement.style.display="inline"
window.event.srcElement.parentElement.children(1).style.marginLeft="-100em"
}

here we assume that the colorful headings are structured as follows:

<h1><img onload="image_loaded()" style="display:none" src="colorful title.gif" alt="" align=left><span>title text</span></h1>

The code above uses the FIR trick only if the image is not available. Unfortunately, on Netscape the onLoad() event is not reliable and further wicked tricks should be performed to support Netscape gracefully.

Back to Web Development Forum

Start or search

Related Discussions

Related Forums