Accessibility - it’s not just for the handicapped
Is your web site accessible?
If you think accessibility only applies to sites that cater to a predominantly handicapped audience, think again!
In the first place, ignoring accessibility makes your site harder to view for people using cell phones or PDAs to surf the web. This is a growing audience you may not want to alienate.
And if you think about it, search engine spiders have no eyes, no ears, and no hands. They are among the most "handicapped" visitors your site will ever get. If you care about visits from the search engines, you need to pay attention to accessiblity issues.
Many people mistakenly believe that making web sites accessible is difficult, complicated and expensive. For most small business sites, though, nothing could be farther from the truth.
In fact, just a few easy, common-sense steps will go a long way toward making your site friendly to search engine spiders and all your human visitors.
So, what are these steps?
-
Use heading tags as they were intended. (These are the H1, H2, H3… tags.) They should be used to define the structure of your page, much as you would use a page outline when writing a term paper back in school.
There should be one H1 tag at the top of the page, which gives the overall title of the page. Below that, there will be one or more H2 tags, to define and describe each of the main sections of the page. Below each H2 tag, there will be one or more H3 tags, to head up each subsection within that section, and so forth.
This allows users of adaptive technologies to easily navigate through your page to the section that interests them. It also gives the search engines a clear indication of what your page is about and helps them properly classify and rank it.
-
Use alt attributes on all your images. Image alt attributes are intended to be served as an alternative for people (and search engine spiders!) who can’t see the image for whatever reason.
If an image is important to the meaning of a page, use the image tag alt attribute to describe the image. If an image is used as a link to another page, use the image tag alt attribute to describe the page being linked to. If keyphrases are appropriate for use in either of these, you may use them, but do not keyword-stuff the alt attribute. It will not gain you any appreciable search engine benefit and it will irritate users who view your site without images.
If an image is purely decorative, use a blank alt attribute; for example:
<img src="decorative.jpg" alt="" />
This will not hurt you with the search engines, and your visually impaired visitors will thank you for it.
-
Consider the use of CSS for page layout. If you must use tables for layout, be careful and considerate in how you use them. The use of CSS (Cascading Style Sheets) offers many benefits: ease of updating, often cleaner code, more forward-compatibility. If you or your designer can use CSS for your site layout, it’s probably a good idea to do so.
However, due to inconsistent browser support for some CSS elements, it may not be feasible for you at this point. If you do use table tags for layout, be sure you understand what the potential issues are so you can address them appropriately.
First, when tables are rendered by adaptive technologies and by the search engines, they are "linearized." This means that the contents of all the cells in the first row will be rendered in order from right to left, then the cells in the second row and so forth. If your content doesn’t make sense when you put it in that order, or if your table structure is so complex you can’t easily tell what order the content will render in, you need to reconsider your table layout. If you get confused looking at it, what do you think will happen to your handicapped visitors and to the search engine spiders?
Second, you need to consider the rendering time, even for visitors using standard browser software. The more deeply nested your tables are, the longer it will take your page to appear in some browsers. The longer it takes your page to appear, the more likely it is that your visitors will leave before the page loads fully.
Even if your chosen page layout won’t let you eliminate tables entirely, consider minimizing the use of tables and blending them with CSS positioning to achive the look you want while maximizinig the visitor and search friendliness of your code.
-
Make sure your code is as clean as possible. There are any number of free online code validators, and many web site design / development software packages come with a validator built-in. Before you post your code to the web, run it through a validator and try to correct as many of the errors and warnings as possible. Each error represents a potential for a browser, search engine spider or adaptive device to fail when rendering your page. Each failure represents a potential lost customer or lost search engine ranking.
Confused about accessibility issues? Concerned that your site may be inadvertently turning away visitors? You don’t need to try to figure it all out by yourself. NineYards.com can assess the search and visitor friendliness of your site and provide you with specific, easy-to-follow, actionable recommendations with our Web Site Audit report.
Resources
Use Lynx for seeing how your pages look and function in text mode without JavaScript, Flash, DHTML and pop ups. (http://lynx.browser.org/)
Check your web page accessibility online, for free, with Cynthia Says. (http://www.contentquality.com/)
Validate your page code online, for free, with the W3C (World Wide Web Consortium) Markup Validation Service. (http://validator.w3.org/)