{"id":1274,"date":"2024-07-15T16:50:37","date_gmt":"2024-07-15T16:50:37","guid":{"rendered":"https:\/\/html5accessibility.com\/stuff\/?p=1274"},"modified":"2024-12-23T12:33:11","modified_gmt":"2024-12-23T12:33:11","slug":"what-aria-still-does-not-do","status":"publish","type":"post","link":"https:\/\/html5accessibility.com\/stuff\/2024\/07\/15\/what-aria-still-does-not-do\/","title":{"rendered":"What ARIA still does not do"},"content":{"rendered":"<figure><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-734 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2022\/03\/generic1.jpg\" alt=\"A young Dr Swallow on the TV teaches Prince Andrew about the moral turpitude of HTML and ARIA semantics\" width=\"600\" height=\"361\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2022\/03\/generic1.jpg 600w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2022\/03\/generic1-300x181.jpg 300w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><figcaption>The good people of Dunnington gather around their communal tele-visual <em>apparatus<\/em> to learn of HTML usability blights from a young Dr Swallow.<\/figcaption><\/figure>\n<p>In 2014 I wrote an article <a href=\"https:\/\/www.tpgi.com\/what-aria-does-not-do\/\">What ARIA does not do<\/a><\/p>\n<p>It stated:<\/p>\n<blockquote><p><a href=\"https:\/\/www.w3.org\/TR\/wai-aria\/\">ARIA<\/a>\u00a0is a set of attributes that can be added to\u00a0<a href=\"https:\/\/html.spec.whatwg.org\/multipage\/#toc-semantics\">HTML elements<\/a>\u00a0(and other markup languages) to communicate accessibility role, state, name and properties which are exposed by browsers via platform\u00a0<a href=\"https:\/\/www.w3.org\/TR\/core-aam-1.2\/#intro_aapi\">accessibility APIs<\/a>. This provides a common, interoperable method of relaying the information to assistive technologies. That\u2019s it. It is the same method used by browsers to convey the inbuilt (or default) accessibility information of native HTML features. The difference being that authors can wire up this information for themselves in the DOM using ARIA, before they could not.<\/p><\/blockquote>\n<p>10 years later, the message is unchanged.<\/p>\n<h2>Clarity<\/h2>\n<p>Little has changed in relation to what effect the addition of ARIA attributes has to the display or behavior of elements,\u00a0 that have modified accessibility semantics, nothing has changed in regards to mainstream user agents (i.e. browsers). Little has changed as to how Screen readers screen readers support ARIA semantics, <strong>except that support for them has improved markedly.<\/strong><\/p>\n<p>Screen readers <strong>did and <em>still do<\/em><\/strong> treat the element as it&#8217;s represented in the Accessibility tree:<\/p>\n<p>Typical support patterns of HTML elements, with implicit or explicit roles, states and properties, by screen readers:<\/p>\n<ul>\n<li>Identification of an element by role as the user moves through the content.<\/li>\n<li>Announcement of the text content of an element.<\/li>\n<li>Announcement of the start and end of an element.<\/li>\n<li>Change in voice as the content of an element is announced.<\/li>\n<li>Announcement of an elements accessible name and\/or description<\/li>\n<li>Announcement of states and properties.<\/li>\n<li>Emission of a beep or other sound when an element with a particular state or property receives\u00a0<a href=\"http:\/\/juicystudio.com\/article\/making-ajax-work-with-screen-readers.php#jawsvirtual\">virtual focus<\/a>.<\/li>\n<li>Instructions on how to operate interactive elements such as form controls.<\/li>\n<li>Navigation of elements by keyboard and \u201cquick access\u201d lists of a particular elements.<\/li>\n<li>Change in how keystrokes are handled for interactive roles. Screen readers on Windows in particular, pass some keystrokes through to the browser to allow, for example the input of text into a text field. They also may change their <a href=\"https:\/\/tink.uk\/understanding-screen-reader-interaction-modes\/\">interaction mode<\/a> to support such interaction.<\/li>\n<\/ul>\n<h2>As it says in the Standard<\/h2>\n<blockquote><p><a href=\"https:\/\/www.w3.org\/TR\/wai-aria\/#ua-support\">1.3 User Agent Support<\/a><\/p>\n<p>Aside from using\u00a0<abbr title=\"Accessible Rich Internet Applications\">WAI-ARIA<\/abbr>\u00a0markup to improve what is exposed to accessibility\u00a0<abbr title=\"Application Programing Interfaces\">APIs<\/abbr>, user agents behave as they would natively. Assistive technologies react to the extra information in the accessibility\u00a0<abbr title=\"application programming interface\">API<\/abbr>\u00a0as they already do for the same information on non-web content. <strong>User agents that are not assistive technologies, however, need do nothing beyond providing appropriate updates to the accessibility\u00a0<abbr title=\"application programming interface\">API<\/abbr>.<\/strong><\/p><\/blockquote>\n<p>For example: take the following HTML<\/p>\n<pre>Explicit role\r\n&lt;div role=\"main\"&gt;main content&lt;\/div&gt;\r\n\r\nvs\r\n\r\nImplicit role\r\n&lt;main&gt;main content&lt;\/main&gt;<\/pre>\n<p>Mainstream Browsers do not imbue <code>&lt;main&gt;<\/code> with any behaviour&#8217;s, while Screen readers such as JAWS provide the following interaction key strokes:<\/p>\n<ul>\n<li>Move to Main Region\u00a0<kbd>Q<\/kbd><\/li>\n<li>Move to Next Region\u00a0\u00a0<kbd>R<\/kbd><\/li>\n<li>Move to Previous Region <kbd>SHIFT+R<\/kbd><\/li>\n<li>Select a Region\u00a0<kbd>INSERT+CTRL+R<\/kbd><\/li>\n<\/ul>\n<p class=\"note\">See <a href=\"https:\/\/stevefaulkner.github.io\/screen-reader-HTML-support\/JAWS.html\">Jaws HTML Support<\/a> for information about how <code>HTML<\/code> element semantics are supported.<\/p>\n<h2>All is fine and dandy as long as you keep your promises<\/h2>\n<p class=\"note\">Use of <a href=\"https:\/\/w3c.github.io\/aria\/\">ARIA<\/a> is a promise you as a developer make to screen reader users.<\/p>\n<p>As long as developers implement ARIA according to its <a href=\"https:\/\/w3c.github.io\/html-aria\/\">rules of use<\/a> in HTML and implement interaction patterns (usually via JavaScript) that agree with the <a href=\"https:\/\/www.w3.org\/WAI\/ARIA\/apg\/\">standard pattern<\/a> for a particular role, all is well. When they <strong>do not<\/strong> there is grief.<\/p>\n<p>For example if a <code>menu<\/code> role is used, there is an expectation that using the <a href=\"https:\/\/www.w3.org\/WAI\/ARIA\/apg\/patterns\/menubar\/#keyboardinteraction\">arrow keys will navigate the menu items<\/a>, also the expectation is that their will be child elements with <code>role=menuitem or menuitemcheckbox or menuitemradio<\/code> to navigate. If either is not the case then the user experience will be degraded, sometimes to the point where it is unusable.<\/p>\n<h2>Further Reading:<\/h2>\n<ul>\n<li><a href=\"https:\/\/w3c.github.io\/aria\/\">Accessible Rich Internet Applications (WAI-ARIA) 1.3<\/a><\/li>\n<li><a href=\"https:\/\/www.w3.org\/WAI\/ARIA\/apg\/\">ARIA Authoring Practices Guide (APG)<\/a><\/li>\n<li><a href=\"https:\/\/w3c.github.io\/html-aria\/\">ARIA in HTML<\/a><\/li>\n<li><a href=\"https:\/\/tink.uk\/understanding-screen-reader-interaction-modes\/\">Understanding screen reader interaction modes<\/a><\/li>\n<\/ul>\n<p><iframe loading=\"lazy\" title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/yl6rghNEd-A?si=mw8A_l4dxHV4PwsJ\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>The good people of Dunnington gather around their communal tele-visual apparatus to learn of HTML usability blights from a young Dr Swallow. In 2014 I wrote an article What ARIA does not do It stated: ARIA\u00a0is a set of attributes that can be added to\u00a0HTML elements\u00a0(and other markup languages) to communicate accessibility role, state, name [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1274","post","type-post","status-publish","format-standard","hentry","category-htmlaccessibility"],"_links":{"self":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1274","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/comments?post=1274"}],"version-history":[{"count":19,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1274\/revisions"}],"predecessor-version":[{"id":1475,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1274\/revisions\/1475"}],"wp:attachment":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/media?parent=1274"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/categories?post=1274"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/tags?post=1274"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}