Designshift

on point: from archive 2004

What's Wrong with this Page?

January 26, 2004

The idea is for you to check a "problem page" that we've posted and see if you can tell what's wrong with it. If you'd like to give it a try, open the problem page now and after you've checked it out, come back to read our comments below.

Did you look at the problem page?

First I should mention that the issue we'll be looking at here really does occur on some websites. For example, I was speaking a few days ago with a friend about the website for his business. I hadn't seen it yet, but asked if he wanted me to check it out. He said it was something they'd put up last year partly as an experiment, to see if they might get any business from it. However, since the site had gone live there had been only one contact resulting from a Web search. When I checked the site, I realized why.

If you looked at the problem page, you might have noticed the "issue" right away as the page was loading, especially if you're on a slow connection. If not, you might have looked at the markup and seen what was wrong. Or maybe some of you took the hint from the picture of the camera.

But here's the acid test — did you try selecting any text on the page? You can't do it. It's not regular text. And that is the real problem here — what you see on the page is all just a collection of images, even the text. (By the way, you may also have noticed, if you checked the markup, that the images are all held tightly in place by a table. Table-based layout is right at home in an all-image site.)

Many average users would look at the page and not notice anything wrong at all, most of the time. It will display quite nicely in most browsers, it's readable, and the links work. Even the HTML and the CSS validate, something that still can't be said for most Web pages. So what's not to like? As it turns out, there's plenty wrong with using images to display all or most of the content. First, there are the special cases which won't affect most of us:

  • If images are turned off in the browser, or if it's a text-only browser, the user won't see very much, if anything.
  • If the user is visually impaired and using a screen reader, there won't be much content to hear.

Those are significant issues, especially for anyone concerned with accessibility on the Internet, but using images for content can also affect the rest of us much more directly:

  • Search engines can't index the text content of the page if the text content is really just an image of the text.
  • The user can't select and copy text to paste into another document.
  • The page content is much more difficult to edit and update.
  • An image of text will be a larger file size than text itself, and thus the page will take longer to download.

Is this a real-world concern? Are there websites that use images to display all their content? Certainly there aren't many, for the above very good reasons, but there are some, including some business sites. However, it is much more common for websites to use images to display some of their important content — usually because they want that content to be highlighted or shown in a special way. For example, they may want to use a special font or to combine the text with an image. Sometimes designers and clients opt for image text to guarantee the page will display exactly the way they want. They want the same kind of control that print designers have over the appearance of text in a magazine.

Unfortunately the heaviest use of image text happens to be on home pages. These home pages are basically like magazine cover pages — designed with an emphasis on graphically promoting the contents. So, on the one hand, the text is important enough to display in a special way, but on the other hand displaying it that way may lower the home page ranking in user searches because certain key words or phrases will then be missed by the search engines. This is in addition to the issues already mentioned of difficulty editing, larger file size, lowered accessibility, and so on.

Like the Designshift site, most sites tend to use images to display their business names and logos, and sometimes for simple buttons such as our "return to top", but beyond that it's a good idea to think twice about using images for text.

You may recall my friend, who complained that after one year his business had had only one contact resulting from a Web search. Everything on every page is an image. He didn't realize his site had almost nothing for search engines to use. If they'd left out the page titles, their site could have been virtually invisible.

See more on point articles in the archive.

Comments

If you have any questions or comments about what you've read here, please let us know.


Valid XHTML 1.0 Valid CSS