Beginner's Guide

JAVA SCRIPT AND WAI ARIA

WAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications) is a technical

speciﬁcation of the Web Accessibility Initiative

, which will facilitate the participation for people with

disabilities in today's increasingly complex and interactive web services. This technique is particularly

helpful in designing dynamic content presentations and user interfaces. The technique is based on the

use of JavaScript, Ajax, HTML, and CSS.

Especially blind people often lose orientation when visiting a site where content is suddenly displayed

or hidden. People, that can see, can sense this change with the eyes, blind people can understand it only

when the focus is placed on the item.

To focus means nothing else than to place the cursor in the appropriate place to make the positioned

content accessible.

In HTML and XHTML we did not had the opportunity to focus on all elements. Only the

interaction elements such as links, buttons or input ﬁelds were focusable. This has changed with the use

of WAI ARIA and HTML5.

The used scripts within the Beez templates rely on this technique to make the template accessible to

people with disabilities.

WAI ARIA - LANDMARK ROLES: FIRST AID FOR THE ORIENTATION

Landmark Roles are intended to facilitate the orientation on a website by describing page areas and

their exact function within the page. The navigation has the role navigation, search has the role search,

the main content has the role main. The implementation is quite simple. The element is extended only

to the appropriate role attribute. Thus, users of modern screen readers will be informed of this role.

Inside the Beez template, this is done automatically by using javascript (javascript/hide.js). The

approval of the Wai-Aria technology is still pending and with the direct implementation into the source

code the website would fail doing the validation test.

A complete overview of the landmark roles can be found at http://www.w3.org/TR/wai-aria/

roles#landmark_roles.

If you later use the Beez template as the basis for your own template and modify the structure of

page areas, you should adapt the script accordingly.

Collapsible modules and sidebars

Joomla! 2.5 - Beginner’s Guide

Monday, 30 January 2012! Page 208

http://en.wikipedia.org/wiki/Web_Accessibility_Initiative