RE: Because a checkbox can be perceived as a toggle button

> 1. Can anybody explain why role="checkbox" is not suitable for <button>?
> 2. Is there any sort of overview for ARIA roles and suitable HTML elements they can be assigned to?

According to the latest ARIA in HTML working draft (https://www.w3.org/TR/html-aria/) role checkbox can be used on button.

Allowed Roles and attributes: checkbox, link, menuitem, menuitemcheckbox, menuitemradio, radio, switch - (new) or tab global aria-* attributes and any aria-* attributes applicable to the allowed roles

Best Regards,

Jonathan

Jonathan Avila
Chief Accessibility Officer
SSB BART Group 
jon.avila@ssbbartgroup.com
703.637.8957 (Office) 
Visit us online: Website | Twitter | Facebook | Linkedin | Blog
Join SSB at Accessing Higher Ground This Month!

The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.



-----Original Message-----
From: Jan Hellbusch [2bweb.de] [mailto:hellbusch@2bweb.de] 
Sent: Monday, November 21, 2016 3:46 AM
To: w3c-wai-ig@w3.org
Subject: Because a checkbox can be perceived as a toggle button

Hi,

recently I discussed the following code snippet:

<button role="checkbox" aria-checked="true|false|nixed"><img
src=one-of-three-checkbox-states.png" alt=""> Activate something </button>

Problem: Finding the right HTML element for role="checkbox". 

According to HTML spec
http://www.w3.org/TR/html51/semantics-embedded-content.html#the-img-element
the role attribute can be applied to <img>, but

* there are compatibility problems with IE/JAWS 17 (checkbox label will not always be read, instead the file name will be used as a fallback)
* focus still needs to be managed

The <button> seems to be an alternative to avoid focus management (assigning a name is also not a problem). <button role=checkbox"> wouldn't conform to
HTML:
http://www.w3.org/TR/html51/sec-forms.html#the-button-element

So,

1. Can anybody explain why role="checkbox" is not suitable for <button>?
2. Is there any sort of overview for ARIA roles and suitable HTML elements they can be assigned to?

Thanks,
Jan
--
Jan Hellbusch
Chemnitzer Str. 14, 44139 Dortmund
Tel.: +49 (231) 33005825 oder +49 (163) 3369925
--
Accessibility-Consulting seit 15 Jahren: http://2bweb.de
Blog: www.hellbusch.de
Bücher, Artikel: www.barrierefreies-webdesign.de

Received on Monday, 21 November 2016 13:40:38 UTC