SiteProNews: 06/18/03 Feature Article

To Print: Click here or Select File/ Print from your Browser Menu.


  Article printed from SiteProNews: http://www.sitepronews.com
  HTML version available at: http://www.sitepronews.com/archives.html
Improve Your Web Site Through The Proper Use of Heading Tags, 
Alt Tags & Title Attributes
by Richard Zwicky ©Copyright 2003

Improved web design and search engine performance all in one 
easy step! Believe it or not, it is possible, easy, and really
straightforward. There are 3 extremely useful tags and attributes 
that most people overlook, or do not take advantage of properly. 
These are alt tags, title attributes in links and heading tags.

The reason you want to spend some time focusing on these 3 facets 
of your web site is simple. Two of them make the web site easier 
to understand and navigate, for people and the search engines. 
The third one is much cleaner than the <font size= > tags, and 
works really well for key phrases and terms within the search 
engines. This article deals with the merits and value of each of 
these mostly misused, or ignored opportunities.


ALT TAGS

The first opportunity is the one that is most often used, and 
misused: The alt tag. Alt tags are comments that should be used
whenever you add a graphic, or image to a web page. Pictures 
are worth a thousand words to you and me, but zero to a search 
engine. An alt tag should be a little bit of short, descriptive 
text which helps any user (and search engine) understand what 
the reference is pointing to. If you are not aware of what an 
alt tag looks like, here's an example:

<a href="http://www.metamend.com/">
<img src="http://www.metamend.com/images/28x28_roundw.gif" 
width="28" height="28" alt="Metamend Search Engine Optimization 
Service" border="0"></a>

The code to make this banner appear is as follows:

<a href="http://www.metamend.com/">
<img src="http://www.metamend.com/images/28x28_roundw.gif" 
width="28" height="28" alt="Metamend Search Engine Optimization 
Service" border="0"></a>

When you move your mouse over the graphic, words appear. The 
words tell people what the graphic refers to, what it is about, 
and where it leads to. Internally, if you had a hardware store, 
you could use an image of a power tool link to a "tools" 
section, with the words "Tools & Power Tools" in the alt tag. 
It may be obvious, but most people don't take advantage of this 
opportunity. Most people don't even have alt tags attached to 
their images, or have alt tags that look like this - alt="" - not 
much good, they're blank. That's all the search engines, and 
some old web browsers will see - blank space.

Alt tags also afford you an opportunity to give the search 
engines more meaningful content to work with. If you have a 
graphics rich web site, there's very little to no text for the 
search engine spiders to use to analyze your site. If you attach 
a relevant alt tag to each image however, the search engines 
will read them as your textual content, and your web site will 
show up in relevant searches. Even if your website is content 
rich, the alt tags allow you to reinforce what is highly 
important, the key terms, within the content. Here's the key 
- use relevant terms. Don't just put "About Us". Use descriptive 
key terms, such as  "About Acme Power Tools".  


HEADING TAGS

Next, we have the Heading tags. Often, when web designers are 
building pages they use <b> tags, and <font size=  >  to 
emphasize the page heading, and subheadings for each section. 
Whenever you get the chance, use <h> tags instead. There are 5 
different <h> tags. The largest - <h1> & <h2> - should be used 
for the major title on each page, and then the next three 
- <h3>, <h4> & <h5> - for subheadings. The smallest, <h5>, will 
look just like regular <b> bold text on a page.  

So why use them? The single most important reason to use these, 
aside from consistency of output, is for the search engines. The 
search engines weight different text within a page differently. 
We have found that terms used in <h> tags are weighted heavier 
than regular text. This doesn't happen with the <font size= > 
attribute. The larger the <h> text is (1 being largest, and 5 
smallest size), the more weighty or important the key terms in 
the heading are viewed as being with respect to the overall 
document. Use the terms in these tags judiciously. Especially in 
the larger sizes. The search engines give these <h> tags weight, 
because logically, the header for a page, and for each section 
of a page conveys the concept of what the entire document's focus 
is oriented towards. For this reason be very sure that you only 
use terms which  you intend the web page to be found by.


TITLE ATTRIBUTE

Different from a <title> tag, this piece of code really should 
be used by everybody, without exception, just for the sake of
being courteous. An example of a title attribute looks like this:

<a href="http://www.sitepronews.com" title="SiteProNews - 
Webmaster Articles and Resources">SiteProNews</a>

Note the title="..." segment in the hyperlink. Most people never 
use this attribute. The reason you should use it is simple: It's
there for the blind. Text to speech browsers read the title 
attributes aloud, so that people who cannot see can still know 
what the page being linked to is about. If you are linking to 
a web page about John Deere Tractors, have your title attribute 
in the link say so.  

Using this attribute also has the benefit of adding search 
engine related content. After all, the terms you use will be 
highly relevant and specific; you have just added one more 
instance of them to the page. Plus, it's one more thing in the 
design of the web site that will have been done right from the 
perspective of the search engines. The search engines look 
favorably on web sites that have taken the time to get all the 
details right. This simple addition to your web page may do 
little, or it may give your web site the push it needs to move 
to the next level in search results.


IN SUMMARY

The three features discussed in this article are all simple and 
easy to implement throughout a web site. If you only do one 
thing, make sure it's the title attribute: Anyone who is sight 
impaired will thank you. Getting all three right will help make 
your web site stand out, and your work stand out as that of a 
good web designer. They will also contribute to better search 
engine performance for your web site.  

================================================================
Richard Zwicky is a founder and the CEO of Metamend Software,  
(http://www.metamend.com) a Victoria B.C. based firm whose 
cutting edge Search Engine Optimization software has been 
recognized around the world as a leader in its field. Employing 
a staff of 10, the firm's business comes from around the world, 
with clients from every continent. Most recently the company was
recognized for their geo-locational, or LBS technology, which 
correlates online businesses with their physical locations. 
================================================================

Copyright © 2003 Jayde Online, Inc.  All Rights Reserved.

SiteProNews is a registered service mark of Jayde Online, Inc.