Replacing Images with Text

June 5, 2007

Topics: Usability, Web Development.

Shari Thurow, a regular on the search marketing speaking circuit, just published an article in the ClickZ network addressing three SEO Myths and Misconceptions. Although the article is generally pretty decent, I do take some issue with how she addresses one area — the question of replacing images with text.

In fact, my complaint is with what I perceive to be the basic assumption she’s making in this SEO Myth: that web developers and marketers are recommending that web sites replace graphic images with CSS-styled text.

I don’t know anybody in search marketing, usability or accessibility who routinely recommends this as a default method. I can’t honestly say that I’ve even heard this specifically recommended in passing. As an occasional recommendation following testing? Sure. As a matter of routine? No.

I have, however, frequently heard people recommend replacing text images with CSS-styled text. I have routinely recommended this myself. There are certainly cases where a text image with appropriate an appropriate alt attribute is perfectly suitable or even preferable. However, I will pretty well always recommend styling text instead of producing it in an image.

But I understand the term “graphic image” rather differently. A “graphic” is a creative product: it conveys meaning through more than just text, and absolutely has value in design beyond what can necessarily be made available with pure text. I’m not about to recommend that every image in any site be replaced by text — that’s ridiculous.

There are many, many ways of replacing images with text. The only limitation in the result is the creativity of the developer. If the text is significant, it’s well worth while to make it real text instead of an image. If the image is itself a critical creative, then you can still use image replacement to supply the full text in code while visually providing the image.

But if it’s a picture of your Mom, just use the picture.

Have something to contribute?




« Read my Comment Policy

5 Comments to “Replacing Images with Text”

  1. Shari is simply saying that, through her testing process, she’s found that a mixture of text and graphics provides the best website performance.

  2. I agree with Joe but cannot say I actually agree or disagree with Shari because I do not understand her post at all. Can someone please explain it simply to me??

    btw I hope you do not take offense Shari :worried-look:

  3. Well, I can’t claim to be surprised by the disagreement — and, of course, I don’t take it personally.

    Usability testing, I know, can reveal surprising results where “expectation” really gets turned upside-down. This is a fact.

    That font/typeface limitation does get frustrating from both a typographic clarity and design perspective; even disregarding usability issues.

    Thanks for your comments! I’m glad to have your view represented here.

  4. Well Joe-

    I am going to disagree with you, of course. In the course of testing, it’s really easy to figure out that users click on one font/typeface over another in a text element. If the font/typeface is not a commonly installed one on the majority of computers, I am going to use a graphic image instead of CSS-formatted text. Plus I’ve seen what happens when people override CSS formatting. The text becomes illegible, and that violates the first rule of Web design (easy to read). Making some items into graphic images addresses those issues.

    Now if you (and many other SEO professionals and Web developers) actually did usability tests for a living, you would probably come to those same conclusions. Sites can use both graphic images and CSS-formatted text links and perform better or equally well as sites that only use CSS-formatted text links. It’s the lack of testing experience and knowledge about how search engines handle boilerplate elements that makes these conclusions inaccurate.

    Your conclusion is inaccurate. Please do not take my disagreement personally. I’ve tested this for my goodness, 10 years. A combination graphic images and CSS-formatted text links (yes, navigational elements as graphic images) consistently performs better…considerably better.

  5. Yes correct. If you are using a image which contains such a simple TEXT then it suits well to replace it with CSS