Problem/Motivation

Dragon Naturally Speaking does not recognize elements in the Drupal UI. This might be caused by the visually-hidden class. If the text isn't visible, maybe it also isn't available to voice control.

Screenshot of the HTML of the Overlay close button

<a id="overlay-close" href="#" class="overlay-close" role="button" aria-controls="overlay-content"><span class="visually-hidden">Close overlay</span></a>

Proposed resolution

Someone with Dragon needs to troubleshoot these issue reported in Minnesota Accessibility studies.

Remaining tasks

We need to better understand how Dragon is interpreting the HTML and CSS in our code.

User interface changes

Unknown right now.

API changes

None.

#1964880: Convert the Overlay close button from an anchor element to a button element.

CommentFileSizeAuthor
Structure___Drupal_D8_Dev.png20.85 KBjessebeach
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Issue tags: +Accessibility, +Dragon Naturally Speaking

tagging

jessebeach’s picture

jessebeach CreditAttribution: jessebeach commented

@fredck @j.swiderski (@fredck pointed out to me in CKEditor issue that @j.swiderski did the research. @fredck reviewed the approach.) on the CKEditor team did some research into aria-hidden and discovered that setting aria-hidden="false", on a display:none will prevent the element from being excluded from the accessibility tree. End result: screen readers will announce the element rather than skipping over it.

I have tried it in ChromeVox, Jaws and VoiceOver. This solution has fixed problem in chromeVox and didn't break JAWS or VoiceOver.

It seems that aria-hidden="false" prevents element being removed from accessibility tree and docs seem to confirm it (contrary to blog-post). This is the link I was talking about ​http://www.w3.org/WAI/PF/aria/states_and_properties#aria-hidden. I should have looked at it in the first place.
Please have a look at first sentence.

Indicates that the element and all of its descendants are not visible or perceivable to any user as implemented by the author ...

Please also have a look at ​http://www.w3.org/WAI/PF/aria/terms#def_perceivable. Perceivable means discoverable.

It looks like Chrome Vox understands it the same way. IMHO such solution is better and much simpler.https://dev.ckeditor.com/ticket/10004

jessebeach’s picture

jessebeach CreditAttribution: jessebeach commented
Issue summary: View changes

updated

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented

@SteveBuell said - "When your widget dialog has "Close" as a label, Dragon users may wind up closing the browser rather than the dialog box. #a11y"

So it could say something like, "Close dialog", "Close popup" or "Hide", but right now it says "Close overlay" which should be fine:

<span class="visually-hidden">Close overlay</span>

However, not sure how someone using Dragon would know to say that.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented

I haven't asked this question yet, but this looks like a great place to ask the question. http://www.knowbrainer.com/forums/forum/categories.cfm?catid=4

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented

Ok, I asked the question http://www.knowbrainer.com/forums/forum/messageview.cfm?catid=4&threadid...

jessebeach’s picture

jessebeach CreditAttribution: jessebeach commented
Component: toolbar.module » user interface text
Issue summary: View changes

The component should really be "User interface" but we don't have a better one than "user interface text".

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Title: Investigate how Dragon Naturally Speaking recognizes UI elements; test with the Overlay close button » Investigate how Dragon Naturally Speaking recognizes UI elements; test with a modal close button

changing title as it is still relevant to test, but Overlay's not part of this.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford at OpenConcept Consulting Inc. commented
Version: 8.0.x-dev » 8.1.x-dev
Status: Active » Postponed
mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford at OpenConcept Consulting Inc. commented
Status: Postponed » Active

Version: 8.1.x-dev » 8.2.x-dev

Drupal 8.1.0-beta1 was released on March 2, 2016, which means new developments and disruptive changes should now be targeted against the 8.2.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

andrewmacpherson’s picture

andrewmacpherson CreditAttribution: andrewmacpherson as a volunteer commented

A relevant post about how WordPress are approaching Dragon etc, including responses form users testing it.

https://make.wordpress.org/accessibility/2016/05/13/20th-wordpress-acces...

Version: 8.2.x-dev » 8.3.x-dev

Drupal 8.2.0-beta1 was released on August 3, 2016, which means new developments and disruptive changes should now be targeted against the 8.3.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.3.x-dev » 8.4.x-dev

Drupal 8.3.0-alpha1 will be released the week of January 30, 2017, which means new developments and disruptive changes should now be targeted against the 8.4.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.4.x-dev » 8.5.x-dev

Drupal 8.4.0-alpha1 will be released the week of July 31, 2017, which means new developments and disruptive changes should now be targeted against the 8.5.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.5.x-dev » 8.6.x-dev

Drupal 8.5.0-alpha1 will be released the week of January 17, 2018, which means new developments and disruptive changes should now be targeted against the 8.6.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.6.x-dev » 8.7.x-dev

Drupal 8.6.0-alpha1 will be released the week of July 16, 2018, which means new developments and disruptive changes should now be targeted against the 8.7.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.7.x-dev » 8.8.x-dev

Drupal 8.7.0-alpha1 will be released the week of March 11, 2019, which means new developments and disruptive changes should now be targeted against the 8.8.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.8.x-dev » 8.9.x-dev

Drupal 8.8.0-alpha1 will be released the week of October 14th, 2019, which means new developments and disruptive changes should now be targeted against the 8.9.x-dev branch. (Any changes to 8.9.x will also be committed to 9.0.x in preparation for Drupal 9’s release, but some changes like significant feature additions will be deferred to 9.1.x.). For more information see the Drupal 8 and 9 minor version schedule and the Allowed changes during the Drupal 8 and 9 release cycles.

Version: 8.9.x-dev » 9.1.x-dev

Drupal 8.9.0-beta1 was released on March 20, 2020. 8.9.x is the final, long-term support (LTS) minor release of Drupal 8, which means new developments and disruptive changes should now be targeted against the 9.1.x-dev branch. For more information see the Drupal 8 and 9 minor version schedule and the Allowed changes during the Drupal 8 and 9 release cycles.

Version: 9.1.x-dev » 9.2.x-dev

Drupal 9.1.0-alpha1 will be released the week of October 19, 2020, which means new developments and disruptive changes should now be targeted for the 9.2.x-dev branch. For more information see the Drupal 9 minor version schedule and the Allowed changes during the Drupal 9 release cycle.

Version: 9.2.x-dev » 9.3.x-dev

Drupal 9.2.0-alpha1 will be released the week of May 3, 2021, which means new developments and disruptive changes should now be targeted for the 9.3.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.3.x-dev » 9.4.x-dev

Drupal 9.3.0-rc1 was released on November 26, 2021, which means new developments and disruptive changes should now be targeted for the 9.4.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.4.x-dev » 9.5.x-dev

Drupal 9.4.0-alpha1 was released on May 6, 2022, which means new developments and disruptive changes should now be targeted for the 9.5.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.5.x-dev » 10.1.x-dev

Drupal 9.5.0-beta2 and Drupal 10.0.0-beta2 were released on September 29, 2022, which means new developments and disruptive changes should now be targeted for the 10.1.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 10.1.x-dev » 11.x-dev

Drupal core is moving towards using a “main” branch. As an interim step, a new 11.x branch has been opened, as Drupal.org infrastructure cannot currently fully support a branch named main. New developments and disruptive changes should now be targeted for the 11.x branch, which currently accepts only minor-version allowed changes. For more information, see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford at CivicActions commented
Issue tags: +Voice Control, +wcag412

Adding for Apple's Voice Control.

Also for https://www.w3.org/WAI/WCAG21/Understanding/name-role-value.html