2

I have added skip to main content links on header in my web app. It works as expected in Windows and MacOS. It even works as expected in IPhone. But the same is not working in Android chrome/talk back.

when I check further, This skip nav links are not working even in webaim.org . The code I refer https://www.bignerdranch.com/blog/web-accessibility-skip-navigation-links/

Could someone please help why android chrome is having this issue? Is it a browser behavior? Please help.

1 Answer 1

4

Let's analyze what is happening in this scenario.

1) TalkBack sets ACCESSIBILITY_FOCUS to the element

This is very important, notice that this says ACCESSIBILITY_FOCUSnot FOCUS. For a hidden skipnav link to become visible it needs to get FOCUS as marking the element as visible (or perhaps shifting it on screen) with the :focus pseudo selector is a very common implementation of this. It's very important that such a control receives FOCUS, which it never does with TalkBack.

2) The user double taps to click the element they just heard get focus.

When the user activates the control a physical click event is set to the middle of the onscreen focus rectangle for the control. Similar to actually touching the screen.

3) The browser sees a physical click event occur on the page.

TalkBack essentially has blindly sent a mouse down event to an area of the page that has nothing or perhaps another control overlayed with this invisible element. Either way, the thing that the browser wanted to click was never "visible" because it never properly obtained FOCUS only ACCESSIBILITY_FOCUS and so the control is not there to be clicked.

4
  • Thanks Chris for the detailed response.
    – Dhana
    Sep 18, 2017 at 13:43
  • Was there an aspect of this that didn't get addressed? If not you should upvote and accept the answer. If there is, clarify your question! :)
    – MobA11y
    Sep 18, 2017 at 14:56
  • Sorry. I am not able to mark this as answer :( I guess I need more reputations to do so.
    – Dhana
    Sep 19, 2017 at 16:01
  • @ChrisCM Is there any workaround for the skip nav links on Android Talkback? I understand that the current implementation is to respond to web's FOCUS event and there's no way to respond to ACCESSIBILITY_FOCUS at the moment but is there any workaround that you or your colleagues are implementing for Android Talkback? I'm currently having trouble with implementing a solution, similar to the question I had with Android Talkback not responding to onFocus
    – kdizzle
    Jan 16, 2018 at 23:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.