skip to main content

TAMU Webmaster's Blog


Information and insight from the A&M Webmasters

Helping search engine robots see your images

February 2nd, 2009 by mdmcginnis

It’s not surprising that Google’s list of best practices for Web images say nothing about the images themselves, but only about what to call them and how to label them. After all, the Googlebot that indexes your website can’t see images. It probably is your most frequent blind visitor. (Another reason to make your website accessible to the blind – it helps sighted visitors find you).

Though search engines can’t index the text inside an image, they often index the images themselves. Google Image Search depends on your filenames and alt attributes, as well as page content, to determine what an image is. Simply adding alt text can give your image high rankings. Most webmasters never think about getting better rankings in image searches, which is a good reason why you might want to.

Make every word count. Spammers often try to stuff keywords into alt attributes and even file names. But adding too many extra words dilutes the power of the important ones. Making image text short but descriptive means it can be optimized for search engines.

Optimize your image filenames.
Since text is the only part that search engines can see, that’s what you optimize for when it comes to images. Do your filenames tell visitors anything about your images? Filenames need to be short but descriptive. I’m not saying that images should be named, “this-is-a-picture-of-a-gall-wasp-larva-collected-in-southern-Indiana.jpg”. But nobody can guess what “image1.jpg” or “picture.gif” looks like, just from the filename. If you have thousands of images, see if you can automate the process of giving them accurate names and descriptions.

Include descriptive alt attributes for (almost) every image. That is, your HTML code could say something like, <img src=”sweet-potato-patch.jpg” alt=”sweet potato demonstration garden, Texas A&M University”>. Including alt attributes for images is one of the most basic steps in accessibility. It’s also a State of Texas requirement. If you omit alt attributes, screen readers and search engines will have no idea what the image is.

If there’s nothing to say about the image, say nothing at all. The only time you wouldn’t include descriptive alt attributes would be for transparent gifs or decorative bullets that have no meaning if you can’t see them. Come to think of it, alt=”” is quite descriptive if you’re talking about transparent images! If the image is merely decorative, your HTML code might be <img src=”glyph.gif” alt=” “> instead of alt=”curly list separator”. That means that screen reader users don’t have to listen to “curly list separator” over and over.

Write alt attributes as if they were anchor text. In fact, if you use an image as a link, Google treats the alt attribute similarly to anchor text; that is, Google treats it with respect. It assumes that the alt text describes the page that the image links to. This doesn’t mean that you should use images as your main navigation, though, because text is still more accessible.

Use common file types. Most browsers can handle JPG, GIF, and PNG images. It helps if the extension of your filename matches the file type. On the Web, JPG images are most common for photographs. JPGs are compressed by eliminating colors and other information that are least noticeable to the eye. The GIF format is more efficient for simpler images such as line drawings, with few colors, such as illustrations and logos. PNG is a newer, more open standard. Like GIFs, PNGs can have transparent colors, but unlike GIFs, PNGs can’t be animated. That may be a good thing, though.

Consider storing all your images in a single directory. How about calling it “images”? Google specifically suggests this, so it must help them index your site better. You will end up with a simpler directory structure if your images aren’t spread out across your server.

Don’t depend on images to make your Web page. Designers love images because they make the page predictable. I’ve seen Web pages that were nothing but one beautiful, clickable image map. Today CSS allows designers to create beautiful menus with text alone. That makes their pages load faster. Text will remain easier to use as long as search engines can’t read images, and until we have cell phones with 18 inch screens.

Next in our series on search engine optimization: controlling non-human website visitors with robots.txt.

Monday, February 2nd, 2009 Search
Share this article

No comments yet.

Leave a comment

Categories

Archives