This week, thanks to a friend and colleague at Hello Goat Designs, I had the opportunity to do some accessibility testing on a web site he is building. I’ll share more about my findings and the final result when the site launches.

There were a few basic accessibility tweaks that I suggested, one of them relating to header tags. That gave me the inspiration for another post in my Web Accessibility 101 series.

There are a few things worth noting about properly and effectively using H1, H2, etc. These basics not only help provide an easier navigating experience for the disabled, but also get wins in search engine optimization.

Screen readers like JAWS have key commands to read off header elements, in order. For example, JAWS has a command INSERT + F6 that reads the entire list of headers, and H cycles the user through each header. The browser Opera allows you to highlight across header elements via its single-key shortcuts.

H1 should be the top level heading of a document. Often times this would be the page title. It gets huge consideration from search engines. There should only be one H1 per page.

You can use any number of H2 tags, H3 tags, and so on. And while there are six header tags, you don’t need to use all of them. There may be cases that only H1 and H2 are needed, for example. If H1 is your page title, H2′s are major headings, followed by H3 sub-headings, and so on.

Avoid skipping header tags. If there are H3′s on your page, there better be H2′s and an H1 as well. Skipping causes confusion for screen readers.

Header tags should be wrapped around actual headers or titles, not blocks of code or content. This came to mind because I recently saw a site (that was built using SharePoint Designer), that had actual tables within a header tag. That’s all kinds of wrong.

Header tags, in short, are more than just stylistic additions. For screen reader users, they are vital in giving a sense of the main topics of the page, and enabling easier navigation through your content. Additionally, effective header tag usage will get you superior search engine treatment — making your site more accessible to everybody, not just the disabled.

Tags: h1, h2, h3, header tags, jaws, opera, screen readers, search engine optimization

This is the sort of headline that I particularly enjoy reading, given my recent focus on web accessibility – “2009: The year websites become accessible to all.”

Opera’s Bruce Lawson recently wrote an article for ZDNet UK discussing the prospects of web accessibility gaining prominence in 2009. He cites some key factors that are converging to paint a promising immediate future for the accessibility.

One, as we discussed in “Accessibility News: Web Content Accessibility Guidelines 2.0 Become W3C Recommendation“, the aged Web Content Accessibility Guidelines 1.0 were at least updated formally to 2.0.

Also, standards are expected to be pushed forward this year for Web Accessibility Initiative Accessible Rich Internet Applications — with its goal of Web content and Web applications that more accessible to those with disabilities.

Lawson cites as a factor the hot button issue of legal ramifications as well. Target having to settle out of court for its accessibility lawsuit certainly drew much attention. As as covered my last post, “Accessibility News: Expedia / Hotels.com make considerations for disabled travelers,” Expedia recently announced accessibility strides in response to a lawsuit.

Lawson points out that the British Standards Institution is fast at work on drafting a standard for website accessibility. Such a standard will carry a lot of weight on both sides of the pond.

Read Lawson’s article and his compelling points. Web accessibility has been around for years, but its undeniable that its importance and focus are only elevating.

Tags: aria, british standards institution, bruce lawson, bsi, lawsuits, opera, WCAG, web accessibility initiative accessible rich internet applications, Web Content Accessibility Guidelines, zdnet uk