TW Blog :: Entries for Accessibility

A Rant On Accessibility

Also relates to Web Standards

A bit of blogging lethargy recently, after returning from a week's holiday in rainy old St Ives. Admittedly, work has kept me away from the more pleasurable side of the web through the last few days. Seems to have been lots going on in my time away, but with time currently short and sweet, I will fire off this post in similar vain.

Just really want to have a little rant about where things are (or are not) going in the realm of Accessibility. Just picked up on the formation of the EuroAccessibility Consortium from the (still below par) RNIB Press Centre. So, I though I'd delve a little deeper and had a look at the towers of strength that would be representing Ol Blighty in this very justified initiative.

1. Ability Net
2. Access in Mind
3. RNIB (Royal National institute of the Blind)
4. RNID (Royal National Institute for Deaf People)

Well the RNIB rebuild has already been documented extensively, but I decided to have a quick reccie of the other sites, since they must surely represent pillars in the Accessibility community.

Didn't get very far since I got held up on the first page of the Access in Mind website. There are a number of very useful accessibility tools in Opera 7 which I enjoy running over numerous sites I visit around the web.

Test One: Validation

XHTML 1.0 Strict Passed. Great Start.

Test Two: Checkpoint 1.1, Kill Images

Shock, horror! Where did the nav bar go on the left? It appeared there was no alt text for the images. Well delving deeper, the alt text was there (which it surely had to be since the site claims AA Conformance), but the problem was a lack of size defintion for the images. Yet a one-for-all height/width declaration in the base stylesheet would resolve this.

Test Three: Structural Semantics

Test two actually lead me straight to this. The navigation bar is erroneously defined as a table - the 90's all over again!? Yet are we not using XHTML Strict here? In fact, surely for a site exemplifying accessibility, CSS designed text menus would be far more representable of the movement then the choice of false structured images.

At this point, the testing ground to a halt and I fired up my blogger. Ok, it can be argued there is the base menu to cover the failure in Test Two, but once the text is enlarged, this menu is not visible without scrolling, leaving no navigation readily available on screen. This hardly RNIB See it Right certifiable. Another quirk is the one-pixel defined skip navigation container visible in top left of screen. I am guessing this has probably been used to avoid JAWS missing it if declared display:none in the style sheet. But wait a minute….Doesn't CSS define alternative media types??? Surely this container could be hidden on screen media, while made accessible on a separate aural stylesheet. Alas, the AiM CSS file doesn't do it many more favours, with a lot of repetitious and redundant declarations. Again, maybe an accessibility guru would turn around and say these rules and this layout is necessary to support Screen Readers or Braille browsers, as has occurred in the RNIB debate over recent months. But it is this very thought that stirred a rant in me.

I feel this approach to accessibility is not resolving the issue, but simply turning it on it's head. Building websites for less-abled users at the expense of all other users. This is certainly not what the WAI and Web Standards is all about. The tools are readily available now to make a site that is accessible to all, offering the benefits to each user based on the agent they have chosen to use, or the abilities they have. Sometimes workarounds are required for more complex design issues, but this doesn't mean the basics should be ignored. While clearly important, blind, deaf and visually impaired users are not the only demographic that accessibility addresses. What about portables, low bandwidth users, text users, legacy users etc etc….?

Phew, I have had my say….

Posted on Jul 31, 2003 at 18:46:14. [Comments for A Rant On Accessibility- 0]

Another Makeover For The RNIB

Also relates to Web Standards and CSS Design

I decided to join the games this evening and have a quick stab at rebuilding the RNIB home page. Admittedly, a lot of the work had already been done by Simon and the others, but I started with a blank slate to see if I would take the same approach. The final draft is a little and rough and ready - done at speed - but renders consistently across the Windows browsers. Once again I haven't been able to test it on other platforms - barely enough room for a single PC in my office! Since the RNIB serves a specific purpose I set specific structural and design goals for the rebuild

1. Readily resizable content (to at least two times) without breaking up the structure of the page.
2. Logical and accessible structure, that could render easily on an alternative browser (eg Braille or Speech in this case).
3. Keep the design as close to the original as possible (since RNIB had already invested the time in releasing a new front end design, and assuming they have done accessibility checks on the choice of colours). Actually I wasn't totally sure what the original design was intended to be as it looked so radically different across IE, Opera and Moz!

Much of the approach I took appears to be similar to the work already done, however a few areas of the build differ

• Using Fahrner Image Replacement technique on the graphical parts of the page served no purpose in a non-visual environment. For example, the RNIB banner in the top left on screen I placed within the style rule for the top level header element - h1 {background: url('../g/rnib.gif') no-repeat top left;}. Then the text equivalent, cloaked from the screen in a span element, would be served for non-visual user agents, instead of the alt tag of the image.
• I placed the banner at the bottom of the XHTML document, and positioned it absolutely. This way it serves as a reminder when a non-visual UA reaches the end of the page. Some would probably argue that by definition, a banner should be placed at the start of the document, but this is just my view of banners!
• This also meant, there were four clear full width horizontal bars from the top of the page, and I started the main content (ie splitting the columns) below these four rows. Thus, by enclosing all three columns within a wrapper container, the background colour could be set to that of the two sides, to avoid the white space problem that would other arise with using position:absolute to place each column.
• Rather than relying on the pipe divider, I put both the horizontal menus into inline lists using a combination class to extend the rules from one list to the other without impinging on the rules for the vertical lists.
• The date seemed to sit in an odd place when the page was read through a text browser, so I pushed it to the bottom as well, and positioned it using negative relative placement.

That's most of it. I am sure there is a lot that could still be improved, IE does a vainishing trick sometimes over the inner floats, and, the CSS could certainly be improved if more advanced selectors could be used without compromising browser compatibility (good ol IE!?) Oh, and I only set a global selector to switch off borders, margins and padding at the outset since I wanted to do this quickly and working from a blank slate seemed the quicker way to go. Actually worked quite well, although it makes for hard work integrating Fahrner's keyword hack to support IE5.x safely. (I say 5 since @import was used to exclude version 4 browsers, which actually get a reasonable, if plain, styleless version). Finally, the filesize (15KB) is not representable since I removed much of the anchor code, and additional accessibility code would probably still need to be added, plus metadata.

Posted on Jul 05, 2003 at 01:24:39. [Comments for Another Makeover For The RNIB- 0]