Thursday 17 October 2013

Improving Website Accessibility

Helping Improve Support for Disabilities

The Care Homes Directory has started a campaign to try and improve our website accessibility so people who are less able and use say a screen reader or keyboard to navigate will still be able to have as good an experience as a more able user.




WCAG 2.0

Conforming to the WCAG 2.0 is a goal we have set for our website and we feel it is important to make our site and therefore data accessible to the widest range of visitors not just the well able.

The main sections of our website are WCAG 2.0 aa compliant and have been tested using both WAVE and AChecker to verify that our pages conform we also used the nu validator.

By using these tools you can make sure a website is accessible by make some usually small changes to things such as font size and colour contrasts.


Aria Roles

Aria roles help add semantics to webpages for aiding screen readers which improves the experience for a visually impaired user.

We have added role="navigation" to our navigation tags on the website as well as adding role="main" to our centre div which is the container for the main page content and if there is a page heading we have added role="heading" to our heading div.

For news articles we have added role="article" attribute to our article div this is along side the other microdata our webpages contain.

Lastly we added role="banner" to our <header> tag and role="contentinfo" to our <footer> tag both of which are on every page. You should only have a single banner and contentinfo roles per page.

In future releases we plan on adding some link section headings to help improve upon our page semantics even more.


Keyboard Navigation

For keyboard users we have improved site layout by using only divs for all site layout rather than the mix of divs and tables we previously had. We mention this in the article here.

We aim to add tab indexes to our templates at a future date to improve a keyboard users experience by making navigation even easier.


Getting Focus

Adding onload JavaScript to take focus onto the search widget with the search results below previously focus was being taken to the bottom <nav> links which is wrong.

We have also changed the initial focus on the home page to the keywords search input and also the same for country pages.

Having focus initially on the search function puts the user near the main content and also they can use a site search if they need some other data.


Running Tests

WAVE is a good tester for accessibility issues on your website and it can be used to navigate your website via a frame and displays any issues it finds.

Another tool we used to confirm we conform to WCAG 2.0 was AChecker as mention above this rates our website as WCAG 2.0 aa which is the second level of compliance. There are three levels in total a, aa and aaa with triple a being the heights level.

This level does not apply to us a we use no video or audio on our website that would need to be transcribed in an easy to access format.


Conclusion

Improving our websites accessibility is an important goal which we feel we have achieved  we hope to lead by being the most accessible website for people who are less able.

As with all our improvements our effort to improve accessibility will be continuing and we will be adding improvements on an incremental basis.

No comments:

Post a Comment