katekalcevich / test-aria Goto Github PK

as you reference my 2014 article on dialogs, might also be worth referring to more recent articles on the subject: https://developer.paciellogroup.com/blog/2018/06/the-current-state-of-modal-dialog-accessibility/

thanks

In the readme there's a small spelling mistake "keybard "

File: /aria-landmark-roles.html

Should ARIA roles be used here when HTML5 elements are used?

<header role="banner">
    ...
</header>

<footer role="contentinfo">
     ...
</footer>

In regards to the README advice:

No need to double up HTML and ARIA (for example,

unless you are supporting a specific browser and screen reader combination that doesn't support the landmarks you are using

A few things about the landmarks content:

• role=application is not a landmark.
• "don't nest" is unclear in your rules, especially when also indicating only one can be used per page. So what are you saying don't nest within?
• typically there should be only a single banner/contentinfo on a page, but there may be multiple header/footer elements. The rules do not distinguish between these allowances. It would be helpful to note that using multiple header/footer elements can result in bugs were multiple banner/contentinfo landmarks are exposed incorrectly.
• rule for role=search reads oddly "Don't use on a element - put it on a parent div" is it missing a word? Per #4, it could well (and should) be used on a <form>.
• role=region/section rule should state "requires a label to be exposed as a landmark" However, use of generic region landmarks should be cautioned against unless absolutely necessary.
• rule for role=form is unnecessary.

In the README the following section is in the Tabs advice:

What I've done instead for keybard interaction is:
you can tab through all accordions and see which accordion has the focus (Focus outlines are provided for buttons by browsers, as long as you haven't removed them using CSS. If you removed the outline, put it back.)
you can open a tab using the the enter key or spacebar

Is that intentional?

File: /aria-landmark-roles.html

Would there be wider support using role="search" on the <form> element instead of <div>?

Current code:

<div role="search">
        <form>Search goes here</form>
</div>

That's part of Mozilla's prefered method (under best practices): https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Search_role