now with added Masterweb and IB Geek Girl

spider web Ecanus•net :: Tutorials

Tutorials

These aren't really full blown tutorials – more quick 'n' dirty guides to doing stuff that might save you some time. Click the links below to see them.

Accessibility 101: the basics

What does accessibility mean and why is it important?

Accessibility isn't just about providing access to websites for people with disabilities, though that's a big element of it – making your site 'accessible' also means that it'll be accessible across different platforms and browsers and to people accessing the internet through a variety of internet–enabled devices.

This guide isn't intended to be exhaustive – there are other places on the web that have much more detailed information – it's just a starter to give you an idea of the things to bear in mind if you want to design accessible sites.

How do you get to have an accessible site?

Through four steps that make it sound simple:

  • make sure your underlying code complies with W3C guidelines
  • validate your code
  • comply with WAI accessibility guidelines
  • test in different environments.

Makes it sound simple, doesn't it? But if you read the WAI guidelines you may feel overwhelmed if web accessibility is new to you and you have a large site you want to try and make accessible. Where to start?

I believe that all sites should be as accessible as we can make them. That said, it would be counter-productive to frighten people with the sheer amount of possible work to the point that they don't bother with any improvements at all. Some improvements have got to be better than none.

So, bearing that in mind, this is the ecanus•net 8–point guide to basic web accessibility:

  1. If you have to use tables for layout (and ideally you shouldn't) then try not to use too many nested tables as they are confusing for various assistive devices
  2. Don't use px or pts for font–sizing. Use % or ems so that people can resize the text in their browsers. Also make sure your layout doesn't break if they do
  3. Use <label> on forms to link the form input with the label (Google accessible forms or check out links in the forum)
  4. Make sure that images have alt text
  5. Check your site with images turned off and see if it still makes sense
  6. Try "Linearise Tables" in the Firefox web developer toolbar and see if your site still makes sense
  7. Don't rely on Flash or JavaScript too much as it can be turned off
  8. Try to ensure the text contrast against the background is good.

Want to know more about accessibility? There are many sources of information on accessibility on the web. The links below have a wealth of information and are good places to start looking for information on accessibility – we're not saying they're the only ones, or the best ones, just the ones we happened to have bookmarked ;–).

Useful links:

  • www.w3.org/WAI/ – W3C Web Accessibility Initiative (WAI)
  • www.w3.org/TR/WCAG20/ – W3C Web Content Accessibility Guidelines
  • webxact.watchfire.com – free online service that lets you test single pages of web content for quality, accessibility, and privacy issues
  • www.contentquality.com – The HiSoftware® Cynthia Says Portal – a web content accessibility validation solution
  • www.diveintoaccessibility.org – Dive into Accessibility: 30 Days to a more accessible website
  • www.vischeck.com colour–blind simulator – simulates how your site would look to a person with various types of colour–blindness
  • www.webaim.org – WebAIM – Web Accessibility in Mind – explanation of techniques, tools and products for accessibility
  • www.joeclark.org/book/ – Building Accessible Websites – online version of Joe Clark's web accessibility book
  • www.accessiblenet.org – AccessibleNet.org: the accessibility portal – invaluable resource of links to all things accessible including checklists, standards and guidance, tools and software and web accessibility news to name but a few
  • www.accessify.com 'accessify' a verb which means 'to make accessible' – home to articles, tutorials, reviews, tools and wizards, links and resources, accessibility news, and more...
  • www.accessifyforum.com – Accessify Forum – the place where knowledgeable accessibility types hang out.
  • www.jarmin.com/accessibility/ – Jarmin.com Accessibility Guide – a lovely 'plain English' accessibility guide with lots of hints and resources

THE END