Image Replacement Techniques

The limitations for fonts available on the web has frustrated many web designers. With millions of awesome fonts available, the web is limited to merely a couple dozen since the font must be on the user’s computer in order to generate on the page. Faced with this font limitation, many designers resort to using graphic images to replace the text in headers and headings to jazz up a website or blog.

Unfortunately, by replacing text with an image, your page has just lost the war in maintaining web standards for accessibility. Screen readers can’t “read” the image. You would think that the read of the image’s ALT declaration would be enough, but it doesn’t quite work that way. The battle to develop a totally accessible website or blog is constantly fought between the issues of accessibility and design. The designers want it to look pretty no matter what, and the accessibility fans require the page to be seen, heard, and accessible for everyone, disabled or using a non-standard form of Internet access like on a cell phone, handheld computer, or braille reader.

Image Replacement is a method of using an image to replace text and content, specifically header information, titles, headings, and visual content, while preserving the “readability” of the page. There have been many “solutions” which turned out not to work so great. And there have been a lot of innovations, in screen reader capabilities as well as in CSS and HTML. So what is the perfect solution for image replacement?

In an attempt to find common ground and a solution, Mezzoblue’s “Revised Image Replacement” article dissects image replacement theories to try to come up with the “right” one.

The article tackles each of the currently available image replacement options, including the original Fahrner Image Replacement technique, the Radu Method, the Leahy/Langridge Method, Dwyer Method, Shea Enhancement, and more. Which one is the best? Well, that’s part of the debate. So far, the best image replacement choice is the one that you choose.

If you are considering designing your blog, website, or WordPress blog with image replacements for content and headings, take a look at the methods available and decide which one will work best for you.

Here is more information on Image Replacements.

• Your Total Site – Image Replacement Maps
• Kryogenix – Image Replacement Technique
• A List Apart – Facts and Opinion About Fahrner Image Replacement
• In Defense of Fahrner Image Replacement
• Feckless Mind – Definitive Solution to Image Replacement
• Image Replacement—No Span
• Breakdown Of CSS Image Replacement Techniques
• Is Image Replacement Really Worth It?

WordPress Image Replacement Tools

There are some WordPress Plugins which will help you replace heading text with images.

• ColdForged – Image Headlines Plugin for WordPress
• Revised Image Headlines fuer WordPress – English
• Huddled Masses – Automatic Images for Headlines

---

Technorati Tags: image, replacement, text, graphic, font, wordpress, tips, accessibility
Site Search Tags: image, replacement, text, graphic, font, wordpress, tips, accessibility