Beneath the Red Hood.

Disabled-friendly website case study: The Nut Graph

Posted on by Alex Lam

In our years of developing and crafting websites, very few clients have ever put an emphasis on catering for the disabled – until we met the caring people at The Nut Graph. From the get go, Integricity was given specific instructions to ensure that after the site was stable, they would want to do as much as they could to make it disabled-friendly.

The current layout for The Nut Graph – the non-disabled-friendly view

After almost a year of working with their team, we have grown to see the world through their eyes and can see how much they care for the disabled. As such, we have put in much effort to turn their news site into one that can be traversed easily by the averaged disabled person. Cindy Tham and Jacqueline Surin even ran the site by the Malaysian Association for the Blind (MAB) and took into account all the feedback that was communicated to them.

As a result, we are now on the brink of launching one of the few Malaysian sites that caters for the disabled. Visit The Nut Graph tomorrow to see the changes.

Sneak preview of the disabled-friendly The Nut Graph

What we at Integricity have learnt through this process…

  • It is very important to have <h1> tags to demarcate the title which is the start of an article. Some screen readers can skip all the navigation parts and jump straight to the content.
  • Moving flash banners / .gif images can be disturbing and distracting.
  • Positive contrast is generally the best (black on white).
  • Ensure all images have alt tags, so that they can be read aloud to the website visitor.
  • Tabular information should be put into <table>s rather than putting them into aesthetically pleasing jpg graphical tables, as the data cannot be read out from jpgs.
  • The obvious: fonts must be larger.
  • And very interestingly, for forms, instead of saying “fields in bold are mandatory”, rephrase it to “fields marked with an asterisk are mandatory” – the average screen reader will not differentiate bold and non-bold text.

For further reading, you may take a look at this article that proved to be a great resource to us.

This entry was posted in Blog, Current Projects, Design & Technology and tagged , , , . Bookmark the permalink.

4 Responses to Disabled-friendly website case study: The Nut Graph

  1. Congrats guys! A step in the right direction for Malaysian websites =)

  2. Power to TNG!

  3. Great job, guys. I’m glad that you guys care about this kind of stuff. This is a good case study for other Malaysian web designers and agencies to read up about.

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>