Our blog has moved!

You should be automatically redirected. If not, visit
http://www.masterlink.com/blog/
and update your bookmarks.

September 22, 2006

Accessibility and Web Design

Recently, a federal judge issued a ruling that is shaking up the way that websites are designed. The ruling lets a lawsuit by the National Federation of the Blind against Target Corp. to proceed. This does not mean that Target has lost the suit, only that the case would not be dismissed and would proceed. The suit charges that Target’s website is inaccessible to the blind and therefore violates the Americans with Disabilities Act (ADA) and several California laws designed to protect the disabled.

Targets argument for dismissal was that accessibility only applies to physical locations and not websites. The court disagreed saying that all services must be accessible to “persons with disabilities.”

How Does a Website Become Accessible to the Blind?

People who are blind commonly use text to speech software that dictates the contents of a website to them. This means that any images on a website that have text in them won’t be read by the speech software. For example, if you look at this site that sells yamaha parts you will notice that the navigation on the left has text that is presented as an image. There is a way to label the picture with any text you want so that a speech reader can speak to the contents of the image. This is done using an “Alt” tag. In the case of the Yamaha site, each image would need to be alt tagged with the same text that is contained in the image. So for the “buy accessories online” link, the code would have “alt=’buy accessories online’”. This way, a blind user would know to click that link if they are wanting to buy the accessories. Without these tags, the user would have to navigate to each page and hope that there is text on that page to tell them what the page is about.

A good example of proper alt tagging can be seen at the site of an extended auto warranty company. If you point your mouse over one of the green tabs that links to more info on the warranties, you alt text will appear (only in Internet Explorer, Firefox users must right click to view image properties). The text in the alt tag should reflect where the image link will take you in the site. Every image on this page has an alt tag provided.

How Does This Affect My Search Rankings?

Search engines act in a similar fashion to text to speech software because the search engine spiders that read your web page also cannot read text in images or decipher what the image contains. By using the alt tag you are able to tell the search engine what exactly is in the picture. Search engines also use this data to better help them when indexing images into their image search engines (images.google.com, search.yahoo.com/images & others).

When linking to a specific page, the search engines prefer that you use text, so that they can tell what the content of the page being linked to is about. Essentially, it is like voting for a page to rank well for a keyword in their search rankings using the text in the link. For example, if I wanted to link to the Complete Landsculpture site, I would use the text “Dallas landscape design“. If I used their logo to link to them, the search engines would see the link as having no text associated, so it would be like a vote without giving the site credit for the content it contains. This is why you need to alt tag the image with same text “Dallas landscape design” or something similar so that the search engines then know that that site is about landscape design. This will help to rank that site better for the text used either in the text link or as an alt tag.
You may be wondering, why not just stuff every image alt tag with keywords to rank better for those terms. The answer is that the search engines have evolved and can detect this keyword spamming. A rule of hand is to use a phrase less than 4 words to describe the image and don’t stuff keywords into the tag. Many people will tell you that the search engines don’t rank on alt tags but I can say that I have seen sites with only images show up in search results and the description that Google displayed used text found only in the alt tags.

How Can I See My Site Like a Text to Speech Reader or a Search Engine?

There are a few ways to make sure your site is readable to both the search engines and to people with disabilities. The first is to use a website standards validation tool. This also makes sure your site can be viewed properly in all browsers. All you do is put in the URL of the page you want to check and they will create a report with all errors. If you want to see how your site actually looks to search engines and browsers for the disabled you can use the SEO Browser tool or the Lynx text browser. This will strip all of the CSS styles and Images out of your site so you can view it at its most simple form.

For more in-depth analysis of the things you need to consider to make a site ADA compliant please click here.

No comments: