What Are The Functions Of Alt Tags In SEO
If you use images on your web pages, it’s good practice to include alt tags for all those images. Alt tags are the alternative text that’s displayed on your site while a graphic is loading or if it doesn’t load at all. They also make your site more accessible to visually impaired people who might be using text readers. And these tags are another place where you might want to include your keywords to help boost keyword frequency and improve search engine rankings. Even if your site is already content rich and that content is tagged for optimization, alt tags allow you to reinforce to reinforce your most important keywords within the context of the site content.
There is a lot of debate over how valuable alt tags actually are in search engine optimization. They have been drastically abused by some web designers who fill the alt tags with streams of keywords rather than accurate descriptions of the images they are meant to represent. But they are required for standards-based HTML web sites, and can play a small role in helping to improve your search
engine rankings. What’s more, alt tags should be used for every image on your site (even if they have no SEO value), because seeing what the image descraiptions are helps those users who might have difficulty loading your site.
An example of an alt tag might be the description of a picture of the Mona Lisa on your web site. Your alt tag, then, should look like this:
Alt=”Mona Lisa”
The alt tag usually falls at the end of the image tag. An image tag might look something like this:
<img width=”100″
height=”100″
src=”monalisa.jpg”
alt=”Mona Lisa”>
The image code breaks down like this:
<img width=”100″: The width (in pixels) of the image.
Height=”100″: The height (in pixels) of the image.
Src=”monalisa.jpg”: The source of the image file.
Alt=”Mona Lisa”>: The alternative text that’s displayed when the image is not.
One more note about alt tags: To be really effective, these tags should be used for every single image on your web site. That could become an arduous task if your site hasn’t been properly coded to start with (and depending on the number of images that you have on your site). However, the addition of these tags should be advantageous to your SEO efforts as long as you don’t overstep the unspoken boundaries of alt tags.
Alt tags in graphic links
To this point, you’ve heard that alternative text for graphics (or graphic links) should always be included in your web pages. Now is where you find out the exceptions to that rule. Alternative text, in the form of alt tags, is very useful in circumstances where visitors to your site are using text-only browsers, when those visitors have graphic capabilities turned off on their browser, or when they use screen readers to “read” your web pages to them. And that’s what makes alt tags so important.
However, if your web site features a lot of repetitive images, it might be redundant for you to use the same alt tag over and over again. What’s more, when you’re using graphics (like pictures and clip art) as links, visitors will quickly tire of seeing alt=”hyperlink”. Unless the graphics used on your page and in your links contain information that is vitally important to your web site, you can usually use one instance of a descriptive alt tag, and then for each repetitive picture, use an empty alt tag: alt=””
If you’re using alternative tags for graphic links, you can differentiate each one by using the web- site address that you’re linking to in the alt tag. However, don’t use web addresses that string on for three or four lines. Instead, use a basic web address (www.basicaddress.com). For example, Figure 6-6 shows what graphic links look like without alt text, and what both graphic links and graphics look like with alt text.
You should avoid using overly long alt tags, no matter what type of graphic you’re using them with. A good rule is that your alt tag should be no more than one line long, and if you can create effective, shorter tags, it’s that much better.
If an image on your site is strictly text- for example, a company logo that is stylized text-one way to handle it would be to create stylized text using a style sheet to suggest some particular properties through type face, size, or color. For example, using the CSS rule strong the code for your text might look like this:
{ background: #ffc none; color: #060; font-weight: normal; font- family: “Comic Sans MS”, Western, fantasy: )
The problem with creating stylized text in place of a text-only graphic is that sometimes it just doesn’t work as well. The company logo that was mentioned earlier might be acceptable in a text-only format, but only if the logo was designed that way to start with. If the logo has any graphic element to it at all, even though it is text, changing the display to a non-graphic style would cause you to lose the brand recognition that comes with the logo.
Another problem that you may run into when creating alt tags is bulleted lists that contain decorative (graphic) bullets. One way to handle alt text for bullet images is to write the tag using an asterisk or a dash to indicate each new bullet point like this:
alt=”*”
or
alt=”-“
Your other alternative is to use an alt tag that actually describes the graphic used for the bullet point:
Alt=”black musical note”
Alt tags,
whether you’re using them in graphical links or just in place of graphics, are one way for people who can’t see your images to understand your site. Many times, graphics play a large part in how your site displays. But there are times when the use of alt tags is just redundant, and in those cases, avoiding them is the best option.