Copyright © 2005 W3C® (MIT, ERCIM, Keio), All Rights Reserved. W3C liability, trademark document use rules apply.
This specification provides designers with extra semantic role information that
make user interfaces more usable and accessible.
Web applications often rely on a hybrid of technologies (such as SVG, AJAX, DHTML and JavaScript) that do not promote the rich interaction semantics. Adaptive technologies, that need to provide alternative access to complex user interfaces, are often left guessing at the semantics behind specific portions of a document making them inaccessible. To fix the problem this specification provides extra semantics to support platform accessibility interfaces.
The goal is to make static and interactive content of Web pages more usable and
accessible to their users and their assistive technologies. This goal is achieved by
providing a cross-platform role model for dynamic Web content that allows for content
adaptations based on role information. The result is to provide an interoperable way
for associating behaviors with document-level markup.
The PF working group has developed a roadmap for making dynamic web content more accessible to people with disabilities. To assure these technologies will interoperate in a manner that improves accessibility for the widest range of web technologies, the PF working group asks for comments and suggestions on how this specification can be improved for use in the technologies that you or your working group are developing. In general we prefer public comments so that all people (including the general public) reviewing the document can be aware of your comments, but you may also send member confidential comments that will be available only to the working group and other W3C members.
This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications can be found in the W3C technical reports index at http://www.w3.org/TR/. This report has not been published to the W3C technical reports index.
This document is an initial Draft by the Protocols & Formats Working Group of the Web Accessibility Initiative.
This specification adds semantics to content to improve the accessibility and interoperability of Web Content and Applications. This document and the States and Adaptable Properties Module are the result of the gap analysis of the DHTML accessibility roadmap to enable accessible dynamic Web content and applications. The Working Group expects to advance this document to a Working Draft and Recommendation.
This document is for review purposes only. The web address, URL and file name of this document may/will change. Publication as a Draft does not imply endorsement by the W3C Membership. This is a draft document and may be updated, replaced or obsolete by other documents at any time. It is inappropriate to cite this document as other than work in progress.
This document was produced under the 5 February 2004 W3C Patent Policy. The Working Group maintains a public list of patent disclosures relevant to this document; that page also includes instructions for disclosing [and excluding] a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) with respect to this specification should disclose the information in accordance with section 6 of the W3C Patent Policy
This section is informative.
Roles are a simple way for an author to make custom widgets (new interactive elements) accessible, usable and interoperable.
Complex user interfaces become inaccessible because adaptive technologies, that provide alternative access, are often left guessing at the semantics behind portions of a document (see the Dynamic Accessible Web Content Roadmap Roadmap). Using this specification you can assign a role name to an object that maps the object to the accessibility framework on the native platform and provides semantics needed by adaptive technologies.
This role taxonomy currently includes interaction widget and structural document objects. The supporting taxonomy is encoded in RDF (Resource Description Framework). The RDF taxonomy encodes inheritance information and details of what states and properties each role support. When possible, role information is mapped to platform accessibility API's.
Roles are element types and should not change with time or user actions. For assigning meaningful properties that change with time and events see the WAI States and Adaptable Properties Module.
This section is informative.
In this example, a table has been assigned the role of a grid or spread
sheet.
<table id="table1" x2:role="wairole:grid" >
....
</table>
Encapsulated in the role information is information for the platform accessibility infrastructure and/or accessibility tooling that enables it to be properly treated. (In this case that multiselectable is supported and cells may be editable.)
A full spreadsheet example is available online at http://www.mozilla.org/access/dhtml/spreadsheet
Roles can be embedded in any host language, e.g. [XHTML]
1.1. In many case Roles will work well with other supporting technologies, such as
XHTML 1.1 For Accessible Adaptable
Applications and xml-events.
This section is informative.
While some terms are defined in place, the following definitions are used throughout this document. Familiarity with W3C [XHTML] 1.1 Recommendation [XHTML] and the W3C XML 1.0 Recommendation [XML] is highly recommended.
Note: This definition is based on WCAG Accessibility Guidelines 2.0 .
This section is informative.
This draft currently handles two aspects of roles - GUI functionality and
structural relationships of the element. For more information see the Dynamic Accessible Web Content Roadmap
Roadmap and implementation examples
for the use of roles making dynamically generated content accessible.
This taxonomy is designed in-part to support the common roles found in platform accessibility API (Accessible Programmable Interfaces) frameworks. Reference to roles found in this taxonomy by dynamic Web content may be used to support dynamic accessible content authoring, interoperability with assistive technologies.
The schema to support this standard has been designed to be extended so that custom roles can be created while providing a common schema for describing how to interact accessibly with a custom role. Note that much of this could be formalized in [XML]schema (of XSD). However being able to define similarities between roles, such as baseConcepts and more descriptive definitions would not be available in XSD.
At some point the working group intends to add roles for A, Adding concepts in the type of content for adaptation to the user scenario and B, Knowledge representation of Web content.In future versions of this specification the working group intend to add roles in support of individualized content adaptation and knowledge representation of Web content.
This section is normative.
This specification defines a Taxonomy called Roles. The Roles Taxonomy uses the [XML namespace] [XMLNAMES] identifier
http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#
All examples are informative. Examples in this document that use the[XML namespace] prefix "wairoles" all assume a valid xmlns declaration such as
xmlns:wairoles="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#"
in the document involved.
The remainder of this section describes the classes instances and properties in this taxonomy, the semantics, and provides an [RDF] Schema.
In this example a span has been used to create a tri-state checkbox (a checkbox control that has three possible states). A role is used to make the behavior of this simple widget known to the user agent. Properties that may change with user actions (such as checked) use States and Adaptable Properties Module (aaa [namespace]).
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:x2="http://www.w3.org/2002/06/xhtml2" xmlns:wairole="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#" xmlns:aaa="http://www.w3.org/2005/07/aaa" >
<head>...</head> <body> ... <span class="checkbox" id="chbox1" x2:role="wairole:checkboxtristate" aaa:checked="mixed" onkeydown="return checkBoxEvent(event);" onclick="return checkBoxEvent(event);" tabindex="0" > A checkbox label </span> ... </body> </html>
In this example the support schema will define a checkboxtristate as a type of checkbox (which itself is defined as a type of select). Although it inherits all the supported states of a select, we also expect it to support multiselect and checked set to mixed.
Roles are defined and described by their properties. Properties define the
structural function of a role, such as: What a roles is, concepts behind it , what
it can contain, what it must contain.
In the case of widgets this also includes how it interacts with the user agent
based on mapping to [HTML] forms and [XForms], allowed states and required states.
The are three properties that describe the relationship between concepts. They are:
Type and subclasses- (from RDFS) this implies inheritance, which means, among other things, the inheritance of limitations and properties. Other than well known stable specifications, inheritance may be restricted to items defined inside this specification so that items that can not be changed and affect inherited classes.
For example: Buttonundo is a subclass or type of a button. If we change the properties and expected behavior of a button then the properties and behavior of buttonundo will also change.
relatedConcept - A relatedConcept is a similar or related idea from other specifications Concepts that are related are not necessarily identical. relatedConcepts do not inherit properties from each other. Hence if the definition of a type changes, the properties, behavior and definition of a relatedConcept is not affected.
For example: A grid is like a table. Therefore, a grid has a relatedConcept of a table as defined at http://www.w3.org/TR/html4/struct/tables.html#edef-TABLE. However if the definition of table is modified our definition of a grid will not be affected.
baseConcept - A baseConcept is like a relatedConcept except that a baseConsepts are almost identical. BaseConcept is similar to type, but without inheritance of limitations and properties. baseConcepts are designed as a substitute for inheritance for external concepts.
For example: the checkbox defined in this document has the same functionality and anticipated behavior as a checkbox defined in http://www.w3.org/MarkUp/HTML#checkbox.
Therefore, a checkbox has a baseConcept of a checkbox as defined at http://www.w3.org/MarkUp/HTML#checkbox. However if http://www.w3.org/MarkUp/HTML#checkbox is modified, the definition of a checkbox in this document will not be not affected.
The Roles Taxonomy supports the following additional properties:
Property |
Description |
Values |
Related Concepts |
---|---|---|---|
supportedState | a supportedState must be
supported by this role. Typically refers to states from the aaa [namespace] |
Any valid [RDF] object reference, such as a
URI. |
|
mustContain | A child element that must be contained by this role. For example a list
must contain a listitem. |
Any valid [RDF] object reference, such as a URI or [RDF] ID. |
http://www.w3.org/2004/02/skos/core#subject
OWL Cardinality http://www.w3.org/TR/owl-ref/#CardinalityRestriction |
scope | Context, where this role is allowed. For example a list item is allowed inside a list. | Any valid [RDF] object reference, such as a URI or
[RDF] ID. |
http://www.w3.org/2004/02/skos/core#Concept |
media | The media type, where the Role is allowed - a type of scope | Any valid [RDF] object reference, such as a URI or [RDF] ID. | baseConcept: DC: Format [XForms] media type |
importance | Estimated importance of a role to completion of the main tasks of a
delivery unit. For example a main menu is typically required for a user to be
able to completer the main tasks of a site. A secondary side menu is
typically less important. Hence a main menu has an importance level of one
and secondary side menu may have an importance level of 0.6. |
0 (min) 1 (max) |
|
nameRef | How a role type name is extracted and referenced inside a document. For example the DOM might reference a role by it's title. |
Any valid [RDF] object reference, such as a URI or
[RDF] ID. Recommended values: Child, title, content. |
To support the current user scenario this specification defines roles that A, help define Widgets (For example, a tristate Checkbox) and B, help define page structure (for example, a section header).
Graph of the data model-Picture of the relationships described in the role data model (large)*note: More base types will be added as the working group adds user cases
The following roles are used as base types for applied roles. They are not used by Web Authors and would not be exposed as role definitions for incorporation into a Web page. Base classes are referenced within the taxonomy and are used to build a picture of the role taxonomy class hierarchy within the taxonomy.
Role |
Description |
Inherited Category |
Base and Related Concepts |
Supported states and
properties |
Inherited supported |
|
---|---|---|---|---|---|---|
roletype | Describes the structural and functional purpose of an element. A Role is also a concept. |
DC:Type skos:Concept |
[HTML] role [HTML] Link rel [HTML] Link rev |
describedby |
||
widget | A component of a GUI | roletype | disabled zoom domactive labeledby tabindex |
describedby | ||
input | Generic type for widgets that can have a value | widget | [XForms] input | valuenew |
describedby |
Title |
textbox | Generic type for the inputs that allow free-form text, as their value | input | [XForms] input | readonly
(default set to false) |
describedby |
Title |
select | A form control that allows the user to make selections from a set of choices | input list (see structure) |
multiselectable |
describedby |
Title | |
range | Represents a range of values that can be set by the user. | input | valuemax valuemin |
describedby |
Title |
|
section | A logical part of a DeliveryUnit (page or a document) | document, [DTB], NIMAS, [HTML] link rel |
describedby | Child content or title attribute |
||
sectionhead | A heading without level | [HTML]/[DTB]/NIMAS h1, h2... | hasparent | describedby | Child content or title attribute |
|
window | Browser or application window | application | describedby valuenew disabled zoom domactive labeledby tabindex |
Child content or title attribute |
Widget Roles all map to accessibility API's.
Widget Role |
Description |
Inherited Concepts |
Base and Related Concepts |
New supported states(beyond inherited
states) |
(other then describedby) |
|
---|---|---|---|---|---|---|
link | Interactive reference to a resource (note, that in [XHTML] 2.0 any element can have an href attribute and thus be a link) |
widget | [HTML] Link | disabled zoom domactive labeledby tabindex |
Child content title |
|
combobox | Combobox is a presentation of a select, where you can type to locate a
selected item. NOTE: In [XForms] the same select can have one of 3 appearances: combo-box, drop-down box or group of radio-buttons. Besides, many browsers (if not all of them) allow users to type in a drop-down select as well. |
select | [HTML] select (multiple) | valuenew disabled zoom domactive labeledby tabindex multiselectable hasparent haschild flowto flowfrom |
Title | |
option | A selectable item in a list represented by a Select. | input listitem (see structure) |
ListItem(see structure), [HTML] option, [XForms] item |
selected |
valuenew disabled zoom domactive labeledby tabindex |
Child content title |
checkbox | A control that has two possible states, an equivalent to a boolean | checkboxtristate | [HTML] input (type : checkbox) | checked ="true"|"false" |
valuenew disabled zoom domactive labeledby tabindex selected hasparent haschild flowto flowfrom |
Child content title |
checkboxtristate | A control that has three possible states, (1 0 -1) Often found in installer where an option has been partially installed | option |
checked ="true"|"false"|"mixed" |
valuenew disabled zoom domactive labeledby tabindex selected hasparent haschild flowto flowfrom |
Child content title |
|
radio | A radio is an option in single-select list. |
checkbox | [HTML] input (type : radio) |
valuenew disabled zoom domactive labeledby tabindex selected checked ="true"|"false |
Child content title |
|
radiogroup | Maybe, we would rather have a generic "group of choices" type. |
select | valuenew disabled zoom domactive labeledby tabindex selected multiselectable hasparent haschild flowto flowfrom |
Title
|
||
button | Allows for user-triggered actions. Buttons are mostly used for discrete, atomic actions. Its value is cognitive; the idea that this is a user action opportunity is made very clear by making it look like a front-panel button on a device. The animation of the button in response to indirect (by mouse) manipulation fosters the illusion of direct manipulation and keeps user cognition in sync with the UI perception of user action events. Standardizing the appearance of buttons enhances recognition as buttons and arraying them compactly in toolbars, for example. | widget link |
[XForms] trigger | pressed |
valuenew disabled zoom domactive labeledby tabindex |
Child content title
|
menuitemradio | Indicates that you have a menu item which is part of a group of menuitermradio roles which the checking of one unchecked the rest. Furthermore, when implementing these menuitems should be separate into a group by a separator. | menuitem (see structure) radio |
valuenew disabled zoom domactive labeledby tabindex hasparent |
Child content title |
||
menuitemcheckbox | Defines a menuitem which is checkable (tri-state). | menuitem checkbox |
valuenew disabled zoom domactive labeledby tabindex
|
Child content title
|
||
progressbar |
Used by applications for tasks that take a long time to execute, to show
the execution progress. User understands that the user's action request has been accepted and that the application continues (or ceases, in the case of a static display) to make progress toward completing the requested action. |
widget | disabled zoom domactive labeledby tabindex |
Title | ||
secret |
Provides the user with the ability to supply information to the system in a
manner that makes it difficult for someone, other than the user, who may be
observing the process to discern the value that is being supplied. Uses: passwords on login |
input | [HTML] input (type : password) | valuenew disabled zoom domactive labeledby tabindex |
Title | |
separator | A line or bar that separates and distinguishes sections of content. This is a visual separator between sections of content. Separators are found between lists of menu items in a menu. | widget | [HTML] hr | disabled zoom domactive labeledby tabindex |
Title |
|
slider |
A user input where the user selects an input in a given range. It is a form
of Range that expects an analog keyboard interface. This is a range type for which with the added functionality of being able to select a value from the given range through the use of a visible slider. The slider would be keyboard accessible and provide a visible thumb position that represents the current position within the slider. |
range | step | valuenew disabled zoom domactive labeledby tabindex valuemax valuemin |
Title | |
spinbutton |
A form of Range that expects a user selecting from discreet choices. This is another range type with the added functionality of being able to select from the given range through the use of an up and down button. Visibly, the current value is incremented or decremented to a maximum or minimum value correspondingly. This functionality should be accomplished programmatically through the use of up and down arrows on the keyboard. |
range | step |
valuenew disabled zoom domactive labeledby tabindex valuemax valuemin |
Title | |
textarea |
This is a multi-line editable text box. If a standard form element exists
with this functionality it should be used. Intended use is in languages that do not have a textarea object (such as SVG). The user would use this role when additional states or properties are applied to a standard textarea control. This is to indicate to the user agent that it must process additional states and properties such as invalid and required. |
textbox | [HTML] textarea | valuenew disabled zoom domactive labeledby tabindex readonly |
Title |
|
textfield |
Free-form data entry for short on-line content. Intended use is in languages that do not have a textfield object (such as SVG). The user would use this role when additional states or properties are applied to a standard textarea control. This is to indicate to the user agent that it must process additional states and properties such as invalid and required. |
textbox | [HTML] input (type : text) | valuenew disabled zoom domactive labeledby tabindex readonly |
Child content title |
|
tree | A form of a Select (or, generally, of a list having groups inside groups) - where sub trees can be collapsed and expanded | select | expanded |
disabled zoom domactive labeledby tabindex multiselectable hasparent haschild flowto flowfrom |
Child content title |
|
treegroup | This is a group of sibling tee items that have a common parent. Intended use is for creating groups of treeitems within a tree container. | group | expanded | disabled zoom domactive labeledby tabindex hasparent haschild flowto flowfrom multiselectable |
Child content title |
|
treeitem | An option item of a tree. This is an element within a tree which may be expanded or collapsed | option | checked |
disabled zoom domactive labeledby tabindex selected |
Content child title |
|
status | Process--advisory information. This is a container for process advisory information to give feedback to the user. It must have a subtree. This object typically does not receive focus. Some cells of a Braille display may be reserved to render the status. | widget | disabled zoom domactive labeledby tabindex |
|||
alert | A message with an alert or error information. Alerts are used to convey messages to alert the user. In the case of audio warnings this is an accessible alternative for a hearing impaired user. The Alert role goes on the container of the subtree containing the alert message. | status | [XForms] alert | disabled zoom domactive labeledby tabindex |
Title | |
alertdialog | A window with an alert or error information. Alerts are used to convey messages to alert the user. In the case of audio warnings this is an accessible alternative for a hearing impaired user. The Alert role goes on the container of the subtree containing the alert message. | alert dialog |
[XForms] alert | disabled zoom domactive labeledby tabindex haspopup |
Title | |
dialog | A dialog is a small application window that sits above the application and is designed to interrupt the current processing of an application in order to prompt the user to enter information or require a response. Dialog boxes should have a title. They must have a focused item. | window | disabled zoom domactive labeledby tabindex haspopup |
Title |
Roles for document structure are also required to support the accessibility of
dynamic Web content to assist adaptive technology in determining active content vs.
static document content. Structural Roles, by themselves do not all map to
accessibility API's, but are used to create widget roles or assist content
adaptation.
This schema is likely to evolve as new use cases are added to the scope of this
specification.
Roles |
Description |
Inherited Category |
Base and Related Concepts | domRef or Not Mapped to Accessibility API's |
Support ed states |
scope and mustcontain |
---|---|---|---|---|---|---|
presentation |
An element who's role is Presentational does not need to be mapped to the
accessibility API. Intended use is when an element is used to change the look of the page but does not have all the functional, interactive, or structural relevance implied by the element type. Example use cases:
The user agent may remove all structural aspects of the element being repurposed. For example a table marked as presentation would remove the table, td, th, tr, etc. elements while preserving the individual text elements within it. Because the AT knows to ignore the structural aspects implied in a table, no harm is done by using a table for layout. |
[Device Independence Glossary]: Task |
Not Mapped |
|||
application |
A software unit executing a set of tasks for its users Intended is to hint to the assistive technology to switch its normal browsing mode functionality to one in which they would for an application. Use case: In an email application it has a document and an application in it. The author would want to use typical application navigation mode to cycle through the list of emails. Much of this navigation would be defined by the application author. However, when reading an email message the ATV will want to switch to a document mode where it controls browsing navigation. |
[Device Independence Glossary]: Task/ deliveryunit |
Name from title attribute |
|||
document | Content that contains information, such as a book. The document role is used to tell the screen reader to switch back to its normal document browsing mode. Screen readers consume most of the keyboard navigation keys to provide its own keyboard UI for this type of navigation. |
subpageof
[Device Independence Glossary]: Task/ deliveryunit |
Name from title attribute |
|||
group |
A group is a collection of sections or user interface objects that should
be presented to the user in a coherent fashion. Group members that are outside the DOM subtree of the group would need to have explicit relationships assigned to participate in the group. Groups may be nested. |
section | DC: Collection, Dataset |
Name from title attribute |
hasparent haschild flowto flowfrom |
mustContain sections |
imgroup | An imgroup is a container for a collection elements that form an image. An imgroup can captions, and descriptive text as well as multiple image files that when viewed together give the impression of a single image. | group | DAISY , [DTB] imgroup |
Name from title attribute |
hasparent haschild flowto flowfrom
|
mustContain sections |
directory | A list of references to members of a single group. | list | DAISY [DTB]:TOC |
Name from child content or title attribute |
hasparent haschild flowto flowfrom
|
|
region |
A group of elements that together form a perceivable unit, that the author
feels should be included in a summary of page features. A region must have
a title. A region does not necessarily follow the logical structure of the content, but follows the perceivable structure of the page. [XHTML]2 standard document roles would be considered regions. Each region must have a title. |
section |
[HTML] Frame
device independence glossary: perceivable unit. related concept: section |
Name from title attribute |
expanded labeledby hasparent haschild flowto flowfrom controls |
|
liveregion |
This is a region of a web page that is likely to change. This is a region
of the page which responds to a push, a timed change, or a user event, such
as AJAX controlled regions. Properties that define this type of changes are not limited to this region. |
region |
Name from title attribute |
disabled controledby expanded labeledby controls hasparent haschild flowto flowfrom |
||
log | A liveregion where new information is added and old information may disappear such as, chat logs, messaging, game log or an error log. | liveregion |
Name from title attribute |
disabled controledby expanded labeledby controls hasparent haschild flowto |
||
grid |
A grid is a table type that may be editable. Grids contain cells that may
be focusable. Grids allow the user to move focus between grid cells with
2-D navigation. Grids may have row and column headers which also have
functional value based on the implementation. Grid cells may have values
determined by an equation. Grids are single selectable or mutliselectable. Properties for selectable or mulitselectable must be provided by the author. Grids may be used for spreadsheets such as in Open Office, Microsoft Office, etc. |
table |
[HTML] table |
Name from title attribute |
hasparent haschild flowto flowfrom disabled controledby labeledby controls |
mustcontain: gridcells |
gridcell | A cell in a grid. Cells may have relationships such as (controller_for controlled_by) to address the application of functional relationships. |
section |
[HTML] td |
Name from child content or title attribute |
hasparent haschild flowto flowfrom disabled controledby readonly labeledby controls valuenew zoom domactive tabindex |
|
tabpanel | A visual presentation of a section. Tabpanels are commonly used in applications that have a large number of options that can be categorized in logical groups. The Tabpanels serve three functional components, including a menu bar of groupings, a selected grouping and set of resources associated with that group. Each tab in a tablist serves as both a menu item and as a title for the tab content associated with the tab. In graphical renderings the selected Tab and TabContent usually share the same background color and the non-selected tabs have a different background color to make the selected Tab and TabContent stand out visually and provide a visual association with the Tab and TabContent. Only one tabpanel's contents is visible at a time. | group |
Name from title attribute |
hasparent haschild flowto flowfrom |
||
tab | A tab is a tabpanel header. Tab is used as a grouping label, providing a link for selecting the resources associated with the group to be rendered to the user. One of the tabs in tablist must be the current tab and the tabpanel, associated with the tab, must be rendered to the user. Other tabpanels are typically hidden from the user, until the user selects the tab associated with that tabpanel. The currently selected tab should be marked with selected=true.tablist is the container for a set of elements with the role attribute set to tab. Only one tab may be selected at a time. At any time, one tab must be selected. | sectionhead |
Name from child content or title attribute |
hasparent haschild selected |
scope: tabPanel | |
tabcontent | Tabcontent is a container for the resources associated with a tab. Note: There must be a means to associate a content container element with its associated tab in a tablist. | region |
Name from title attribute |
expanded labeledby hasparent haschild flowto flowfrom controls |
||
table |
A table contains cells of tabular data arranged in rows and columns. The table role is used as a container for tabular data. The table construct describes relationships between data such that it may also be used for different presentations. For example, the role of a table could be added to a pie chart. This does not imply presentation. It is structural equivalent to an [XHTML] table. In [XHTML], a user should use table. |
group | [HTML] table |
Name from title attribute |
hasparent haschild flowto flowfrom |
|
td | A table cell containing data. | section | [HTML] td | Name from child content or title attribute | hasparent haschild flowto flowfrom |
|
th | A table cell containing header information. | id="L171106"sectionhead td |
[HTML] th |
Name from child content or title attribute |
hasparent haschild flowto flowfrom |
scope: TD |
rowheader | A table cell containing header information for a row. The rowheader establishes a relationship between it and all cells in the corresponding row. It is a structural equivalent to an HTML th with a row scope. This would be used as a row header in a table or grid. It also could be used in a pie chart to show a similar relationship in the data. | th | [HTML] th with scope= row |
Name from child content or title attribute |
hasparent haschild flowto flowfrom |
scope: TD |
columnheader | A table cell containing header information for a column. The columnheader establishes a relationship between it and all cells in the corresponding row. It is a structural equivalent to an HTML th with a column scope. This would be used as a column header in a table or grid. It also could be used in a pie chart to show a similar relationship in the data. | th | [HTML] th with scope= column |
Name from child content or title attribute |
hasparent haschild flowto flowfrom |
scope: TD |
list | Group of small items | group | [HTML] list |
Name from title attribute |
hasparent haschild flowto flowfrom |
|
listitem | An entry in a list. | section |
[XForms] item [HTML] li |
Name from child content or title attribute |
hasparent haschild flowto flowfrom |
|
menu | Offers a list of choices like a GUI menu. Often a list of links to important sections of a Document or a Site. |
widget |
navigation in [HTML] roles see http://www.w3.org/ TR/2005/WD-xhtml2-20050527 /mod-role.html#col_Role [XForms] select |
Name from title attribute |
hasparent haschild flowto flowfrom |
mustcontain: menuitems |
toolbar |
A toolbar is a collection of commonly used functions represented in compact
visual form. The toolbar is a subset of functions found in a menubar designed minimize real estate and conserve user device interaction. If this is not keyboard accessible the actions defined in the toolbar must be reproduced in an accessible, device independent fashion. |
menu | menubar |
Name from title attribute |
hasparent haschild flowto flowfrom |
|
menubar |
A container that contains menu items. Each menu item may activate a menu.
Navigation behavior should be similar to a GUI menu bar It is used to create a menubar similar to those found in Windows, the Mac, and Gnome desktops. A menubar is used to create a consistent climate of frequently used commands. |
menu | toolbar |
Name from title attribute |
hasparent haschild flowto flowfrom |
|
menuitem | A link in a menu. This is an option in a group of choices contained in a menu. It may be disabled or active. It may also have a popup. | listitem | [XForms] option |
Name from child content or title attribute |
haspopup | |
breadcrumbs | Bread crumb navigation list. Each element in the list is a representation of hiearchary represented linearly. The logical order of the text begins with the root element. | menu |
Name from child content or title attribute |
hasparent haschild flowto flowfrom |
scope: links |
This section is informative.
An application becomes accessible when:
Roles make the different elements in the application semantically rich. User agents use the role semantics to understand how to handle each element. Roles can be used to build accessible applications by providing any missing information that the assistive technology needs to anticipate the behavior of the elements inside the application.
For example, to support accessibility the browser may create accessible objects of a web page though the Accessibility API of the operating system. When the full semantics are provided and understood by the browser, the application will properly map the page to accessible objects of the operating system.
This section is informative.
Use the semantic elements that are defined in the native markup language. For example, if you are using [XHTML] it is better to use the [XHTML] checkbox than to use a div element with role checkbox. Because properly used [XHTML] content is already repurposible, roles are best used when the mark up language does not support all the semantics that you need. When a role is used the semantics and behavior of the element are overridden by the role behavior.
Set roles to make sure elements behave predictably and that correctly describes the behavior of each element within your application (unless elements behaviors are fully described by the native markup language). Roles for interactive elements should support all the states that the element could use.
Look for groups within a page, and mark them using the most appropriate role that best describes their usage.
For example: a region of the page that is contains a group of elements that are likely to change through an AJAX application could be tagged as a "liveregion".
Look for relationships between groups and mark the using the most appropriate property or attribute.
Sometimes the relationships can be made clear via the native mark up language, such as the label tag in [<a href="#ref_HTML">HTML</a>].
Sometimes this can be implied via the DOM. For example, when a well marked up list contains list items it is known that they belong to the containing list. In such cases you do not need to set additional properties to make that explicit.
In other cases use the states and adaptable properties module to state relationships. For example: if a container A contains search results, and container B contains the search controls, the mark each container as a region and set the aaa:controledby property in region B to region A.
Extra states and properties have been provided by the States and Adaptable Properties Module. For example: If the user is required to fill in a form element set the aaa:required property to true.
An important addition in the States and Adaptable Properties Module is new extensions of TABINDEX. Now, with the TABINDEX change, the author is allowed to give any element keyboard focus (and not just form elements or anchors). In this paradigm shift, the user experience should be to use tabbing or keyboard mnemonics to move focus to widgets on the web page and then use the arrow keys to navigate the object.
A basic tree view allows the user to select different list items and expand and collapse embedded lists. Arrow keys are used to navigate through a tree, including left/right to collapse/expand sub trees. Double clicking with mouse also toggles expansion.
There is no a tree element in [XHTML] 1.0 that supports our behavior including expansion, so we will need to use roles. Therefore, our first step is setting roles.
Our tree will need roles that support embedded list behavior and expandable/collapsible embedded lists. The roles that support tree behavior for a tree are:
Tree: the main container element for our treeA form of a Select (or, generally, of a list having groups inside groups) - where sub trees can be collapsed and expanded.
Treegroup: This is a group of sibling tee items that have a common parent. Intended use is for creating groups of treeitems within a tree container.
Treeitem: An option item of a tree. This is an element within a tree which may be expanded or collapsed.
Tree relationships can be made simply via the Dom and logical structure of your page.
A tree element will be the main container containing all other elements in the tree.
Each selectable item in the tree will be a treeitem
When a tree item contains a embedded list of tree items they will be all embedded in a treegroup. A treegroup should be contained inside the tree item that is the parent item.
Tree relationships are like list relationships in [XHTML]. A treegroup and tree elements act like list containers (OL and UL). A tree item acts like a list item (li) in [XHTML].
Because treeitems and treegroups are commonly both use div elements it is recommended to ad a comment next to closing treeitems that contain embedded tree groups
<div x2:role="wairole:tree" >
<div x2:role="wairole:treeitem" >Veggies
<div x2:role="wairole:treegroup">
<div x2:role="wairole:treeitem">Green
<div x2:role="wairole:treegroup">
<div x2:role="wairole:treeitem">Asparagus</div>
<div x2:role="wairole:treeitem">Kale</div>
<div x2:role="wairole:treeitem" >Leafy
<div x2:role="wairole:treegroup">
<div x2:role="wairole:treeitem">Lettuce</div>
<div x2:role="wairole:treeitem">Kale</div>
<div x2:role="wairole:treeitem">Spinach</div>
<div x2:role="wairole:treeitem">Chard</div>
</div>
</div> ---close leafy
<div x2:role="wairole:treeitem">Green beans</div>
</div>
</div> ---close green
<div x2:role="wairole:treeitem">Legumes</div>
<div x2:role="wairole:treeitem" >Yellow
<div x2:role="wairole:treegroup">
<div x2:role="wairole:treeitem">Bell peppers</div>
<div x2:role="wairole:treeitem">Squash</div>
</div>
</div> ---close yellow
</div>
</div> ---close veggies </div> ---close tree
Sometimes a tree structure is not explicit via the Dom and logical structure of a page. In such cases the relationships must still be made explicit using the properties module.
Example:
<div x2:role="wairole:treeitem" aaa:haschild=yellowtreegroup”>Yellow<div>
..
<div id="yellowtreegroup" x2:role="wairole:treegroup">
<div x2:role="wairole:treeitem">Bell peppers</div>
<div x2:role="wairole:treeitem">Squash</div>
</div>
Although this is allowed it may affect performance
Control the behavior of the element using Events and states,
For example, use the aaa name space with supporting scripts to control what tree elements are expanded
<div tabindex="-1" x2:role="wairole:treeitem" aaa:expanded="true">Yellow</div>
And use events to device independent events with supporting javascripts to handle user interaction.
<div x2:role="wairole:tree" tabindex="-1"
onfocus="return treeItemFocus(event);"
onclick="return treeItemEvent(event);"
ondblclick="return treeItemEvent(event);"
onkeydown="return treeItemEvent(event);"
onkeypress="return treeItemEvent(event);">
Then create javascript support to control the event driven behavior or the application.
This section is normative.
The keywords "MUST", "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", "SHOULD", "RECOMMENDED", "MAY", and "OPTIONAL" in this document are to be interpreted as described in [RFC2119].
Roles for [RDF] and XML is not a stand-alone document type. It is intended to be integrated into other host languages such as [XHTML]. A conforming document requires only the facilities described as mandatory in this specification and the facilities described as mandatory in its host language. Such a document must meet all the following criteria:
xmlns
declaration for the role [namespace]. The namespace for Roles is defined to be
http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#
An example start tag of a root element might look like:
<html xmlns="http://www.w3.org/2002/06/xhtml2" xml:lang="en"
xmlns:wairole="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#" >
Note: In XML languages without the Role attribute name included, the Role
attribute name can be added from the [XHTML] 2.0 [namespace].
For example:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:x2="http://www.w3.org/2002/06/xhtml2" xmlns:wairole="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#">
When Roles are included in a host language, all of the facilities required in
this specification must be included in the host language.
A conforming user agent must reference the role information reference in the
DOM.
However it is advised that a conforming user agent also allows for roles to be
extended via [RDF] . When a role from a different
specification extends or inherits from a role in this specification, then that role
should also be supported at least to the extent that the original role is
supported.
This section is informative.
Roles are extendable using [RDF]. It is not recommended to extend roles unless you are familiar with [RDF] syntax specification.
Using RF syntax set properties to make the definition rich. This includes:
A widget role is one that has inherited properties from widgets. You may only inherit from one widget role. Inherence from other types of roles is not restricted.
New roles will slow down application performance. Therefore, you should probably only extend roles when:
Note: This RDF is still in draft form and changes from last draft have not been validated. Some related concepts may be missing.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE rdf:RDF [
<!ENTITY xsd "http://www.w3.org/2001/XMLSchema#">
<!ENTITY dc "http://dublincore.org/2003/03/24/dces#">
<!ENTITY owl "http://www.w3.org/2002/07/owl#">
<!ENTITY rdfs "http://www.w3.org/2000/01/rdf-schema#">
<!ENTITY rdf "http://www.w3.org/1999/02/22-rdf-syntax-ns#">
<!ENTITY states "http://www.w3.org/2005/01/aaa#">
<!ENTITY skos "http://www.w3.org/2004/02/skos/core#">
]>
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:rdfs="http://www.w3.org/2000/01/rdf-schema#"
xmlns:dc="http://purl.org/dc/elements/1.1/#"
xmlns:owl="http://www.w3.org/2002/07/owl#"
xmlns:role="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#"
xmlns:skos="http://www.w3.org/2004/02/skos/core#"
xml:base="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy">
<owl:ObjectProperty rdf:ID="relatedConcept">
<rdfs:comment xml:lang="en">The URI of similar/related types from other
specifications (See SKOS)</rdfs:comment>
<rdfs:domain rdf:resource="&xsd;anyURI"/>
</owl:ObjectProperty>
<owl:ObjectProperty rdf:ID="baseConcept">
<rdfs:comment xml:lang="en">This is similar to type but without
inheritance of limitations and properties. role:baseConcepts are designed as a
substitute for inheritance for external concepts. </rdfs:comment>
<rdfs:sub propertyOf rdf:resource="#role:relatedConcept"/>
</owl:ObjectProperty>
<owl:ObjectProperty rdf:ID="supportedState">
<rdfs:comment xml:lang="en">A state that can be supported for this a
Role</rdfs:comment>
<rdfs:domain rdf:resource="#Widget"/>
</owl:ObjectProperty>
<owl:ObjectProperty rdf:ID="scope">
<rdfs:comment xml:lang="en">Context where this role is
allowed</rdfs:comment>
<rdfs:domain rdf:resource="#role"/>
</owl:ObjectProperty>
<owl:ObjectProperty rdf:ID="mustContain">
<rdfs:comment xml:lang="en">A child that must be contained by this
role</rdfs:comment>
<rdfs:sub propertyOf rdf:resource="#role:scope"/>
</owl:ObjectProperty>
<owl:ObjectProperty rdf:ID="media">
<rdfs:comment xml:lang="en">The media type, where the Role is allowed - a
type of role:scope, simmilar to DC: Format or media
type</rdfs:comment>
<rdfs:sub propertyOf rdf:resource="#role:scope"/>
</owl:ObjectProperty>
<owl:ObjectProperty rdf:ID="default">
<rdfs:comment>Default value of a supported state in the context of this
role</rdfs:comment>
</owl:ObjectProperty>
<owl:ObjectProperty rdf:ID="importance">
<rdfs:comment>relative importance of a role (0 -
1)</rdfs:comment>
<rdfs:domain rdf:resource="&xsd;anyURI"/>
</owl:ObjectProperty>
<owl:ObjectProperty rdf:ID="nameRef">
<rdfs:comment>How a role type name is extracted and referenced inside a
document. For example the DOM might reference a role by it's
title.</rdfs:comment>
<rdfs:domain rdf:resource="#Widget"/>
<rdfs:Range/>
</owl:ObjectProperty>
<owl:Class rdf:ID="roletype">
<rdfs:comment>This is a draft resource for adding semantic annotations and
information to Web resources. Knowing what the types of content are in a Web page
allows for better customized renderings. Including want to allow information
hiding, or rendering common types of content in a consistent way - it makes the
Web easer to use and more accessibility. You can also use this for device
independence so that content is better formatted to fit on the device.
</rdfs:comment>
<rdfs:subClassOf>
<owl:Restriction>
<owl:onProperty rdf:resource="dc:description"/>
<owl:cardinality
rdf:datatype="&xsd;string">1</owl:cardinality>
</owl:Restriction>
</rdfs:subClassOf>
<rdfs:comment>You have to give each content type a title and description
sorry folks (just be glad I did not put a min length on the
description</rdfs:comment>
<rdfs:comment>These are the required properties - however we recommend
also using role:importance. </rdfs:comment>
<role:supportedState rdf:resource="&states;importance"/>
<role:supportedState rdf:resource="&states;describedby"/>
</owl:Class>
<owl:Class rdf:ID="widget">
<rdfs:subClassOf rdf:resource="#roletype"/>
<dc:description xml:lang="en">A widget is a base class for widgets.
</dc:description>
<role:supportedState rdf:parseType="Resource">
<rdfs:value>states:disabled</rdfs:value>
<role:default>false</role:default>
</role:supportedState>
<role:supportedState rdf:resource="&states;zoom"/>
<role:supportedState rdf:resource="&states;domactive"/>
<role:supportedState rdf:resource="&states;tabindex"/>
<role:supportedState rdf:resource="&states;labelledby"/>
</owl:Class>
<owl:Class rdf:ID="input">
<rdfs:subClassOf rdf:resource="#widget"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/interact/forms.html#edef-INPUT"/>
<dc:description xml:lang="en">An input is a base class for widgets that
have a value. </dc:description>
<role:domRef rdf:resource="&states;title"/>
<role:supportedState rdf:resource="&states;valuenew"/>
</owl:Class>
<owl:Class rdf:ID="textbox">
<rdfs:subClassOf rdf:resource="#input"/>
<dc:description xml:lang="en">A textbox is a base class for widgets that
have a free-form text value. </dc:description>
<role:domRef rdf:resource="&states;Childcontent"/>
<role:supportedState rdf:resource="&states;readonly"/>
</owl:Class>
<owl:Class rdf:ID="link">
<rdfs:subClassOf rdf:resource="#widget"/>
<dc:description xml:lang="en">Interactive reference.
</dc:description>
<role:domRef rdf:resource="&states;title"/>
<role:domRef rdf:resource="&states;Child content"/>
</owl:Class>
<owl:Class rdf:ID="select">
<rdfs:subClassOf rdf:resource="#list"/>
<rdfs:subClassOf rdf:resource="#input"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/interact/forms.html#edef-SELECT"/>
<role:relatedConcept rdf:resource="#list"/>
<role:mustContain rdf:resource="#option"/>
<dc:description xml:lang="en">A select is an Input that allows the user to
make selections from a set of choices. </dc:description>
<role:supportedState rdf:resource="&states;multiselectable"/>
</owl:Class>
<owl:Class rdf:ID="combobox">
<rdfs:subClassOf rdf:resource="#select"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/interact/forms.html#edef-SELECT"/>
<role:relatedConcept rdf:resource="#list"/>
<role:mustContain rdf:resource="#option"/>
<dc:description xml:lang="en">A combobox is a sellect with a specific
presentation. </dc:description>
</owl:Class>
<owl:Class rdf:ID="radiogroup">
<rdfs:subClassOf rdf:resource="#select"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/interact/forms.html#edef-SELECT"/>
<role:relatedConcept rdf:resource="#list"/>
<role:mustContain rdf:resource="#radio"/>
<dc:description xml:lang="en">A select containing radio-buttons, instead
of options. </dc:description>
</owl:Class>
<owl:Class rdf:ID="Option">
<rdfs:subClassOf rdf:resource="#input"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/interact/forms.html#edef-OPTION"/>
<role:relatedConcept rdf:resource="#listitem"/>
<role:scope rdf:resource="#select"/>
<dc:description xml:lang="en">An option is a selectable item in a list
represented by a Select. </dc:description>
<role:supportedState rdf:parseType="Resource">
<rdfs:value>states:selected</rdfs:value>
<role:default>false</role:default>
</role:supportedState>
<role:domRef rdf:resource="&states;Child conten"/>
</owl:Class>
<owl:Class rdf:ID="checkbox">
<rdfs:subClassOf rdf:resource="#checkboxtristate"/>
<dc:description xml:lang="en">A checkbox is an input that has two possible
values, an equivalent to a boolean. </dc:description>
<rdfs:comment
xml:lang="en">checked="true"|"false"</rdfs:comment>
<role:domRef rdf:resource="&states;Child content"/>
</owl:Class>
<owl:Class rdf:ID="checkboxtristate">
<rdfs:subClassOf rdf:resource="#option"/>
<dc:description xml:lang="en">A checkboxtristate is a control that has
three possible states. </dc:description>
<rdfs:comment
xml:lang="en">checked="true"|"false"|"mixed"</rdfs:comment>
<role:supportedState rdf:parseType="Resource">
<rdfs:value>states:checked</rdfs:value>
<role:default>false</role:default>
</role:supportedState>
</owl:Class>
<owl:Class rdf:ID="radio">
<rdfs:subClassOf rdf:resource="#checkbox"/>
<dc:description xml:lang="en">An option in single-select list.
</dc:description>
</owl:Class>
<owl:Class rdf:ID="menuitemcheckbox">
<rdfs:subClassOf rdf:resource="#checkbox"/>
<role:relatedConcept rdf:resource="#menuitem"/>
<role:scope rdf:resource="#menu"/>
<dc:description xml:lang="en">A menuitemcheckbox is a checkbox that is
inside a menu, next to a menu item. </dc:description>
</owl:Class>
<owl:Class rdf:ID="menuitemradio">
<rdfs:subClassOf rdf:resource="#radio"/>
<role:relatedConcept rdf:resource="#menuitem"/>
<role:scope rdf:resource="#menu"/>
<dc:description xml:lang="en">A menuitemradio is a radio-button that is
inside a menu, next to a menu item. </dc:description>
</owl:Class>
<owl:Class rdf:ID="button">
<rdfs:subClassOf rdf:resource="#widget"/>
<rdfs:subClassOf rdf:resource="#link"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/interact/forms.html#edef-BUTTON"/>
<role:relatedConcept rdf:resource="#link"/>
<dc:description xml:lang="en">A button is a widget that allows for
user-triggered actions. </dc:description>
<role:supportedState rdf:parseType="Resource">
<rdfs:value>states:pressed</rdfs:value>
<role:default>false</role:default>
</role:supportedState>
<role:domRef rdf:resource="&states;Child content"/>
</owl:Class>
<owl:Class rdf:ID="progressbar">
<rdfs:subClassOf rdf:resource="#widget"/>
<dc:description xml:lang="en">Progressbar is a widget used by applications
to show the execution progress for tasks that take a long time to execute.
</dc:description>
</owl:Class>
<owl:Class rdf:ID="separator">
<rdfs:subClassOf rdf:resource="#widget"/>
<dc:description xml:lang="en">A separator is a line or bar that separates
and distinguishes sections of content. </dc:description>
</owl:Class>
<owl:Class rdf:ID="secret">
<rdfs:subClassOf rdf:resource="#input"/>
<dc:description xml:lang="en">A secret input provides the user with the
ability to supply information to the system in a manner that makes it difficult
for someone, other than the user, who may be observing the process to discern the
value that is being supplied.</dc:description>
</owl:Class>
<owl:Class rdf:ID="range">
<rdfs:subClassOf rdf:resource="#input"/>
<dc:description xml:lang="en">A range is an input that restricts the user
to a range of values.</dc:description>
<role:supportedState rdf:resource="&states;valuemax"/>
<role:supportedState rdf:resource="&states;valuemin"/>
</owl:Class>
<owl:Class rdf:ID="slider">
<rdfs:subClassOf rdf:resource="#range"/>
<dc:description xml:lang="en">A slider is a range input thatthat restricts
the user to a range of values and expects an analog keyboard
interface.</dc:description>
<role:supportedState rdf:resource="&states;step"/>
</owl:Class>
<owl:Class rdf:ID="spinbutton">
<rdfs:subClassOf rdf:resource="#range"/>
<dc:description xml:lang="en">A spinbutton is a range input that restricts
the user to a range of values, and expects discreet
choices..</dc:description>
<role:supportedState rdf:resource="&states;step"/>
</owl:Class>
<owl:Class rdf:ID="textarea">
<rdfs:subClassOf rdf:resource="#textbox"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/interact/forms.html#edef-TEXTAREA"/>
<dc:description xml:lang="en">A textarea is a textbox input intended for
use in entering multi-line content.</dc:description>
</owl:Class>
<owl:Class rdf:ID="textfield">
<rdfs:subClassOf rdf:resource="#textbox"/>
<dc:description xml:lang="en">A textfield is a textbox input intended for
free-form data entry for short on-line content.</dc:description>
</owl:Class>
<owl:Class rdf:ID="tree">
<rdfs:subClassOf rdf:resource="#select"/>
<role:baseConcept rdf:resource="#chart"/>
<role:mustContain rdf:resource="#treeitem"/>
<dc:description xml:lang="en">A tree is a select, where groups of options
(sub-trees) can be collapsed and expanded.</dc:description>
<role:supportedState rdf:resource="&states;expanded"/>
</owl:Class>
<owl:Class rdf:ID="treegroup">
<rdfs:subClassOf rdf:resource="#group"/>
<role:mustContain rdf:resource="#treeitem"/>
<role:scope rdf:resource="#tree"/>
<dc:description xml:lang="en">This is a group of sibling tee items that
have a common parent. Intended use is for creating groups of treeitems within a
tree container.</dc:description>
<role:supportedState rdf:resource="&states;expanded"/>
</owl:Class>
<owl:Class rdf:ID="treeitem">
<rdfs:subClassOf rdf:resource="#option"/>
<role:scope rdf:resource="#tree"/>
<dc:description xml:lang="en">A treeitem is an option item of a
tree.</dc:description>
<role:supportedState rdf:resource="&states;checked"/>
</owl:Class>
<owl:Class rdf:ID="dialog">
<rdfs:subClassOf rdf:resource="#window"/>
<dc:description xml:lang="en">A dialog is a (small) application
window.</dc:description>
</owl:Class>
<owl:Class rdf:ID="alert">
<rdfs:subClassOf rdf:resource="#status"/>
<dc:description xml:lang="en">An alert is a dialog with inportant alert or
error information.</dc:description>
</owl:Class>
<owl:Class rdf:ID="alertdialog">
<rdfs:subClassOf rdf:resource="#dialog"/>
<rdfs:subClassOf rdf:resource="#alert"/>
<dc:description xml:lang="en">An alert is a dialog with inportant alert or
error information.</dc:description>
</owl:Class>
<owl:Class rdf:ID="status">
<rdfs:subClassOf rdf:resource="#widget"/>
<dc:description xml:lang="en">Process--advisory information. This is a
container for process advisory information to give feedback to the
user.</dc:description>
</owl:Class>
<owl:Class rdf:ID="deliveryunit">
<rdfs:subClassOf rdf:resource="#roletype"/>
<dc:description xml:lang="en">A deliveryunit is structure that is
delivered to the client </dc:description>
<role:supportedState rdf:resource="&states;describedby"/>
<role:supportedState rdf:resource="&states;labelledby"/>
</owl:Class>
<owl:Class rdf:ID="task">
<rdfs:subClassOf rdf:resource="#deliveryunit"/>
<dc:description xml:lang="en">A task is a delivery unit that is delivered
to the client to perform a specific task </dc:description>
</owl:Class>
<owl:Class rdf:ID="presentation">
<rdfs:subClassOf rdf:resource="#task"/>
<dc:description xml:lang="en">An element who's role is Presentational does
not need to be mapped to the accessibility API</dc:description>
</owl:Class>
<owl:Class rdf:ID="application">
<rdfs:subClassOf rdf:resource="#task"/>
<dc:description xml:lang="en">An application is a software unit task
executing a set of sub tasks for its users</dc:description>
</owl:Class>
<owl:Class rdf:ID="document">
<rdfs:subClassOf rdf:resource="#deliveryunit"/>
<dc:description xml:lang="en">A document is a unit of content, such as
text, that together conveys information. The document role is used to tell the
screen reader to switch back to its normal document browsing
mode.</dc:description>
</owl:Class>
<owl:Class rdf:ID="section">
<role:relatedConcept
rdf:resource="http://www.loc.gov/nls/z3986/v100/dtbook110doc.htm#frontmatter"/>
<role:relatedConcept
rdf:resource="http://www.loc.gov/nls/z3986/v100/dtbook110doc.htm#level"/>
<role:relatedConcept
rdf:resource="http://www.w3.org/TR/REC-smil/#par"/>
<dc:description xml:lang="en">A section is a logical part of a
DeliveryUnit (page or a item) </dc:description>
<role:supportedState rdf:resource="&states;hasparent"/>
<role:supportedState rdf:resource="&states;haschild"/>
<role:supportedState rdf:resource="&states;flowto"/>
<role:supportedState rdf:resource="&states;flowfrom"/>
</owl:Class>
<owl:Class rdf:ID="window">
<rdfs:subClassOf rdf:resource="#application"/>
<dc:description xml:lang="en">A window refers to a browser or application
window</dc:description>
<role:supportedState rdf:resource="&states;expanded"/>
<role:supportedState rdf:resource="&states;subpageof"/>
</owl:Class>
<owl:Class rdf:ID="region">
<rdfs:subClassOf rdf:resource="#group"/>
<dc:description xml:lang="en">A group of elements that together form a
perceivable unit, that the author feels should be included in a summary of page
features. A region must have a title.</dc:description>
<role:supportedState rdf:resource="&states;expanded"/>
<role:supportedState rdf:resource="&states;labeledby"/>
<role:supportedState rdf:resource="&states;controls"/>
</owl:Class>
<owl:Class rdf:ID="group">
<rdfs:subClassOf rdf:resource="#section"/>
<role:mustContain rdf:resource="#section"/>
<dc:description xml:lang="en">A group is a collection of sections, and is
also itself a section. It defines a set or sub set. </dc:description>
</owl:Class>
<owl:Class rdf:ID="imggroup">
<rdfs:subClassOf rdf:resource="#group"/>
<dc:description xml:lang="en">A img group is a container for a collection
elements that form an image.</dc:description>
</owl:Class>
<owl:Class rdf:ID="list">
<rdfs:subClassOf rdf:resource="#group"/>
<dc:description xml:lang="en">a list is a group of small
items</dc:description>
<role:mustContain rdf:resource="listitem"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/struct/lists.html#edef-UL"/>
</owl:Class>
<owl:Class rdf:ID="listitem">
<rdfs:subClassOf rdf:resource="#section"/>
<dc:description xml:lang="en">A listitem is an entry or item in a
list.</dc:description>
<role:scope rdf:resource="list"/>
<role:baseConcept
rdf:resource="http://www.w3.org/TR/html4/struct/lists.html#edef-LI"/>
</owl:Class>
<owl:Class rdf:ID="directory">
<rdfs:subClassOf rdf:resource="#list"/>
<role:scope rdf:resource="group"/>
<dc:description xml:lang="en">A list of references to members of a single
group.</dc:description>
<role:mustContain rdf:resource="link"/>
</owl:Class>
<owl:Class rdf:ID="liveregion">
<rdfs:subClassOf rdf:resource="#region"/>
<role:mustContain rdf:resource="tiles"/>
<dc:description xml:lang="en">This is a region of a web page
that is likely to change. This is a region of the page which responds to a push,
a timed change, or a user event, such as AJAX controlled
regions
</dc:description>
<role:supportedState rdf:resource="&states;disabled"/>
<role:supportedState rdf:resource="&states;controlledby"/>
</owl:Class>
<owl:Class rdf:ID="log">
<rdfs:subClassOf rdf:resource="#liveregion"/>
<dc:description xml:lang="en">A liveregion where new
information is added and old information may disappear such as, chat logs,
messaging, game log or an error log..</dc:description>
</owl:Class>
<owl:Class rdf:ID="grid">
<rdfs:subClassOf rdf:resource="#table"/>
<rdfs:subClassOf rdf:resource="#widget"/>
<role:relatedConcept
rdf:resource="http://www.w3.org/TR/html4/struct/tables.html#edef-TABLE"/>
<dc:description xml:lang="en">A grid is a visual presentation of a group
of data.A grid is a table type that may be editable. Grids contain
cells that may be focusable. Grids allow the user to move focus between grid
cells with 2-D navigation. Grids may have have row and column headers which also
have functional value based on the implementation. Grid cells may have values
determined by an equation. </dc:description>
<role:mustContain rdf:resource="gridcell"/>
<role:supportedState rdf:resource="&states;disabled"/>
<role:supportedState rdf:resource="&states;controlledby"/>
<role:supportedState rdf:resource="&states;labeledby"/>
<role:supportedState rdf:resource="&states;controls"/>
</owl:Class>
<owl:Class rdf:ID="gridcell">
<rdfs:subClassOf rdf:resource="#section"/>
<rdfs:subClassOf rdf:resource="#textarea"/>
<role:relatedConcept
rdf:resource="http://www.w3.org/TR/html4/struct/tables.html#edef-TD"/>
<dc:description xml:lang="en">A gridcell is a section inside a
grid</dc:description>
<role:scope rdf:resource="grid"/>
<role:supportedState rdf:resource="&states;controlledby"/>
<role:supportedState rdf:resource="&states;controls"/>
</owl:Class>
<owl:Class rdf:ID="tab">
<rdfs:subClassOf rdf:resource="#sectionhead"/>
<dc:description xml:lang="en">A tab is the header for a
tabpanel.</dc:description>
<role:scope rdf:resource="tabpanel"/>
<role:supportedState rdf:resource="&states;selected"/>
</owl:Class>
<owl:Class rdf:ID="tabpanel">
<rdfs:subClassOf rdf:resource="#group"/>
<dc:description xml:lang="en">A visual presentation of a section.
Tabpanels are commonly used in applications that have a large number of options
that can be categorized in logical groups. The Tabpanels serve three functional
components, including a menu bar of groupings, a selected grouping and set of
resources associated with that group. Each tab in a tablist serves as both a menu
item and as a title for the tab content associated with the tab. In graphical
renderings the selected Tab and TabContent usually share the same background
color and the non-selected tabs have a different background color to make the
selected Tab and TabContent stand out visually and provide a visual association
with the Tab and TabContent. Only one tabpanel's contents is visible at a time.
</dc:description>
</owl:Class>
<owl:Class rdf:ID="tabcontent">
<rdfs:subClassOf rdf:resource="#region"/>
<dc:description xml:lang="en">tabcontent is a container for the resources
associated with a tab. </dc:description>
</owl:Class>
<owl:Class rdf:ID="table">
<rdfs:subClassOf rdf:resource="#group"/>
<role:relatedConcept
rdf:resource="http://www.w3.org/TR/html4/struct/tables.html#edef-TABLE"/>
<dc:description xml:lang="en">A table is avisual presentation of a group
of data. A table contains cells of tabular data arranged in rows and
columns.</dc:description>
</owl:Class>
<owl:Class rdf:ID="td">
<rdfs:subClassOf rdf:resource="#section"/>
<role:relatedConcept
rdf:resource="http://www.w3.org/TR/html4/struct/tables.html#edef-TD"/>
<dc:description xml:lang="en">A td is a table cell containing data and is
a small section a table.</dc:description>
<role:scope rdf:resource="#table"/>
</owl:Class>
<owl:Class rdf:ID="th">
<rdfs:subClassOf rdf:resource="#td"/>
<rdfs:subClassOf rdf:resource="#sectionheader"/>
<role:relatedConcept
rdf:resource="http://www.w3.org/TR/html4/struct/tables.html#edef-TH"/>
<dc:description xml:lang="en">A th is a table cell containing data that
acts as a heading for a group of table cells.</dc:description>
<role:scope rdf:resource="#table"/>
</owl:Class>
<owl:Class rdf:ID="columnheader">
<rdfs:subClassOf rdf:resource="#th"/>
<role:relatedConcept
rdf:resource="http://www.w3.org/TR/html4/struct/tables.html#edef-COL"/>
<dc:description xml:lang="en">A table cell containing header information
for a column. </dc:description>
</owl:Class>
<owl:Class rdf:ID="rowheader">
<rdfs:subClassOf rdf:resource="#th"/>
<role:relatedConcept
rdf:resource="http://www.w3.org/TR/html4/struct/tables.html#edef-COL"/>
<dc:description xml:lang="en">A table cell containing header information
for a row. </dc:description>
</owl:Class>
<owl:Class rdf:ID="menu">
<rdfs:subClassOf rdf:resource="#widget"/>
<rdfs:subClassOf rdf:resource="#list"/>
<dc:description xml:lang="en">A menu is a block of
links.</dc:description>
<role:relatedConcept>See navigation in XHTML roles,
See://www.w3.org/TR/2005/WD-xhtml2-20050527/mod-role.html#col_Role</role:relatedConcept>
<role:relatedConcept
rdf:resource="http://www.loc.gov/nls/z3986/v100/dtbook110doc.htm#sidebar"/>
<rdfs:mustcontain rdf:resource="#menuitems"/>
</owl:Class>
<owl:Class rdf:ID="menuitem">
<rdfs:subClassOf rdf:resource="#listitem"/>
<role:scope rdf:resource="#menu"/>
<dc:description xml:lang="en">A menu item is an item or link inside a
menu.</dc:description>
<role:supportedState rdf:resource="&states;haspopup"/>
</owl:Class>
<owl:Class rdf:ID="toolbar">
<rdfs:subClassOf rdf:resource="#menu"/>
<dc:description xml:lang="en">A toolbar is a collection of commonly used
functions represented in compact visual form.The toolbar is a subset
of functions found in a menubar designed minimize real estate and conserve user
device interaction.</dc:description>
</owl:Class>
<owl:Class rdf:ID="menubar">
<rdfs:subClassOf rdf:resource="#menu"/>
<dc:description xml:lang="en">A container that contains menu items. Each
menu item may activate a menu. Navigation behavior should be similar to a GUI
menu bar
It is used to create a menubar similar to those found in Windows, the
Mac, and Gnome desktops. A menubar is used to create a consistent climate of
frequently used commands</dc:description>
</owl:Class>
<owl:Class rdf:ID="breadcrumbs">
<rdfs:subClassOf rdf:resource="#menu"/>
<dc:description xml:lang="en">Bread crumb navigation list.
Each element in the list is a representation of hiearchary represented linearly.
The logical order of the text begins with the root
element.</dc:description>
</owl:Class>
<owl:Class rdf:ID="sectionheader">
<dc:description xml:lang="en">A heading without
level</dc:description>
<role:relatedConcept>See HTML Headings -
://www.w3.org/TR/html4/struct/global.html#edef-H1</role:relatedConcept>
<role:relatedConcept
rdf:resource="http://www.loc.gov/nls/z3986/v100/dtbook110doc.htm#levelhd"/>
<role:supportedState rdf:resource="&states;hasparent"/>
<role:supportedState rdf:resource="&states;haschild"/>
</owl:Class>
</rdf:RDF>
The following roles were removed until structural roles are fully considered
Widget Role | Description | Inherited Concepts | Base and Related Concepts | New supported states(beyond inherited states) | ||
---|---|---|---|---|---|---|
buttonsubmit | This form control initiates submission of all or part of the instance data to which it is bound | Button | HTML input (type :submit) |
Disable, zoom
pressed |
Child conteny title
|
|
buttoncancel | This button initiates closing a window or leaving a form (e.g. To another page) without submission | Button |
Disable, zoom
pressed |
Child content title |
||
buttonundo | This control brings a form to the initial state (e.g. returns all default values to all inputs) | Button | HTML input (type : reset) | Disable, zoom pressed | Child content title |
|
buttonback | Brings user-agent to the previous page or state | Button | HTML Link | Disable, zoom pressed | Child content title |
|
hidden |
A form control that is never displayed to the user, but is always submitted
to the server with the form. NOTE: In XForms, unless bound to form controls, instance data nodes are
not presented to the user; consequently, there is no need for a form
control corresponding to [HTML] |
Input | [HTML] input (type : hidden) | Disable, zoom | Title |
|
spreadsheet | Interactive table where the user can enter the values | Widget Table |
Multiselectable | Disable, zoom | Title | |
col | Description of a table column. | Group | Name from title attribute | scope: TD | ||
row | Defines a table row. | Group | [HTML] tr | Name from title attribute | scope: TD | |
menubar | A Visual presentation of a menu | Menu | Name from title attribute | |||
mainmenu | A menu containing the most important links on this page/document | Menu | Name from title attribute | |||
submenu1 | Main submenu | Menu | Name from title attribute | |||
submenu2 | Secondary submenu | Menu | Name from title attribute | |||
submenutrivia | Unimportant submenu | Menu | Name from title attribute | |||
footer | Small text at the end of a page - typically contains copyright and similar information | [HTML] roles : contentinfo, copyright | Not mapped |
|||
footermenusite | A menu found at the bottom of a page containing important site links. Typically includes a link to a "contact us" page and other important site's pages. | Menu Footer |
Not mapped |
|||
heading1 | Level 1 heading | Sectionhead | [HTML]/[DTB]/NIMAS h1 | Name from child content or title attribute | ||
heading2 | Level 2 heading | Sectionhead | [HTML]/[DTB]/NIMAS h2 | Name from child content or title attribute | level=2 | |
heading3 | Level 3 heading | Sectionhead | [HTML]/[DTB]/NIMAS h3 | Name from child content or title attribute | level=3 | |
heading4 | Level 4 heading | Sectionhead | [HTML]/[DTB]/NIMAS h4 | Name from child content or title attribute | level=4 | |
heading5 | Level 5 heading | Sectionhead | [HTML]/[DTB]/NIMAS h5 | Name from child content or title attribute | level=5 | |
heading6 | Level 6 heading | Sectionhead | [HTML]/[DTB]/NIMAS h6 | Name from child content or title attribute | level=6 |