Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Added general notes about how to use inspection tools, and their views.

...

The a11y tree is displayed on the left, and shows the hierarchy of accessible objects on the page.  The is *not* a view of the DOM.  Browsers use the DOM to construct the a11y tree based on built-in rules as well as explicit ARIA markup.  An example of a built-in rule is an empty alt attribute for an <img> element.  Empty alt text entails that the <img> is decorative or for layout; or, generally, not semantically relevant.  Browsers will not create a node in the a11y tree for such <img> elements.  Similarly, an element with an ARIA role of "presentation" will not have a corresponding node in the a11y tree.  (Note: there are situations where "presentation" can be overridden by other factors; for example, if the element is focusable or interactive.  In that case, it will have an accessible object in the a11y tree).One can select this is a generality -- any element that is focusable will appear in the a11y tree even if it is marked "presentation").  Generally, there are fewer branches in the a11y tree than in the DOM since the a11y tree displays the information at a more meaningful level.  It abstracts over the nesting of divs, spans, and whatever to show the underlying toolbar and its tools (for example).

Select a node in the a11y tree view to inspect it more closely.  The interface viewer on the right will show various accessible properties of the selected node.  Properties include aspects of the accessible such as its role, the its name and description (if any), and other properties that depend on the nature of the object.  For example, if the accessible is a checkbox, then the interface viewer will show its checked state.  Another example:  If a slider, it will show its current, minimum, and maximum values.

When checking an accessible with respect to ARIA markup, the ARIA User Agent Implementation Guide provides a pair of tables that define what should appear the information in the AAPI.  The two tables are the role mapping table, and the states and properties mapping table.  Each table shows how an ARIA role or state/property is mapped to different AAPI'sAAPIs.  Thus, if you are using Accerciser to inspect the AAPI create a11y tree created by FireFox, you would look at the ATK/AT-SPI column of the table is your guide.  Similarly, if using AccProbe on Windows with FireFox, use the MSAA+IAccessible2 column.

More documentation is given by the links below for each specific inspection tool.

Accprobe

Platform: WinXP, Win 7

...