Styling the abbr Tag
December 19th, 2008There are several ways that CSS can work along with SEO. Today, I’ll cover one quick option: styling the abbr tag.
Say, for instance, you have a link that states that your site is valid XHTML. Well, inside of the link use the abbr tag around the word XHTML. Inside of the abbr tag you use the title attribute to fill in what the word is an abbreviation for. When a search engine crawls your site, they not only come across your abbreviation, but also the value you’ve put in for the title. When hovered over, the title creates a tool-tip. By default the abbreviation will have a line below it. However, if you don’t want the line used, you would use this declaration in the CSS:
abbr{border:none;}
(For simplicity sake, I’m using an inline style here. Because I have the abbr styled in my CSS, I had to override it by manually inserting what the browser does by default:)
Without the style:
Valid XHTML
With the style:
Valid XHTML
See the difference? It’s quick but handy. Alternatively, you could use a different border or another style if you wanted to.










