Headings - as the name suggests - are used to highlight or mark text appearing at the top of sections of a document.
I want to bring out how invaluable the simple mark up elements h1 h2 etc. are when it comes to web page accessibility using a keyboard.
Imagine that your Web page has about 40 navigation widgets, links and buttons, (not a very large number considering an average application - a random yahoo mail page that I just viewed has 61 links).
Now imagine that using the keyboard, I need to click the 27th item....oops! the poor tester who was denied the mouse is sure to get carpul tunnel tabbing 27 times on every page (a topic I'll touch again in a later post).
This is only the beginning.
Now grasp the fact that a screen reader usually presents a Web page as if someone was reading the page from top left to bottom right linearly with every navigation widget appearing on a new line.
All those top menu links, those left menu items (and often the drop down menus) appear at the beginning.
The relevant content of the current page starts after this - and it is not even a tab stop.
As a screen reader user, I have no simple way of getting to read this "main" content of the page -- something that is visible to a sighted user as the most prominent thing on the screen is accessible only after wading through all that header and left nav clutter.
Try going to the microsoft Msdn pages. The top and left nav clutter there is hundreds of links - I read those pages from the bottom up to avoid this.
Only if the main content would start with a mark up like a heading.... and most screen reader implementations allow me to move through headings in a page
This very basic usability guideline of marking important sections of the screen with relevant headings is almost universally ignored:
google does it on its main search results page but forgot to do it on all other pages like google scholar search, gmail etc.
yahoo has it in the classic mail view but for some reason forgot to add it to the new and improved yahoo beta.
Do you have headings for identifying parts of the screen in your Web application?
Remember that in addition to their traditional use, these simple tags help users navigate through your app.
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment