Search Engine Optimization Vol. 2: Image ALT Tags
Common Cases
There are several common cases where using ALT tags will help your search engine rankings. In the day of websites designed by graphic designers, websites are more and more graphically based. It is sometimes impossible to achieve design intent without using graphics and sometimes this even means using graphical text.Graphical Text/Headings
All maintenance issues aside, graphical text can be a graphic designer’s best friend. Since the web has a very limited selection of typefaces that can be rendered across all platforms/browsers and some people will never be happy with a logo designed using the Verdana font, graphical text is the only way for a designer to use any font outside of the 4 primary “web” fonts within their designs.
So, you’ve designed a website and rather than using plain-text headlines on the top of your pages you’ve decided to use graphical text so you can use that nice Universe Condensed typeface that you love so much. The first thing you notice is that you’re not getting much search engine traffic to your content pages and you wonder why. The answer is simple; your headline is usually full of keywords related to your page and in your case it’s all graphical and there’s no alt tag, so it’s invisible to the spider. Not to fear, that’s what the alt attribute is for. Simple set the alt attribute of the image to be the same as the text that is rendered into the graphic.
So, if you have a headline that looks like this:
Your <img> tag should look like this:
Simple enough? I thought so.
Graphical Page Headers
Another common case are graphical page headers. Even if you don’t know them by name, you’ve seen them. They’re the large masthead graphics that take up the top of nearly every page on the internet. Some of them are sliced up and have alt tags applied to their images, but still others are just large, search-engine-ignored space wasters.
If you have a large graphical header on your website and it contains any text or logos, it’s very important that the alt attribute be filled in so the search engine recognizes that important content and doesn’t skip it. Even if you’re using image maps for your header, the <MAP> tag also has an ALT attribute, so you can use alt tags on your image maps as well, which allows you to have a single image several alt tags if necessary.
Informational Graphics
As I mentioned earlier, it’s sometimes necessary to use graphics for otherwise text-based content. For example:
This graphic only contains one image and the rest is text. However, the font being used in the graphic is not a web-standard typeface and therefore I must use a graphic. In this case, my tag looks like this:
Pages: Previous | Next ( 1 2 3 )
Leave a Reply
The opinions expressed by individuals posting in the Summersault Weblog are not necessarily those of Summersault, LLC. While we try to insure the quality and accuracy of the information presented here, we make no guarantees about its suitability for any particular purpose.
