I am helping an app developer to make the mobile page of his application accessible.
One issue we have found is that whenever we have an invisible control (visually), but reachable (with a screen reader), voiceover can't click on the element when the user performs a double tap.
This happens with text fields, buttons or links.
Has anyone ever encountered this issue and if there is a workaround?
Is there any recommended practices for implementing hidden controls that are clickable by voiceover?
Comments
Focus the element
Did you make sure the visually hidden element is actually focusable? Either give it a tabindex of 0 (adds it to the natural tab order flow) or greater than 0 (when swiping or moving through the DOM, gives it a higher priority than any others), but that would also make the element accessible through the tab key on a keyboard or through swiping with VO, or use the JavaScript focus method on it programmatically whenever it's needed. That should do the trick. Or are you already doing either of these and it still doesn't work?
Lukas