| One of the biggest misconceptions on the World | | | | terms in your web site without defining them, people |
| Wide Web is accessible web sites can not be visually | | | | from outside your industry are not going to be able |
| appealing. However, by combing web standards, | | | | to understand your content. Another tip, always |
| semantic XHTML, and good CSS code, an accessible | | | | remember to spell check! |
| web site can be very visually appealing. Here are five | | | | 4. Keep mobile use in mind. Again, accessibility is |
| very simple steps to make any web site accessible. | | | | about designing for everyone. This includes everyone |
| | | | regardless of browser or device. According to recent |
| 1. Validate all your code and check against accessibility | | | | studies, over 21% of web browsing in the US is done |
| guidelines. This should be the most obvious step in | | | | via a mobile device (27% in the UK). If you have |
| making any web site more accessible. Go through the | | | | ever browsed using a mobile device you know that it |
| guidelines for the WAI and Section 508 and check to | | | | can be frustrating and hard if the designer has not |
| make sure your site achieves them. A good goal to | | | | included "skip links" to skip over navigation and |
| strive for is WAI AA accessibility--this usually covers | | | | secondary content. Be sure to include these links, you |
| all the checkpoints of Section 508. Level AAA is very | | | | can always hide them using CSS. Simply define them |
| hard to achieve for design rich sites, but is the best. | | | | in your CSS code similar to the following:a.skiplink |
| Another very important step in making an accessible | | | | {position: absolute;margin-left: -9999em; |
| web site is to validate all your code. All XHTML and | | | | } |
| CSS should be validated using the W3C validation | | | | This will ensure that mobile users can easily browse |
| service. Make sure you are using the latest | | | | your site--and also helps screen readers. Another |
| standards--don't use depreciated technologies and | | | | good practice is to define images in your layout as |
| elements such as HTML 4 or CSS 1. | | | | background images in your CSS. This will prevent |
| 2. Write it don't draw it! Nine out of ten times text | | | | them from showing up on mobile devices--which will |
| can be used instead of an image. Not only do images | | | | usually render them out of place because the screen |
| for text hinder blind users and screen readers, but | | | | is so small. If you are able, look at your site on a |
| also your search engine placement. Spiders can not | | | | mobile device. There are also mobile emulators that |
| read images. | | | | will let you see how your site renders on a mobile |
| 3. Write good content and design for everyone. | | | | device. |
| People often ask me, "What does good content | | | | 5. Make sure you can view your site without |
| have to do with blind people?". The answer is "It's | | | | JavaScript. If you can not view your site with |
| not just about blind people". While disability is a huge | | | | JavaScript turned off in your browser, neither can |
| part of accessibility standards, accessibility is about | | | | 12% of the World Wide Web, plus a good amount of |
| designing for everyone. This includes people who | | | | mobile users. Make sure you provide alternates for |
| have low literacy or do not know the language well. | | | | JavaScript code. Also, try to never make vital |
| Furthermore, if you put lots of industry specific | | | | functions (like navigation) use JavaScript. |