Recently in SEO Category

May 31, 2008

Although our sites have been concerned with SEO to a small extent for a while, there has only recently been a push to educate our site managers with deeper knowledge of what needs to be done to put their sites on top. One of the biggest and simplest things that can be done is to take another look at the headers and determine whether or not they can be read by search engines.

Using graphic headers has been criticized by a lot of usability experts because of the inability for search engines and screen readers to see images. If you add your graphics into your page in the right way, though, you can have your graphic branding and also be seen by every user out there, no matter how they see the web.

Do it with HTML
For those who embed their header images into the html, the solution is simple. Use alt text to spell out the header so that both search engines and those who use screen readers can "see" the image. I'm sure that most people know how to use alt text, but for those who don't, do this:

<img src="http://www.yoursite.com/IMAGE_NAME" alt="description/title of image here" />

Do it with CSS
You can also combine text with a graphic header that is embedded in your style sheet. To do this, create a div for the text portion only, and set the left margin at -5000px. Then place that div inside of the one that contains the graphic, and you'll get the same benefit as alt text without having to use the image in your html.

CSS:
.headerText {margin-left: -5000px;}

HTML
<div id="header">
<div class="headerText>TITLE TEXT HERE</div>
</div>

The title text will still be readable by search engines and screen readers, but won't be visible so you can still use a graphic header.

By kim | Permalink | Comments (0)