First time visitor? The tutorials start here.

Search Engines and Accessibility

Whether you are new to writing code for web pages or have been writing HTML for years, listen up. The old way of coding pages will hurt your search engine rankings and accessibility. If you are using any <font>, <center>, or any kind of styling tags whatsoever in your HTML or putting your whole page in a <table> with links down the left side, you are really screwing yourself.

I mention search engines and accessibility together, because there are similarities in the way search engines and assistive technologies for the disabled read a web page. Both read from and left to right and top to bottom from the code itself, so if you have 50 links before your content, the links will be read before the content. This will bring fewer people to your website, and I’ll explain why below.

Search engines and aural screen readers (technology that reads pages out loud for the visually impaired) also have trouble with javascript, <iframe>s and <frameset>s, as well as flash and other multi-media. If you don’t know what some of these things are, don’t worry. If you’re not going to use them, then it’s not important anyway.

Now let’s take the two technologies individually…

Search Engines

Search Engines will often read a limited amount of content and code on a page before stopping and moving on to the next page. If you have too much code before your content or mixed in with it, or too many links before the real content, a search engine might not even see your actual content. If it doesn’t see your content, it won’t be able to include that content in its search index, and people will not find your website through that search engine.

It is also important to use proper xHTML tags, because search engines prioritize certain tags over others. I will get more specific with this as we get into the actual tutorials, but it’s important to keep this in mind.


When you are reading a book, do you read the table of contents before the next page in the story, every single time you turn a page? That’s what it’s like for the visually impaired when they go to a page and have to hear all of the links that are listed down the sidebar before they can hear any of the content. Do you think they would stay, or refer others to your website, if they had to hear the same thing over and over and over again, every single time they go to a new page of your website? Of course not!

Likewise, if you don’t use the proper code for inserting images into your page, some aural screen readers will read the location (also known as the URL or web address) of the image. Imagine how excruciatingly painful it would be if you have a sidebar with 50 links that are all images, and the person has to keep hearing h-t-t-p-colon-slash-slash-w-w-w-dot-yourwebsite-dot-com-slash-images-slash… well, I think you get the idea.

I will cover this in more detail when we get to images. There are other things to consider with accessibility as well, but I’ll tell you all about it when we get to those topics in the tutorials.

Without further ado, let’s get started. First, you will need a text editor to write your code in.

If you found this article useful, please spread the word:
Stumble it! Digg! Tweet it!

Questions or comments?

Please log in to post a comment. Sorry, but it prevents this from happening. If you're not registered yet, you can register here.