How to improve web site accessibility

London February 2004. Choose display Wheelchair (Javascript enhanced) or Leaves

Why accessibility?

Thinking of accessibility when developing your products should not be a matter of "we are forced to by law" or a matter of "there are a lot of rich disabled people out there". It is a necessary thing to do, as it allows everybody to reach what you want to offer or convey. It is a simple matter of using the media in a more mature way.

Possible legal necessity

You might be forced to adhere to some level of accessibility when developing your product; it may be a government related or funded project. In any case, thinking of it now rather than when there is no time to do it properly is a more logical approach. Simply trying to add only what is necessary for the site to be legal is not a good approach, as in 90% of the cases this results in patchwork rather than a functional accessible site. Think of accessibility as an enrichment of the product, not as a burden.

Easier maintenance and rebranding of the product

Making your products accessible it easier than it may seem at first. A fully accessible site also means that it can be maintained a lot easier, and a clever separation of content, visual appearance and behaviour makes it easy to redesign the site. It also allows for easy rebranding of the site for third parties.

The "blind millionaire"

One reason that is mentioned a lot when it comes to accessibility, is that it is not necessary as the product may not make sense for blind people, or that "the few disabled people are not worth the effort". There is one disabled user no one can afford to lose these days: Search engines. Search engines experience the page the same way as a blind user or a user with disabled javascript. Important is textual content marked up in a logical way and links that lead somewhere. The earlier the content is available in the document, the better. Companies spend a lot of money on Search Engine Optimisation (SEO), money that can partly be saved by simply creating your documents the right way.

back to top

How to introduce accessibility?

The biggest obstacle we have to tackle toward accessible design is the fear of the subject. As visual developers and Computer users we are afraid of losing our eyesight or hand-eye coordination. Only when everyone involved understands that accessibility does not mean catering a minority, but inviting everyone, an accessible product is easy to develop.

Raise disability awareness throughout the project - designers, developers and sales force.

Force people to use keyboard only, turn off CSS and Javascript in their browsers, show them assistive technology. Set the keyboard and mouse settings to fast and ask them to navigate their designs. Show the product in text browsers, and explain that a clever web site has to have a good document structure design, and a nice visual output.

Raise client awareness from the start

Also ensure that the client knows that building an accessible product does mean some extra work, especially in the design. The more you review initial designs and spot accessibility traps there, the less fixing and testing has to be done later.

Separation of Markup, CSS and Scripting

Be sure to clearly separate the site development into different layers, the markup (HTML) which defines what a part of the page text is, the CSS which defines how it looks like, and additional scripting, that makes the page behave differently.

The cleaner these levels are separated, the easier it is to test for accessibility, simply take away one of them (except for the markup of course) and see if your product still makes sense. If that is the case, you have won.

Testing, testing, testing

Testing is of utmost importance for accessible design. Make sure to test the product on different browsers and environments, if budget permits, buy a screen reader and test with that. A lot of web sites and software products offer accessibility checks, use these, but don't take them as a set in stone truth, a software can never experience a page like a human being does.

back to top

What are the problems we are facing right now?

Accessibility is not rocket science. On the other hand it is not that easy as some software vendors try to make us believe. The biggest obstacles we have is that we can not always define 100% how the code output that is our site will look like "under the hood". Other problems are also man made.

Current web design aesthetics are too print driven

One of the biggest obstacles is that a lot of brochure ware web sites get designed with print aesthetics in mind. Every bit needs to have its size and location on the screen .This is aesthetically pleasing, but the problem is that we don't know how big the screen is.

A browser view port is not a canvas, the user can (or may be forced to) crop it to whatever he wants. One of the main requirements of accessible pages is that the text has to be re sizable, with fixed layouts this can cause trouble.

Web development is considered graphic work rather than document design.

Most projects fail to become accessible, as too much time is spent on the visual design with out creating the right document structure at the same time.

An HTML document is, in essence a text that has some controls in it which define which part of the text is what.

Without knowing all the elements necessary to assemble the designs, we cannot create a nice and clean document.

Consider web sites a piece made from LEGO. You need to have the right pieces to put it together, and they need to connect, otherwise it'll fall apart.

In an ideal situation, the design elements the page is made up from should be ratified by the client before the first line of code is done, and the designs should also get Ok-ed by the developer. Plan for some hours of simple document design, not only for visual development.

Visual changes can be made in the CSS in the finished product, however, if there have to be new elements to the page, the markup needs to change as well. This is not a big issue in standalone brochure ware pages, but can be very time and money consuming when a back end generates the markup.

Browsers and Screen Reader CSS implementation is still dodgy

CSS is a beautiful idea, the clean way of styling text without changing the text itself. Sadly enough even nowaday's browsers still have a lot of problems with it, and that forces us to use outdated and less maintainable techniques from time to time.

The biggest problem with browsers these days are multi column layouts. These are still a headache and even the most used browser, Internet Explorer 6, behaves very random at times.

The same problem presents itself with screen readers. Some support Javascript and CSS to a certain degree, others don't. Nothing to do there but testing.

One thing is useless though: Do not let your site development be hindered by old browsers. Web sites do not have to look the same on each browser, they should simply provide the same content, the experience can vary.

Content Management Systems, WYSIWYG editors and back ends create invalid, un maintainable code

One real annoying element of every big project is that generated content is always a horrible mix of presentation, structure and behaviour. This is based in the approach most back ends and editors take - visual to markup, rather than the other way around. Whenever you deal with generated content, may it be by a content management system with a what you see is what you get interface or a back end that keeps the current state of the site in the HTML, you will have to find a way to keep the damage as low as possible.

Especially Microsoft's .NET back end is a big problem if you use it out of the box. Its output is very Microsoft Product specific and degrades badly on other browsers. A lot of tweaking has to be done. Whenever you do use some of these products, make sure to add extra development time for cleaning up their HTML outcome.

Accessibility Myths

One final big problem is the sheer amount of wrong information on the web about accessibility. As it dawned on a lot of companies and developers just lately that it might be important, a lot of rushed solutions are found for problems that are not there to begin with. A lot of times technology is used to replace common sense. Before jumping into it kicking and screaming it might be a good idea to post your problems on some message board or mailing list or look at the web sites of book authors on the subject.

back to top

The multi level approach

back to top