WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Unexpected Voiceover Tab Order and Focussing on Hybrid App

for

Number of posts in this thread: 5 (In chronological order)

From: Graham Armfield
Date: Thu, Mar 12 2015 4:59AM
Subject: Unexpected Voiceover Tab Order and Focussing on Hybrid App
No previous message | Next message →

Hi Everyone,

I'm working with a team of developers who have created an iOS hybrid app.
They want to get accessibility right, but are finding it difficult to
control the tab order when Voiceover is used. It doesn't seem to follow the
pattern expected.

I know that Voiceover can sometimes work from the top of the screen down
when determining tab order, but there must be a reliable way of influencing
that so that the tab order makes sense to Voiceover users.

Also, at times, there is a requirement to move focus into an overlay panel,
and then back to the original focus location when the panel closes. Getting
that to work as expected is proving a challenge too.

If anyone has any suggestions or know of any useful resources on this I'd
be very grateful.

Thanks in advance

Graham Armfield



coolfields.co.uk <http://www.coolfields.co.uk/>;
M:07905 590026
T: 01483 856613
@coolfields <https://twitter.com/coolfields>

From: Jonathan Avila
Date: Thu, Mar 12 2015 6:27AM
Subject: Re: Unexpected Voiceover Tab Order and Focussing on Hybrid App
← Previous message | Next message →

> I know that Voiceover can sometimes work from the top of the screen down when determining tab order, but there must be a reliable way of influencing that so that the tab order makes sense to Voiceover users.

The only option you have other than layout to control reading order is shouldGroupAccessibilityChildren. This property will cause VoiceOver to respect the view's grouping of child elements as a whole rather than intermixing them in the reading order with other views children.

> Also, at times, there is a requirement to move focus into an overlay panel, and then back to the original focus location when the panel closes. Getting that to work as expected is proving a challenge too.

To set focus call UIAccessibilityPostNotification with UIAccessibilityLayoutChangedNotification as the first parameter and the second with the object to set focus to.

Jonathan

-- 
Jonathan Avila 
Chief Accessibility Officer
SSB BART Group 
= EMAIL ADDRESS REMOVED =
Phone 703.637.8957  
Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter

From: Patrick H. Lauke
Date: Thu, Mar 12 2015 6:55AM
Subject: Re: Unexpected Voiceover Tab Order and Focussing on Hybrid App
← Previous message | Next message →

On 12/03/2015 12:27, Jonathan Avila wrote:
>> I know that Voiceover can sometimes work from the top of the screen down when determining tab order, but there must be a reliable way of influencing that so that the tab order makes sense to Voiceover users.
>
> The only option you have other than layout to control reading order is shouldGroupAccessibilityChildren. This property will cause VoiceOver to respect the view's grouping of child elements as a whole rather than intermixing them in the reading order with other views children.
>
>> Also, at times, there is a requirement to move focus into an overlay panel, and then back to the original focus location when the panel closes. Getting that to work as expected is proving a challenge too.
>
> To set focus call UIAccessibilityPostNotification with UIAccessibilityLayoutChangedNotification as the first parameter and the second with the object to set focus to.

If it's a hybrid app, wouldn't this need use JavaScript's focus()
method? (serious question, as I've not played with building hybrid apps
myself).

P
--
Patrick H. Lauke

www.splintered.co.uk | https://github.com/patrickhlauke
http://flickr.com/photos/redux/ | http://redux.deviantart.com
twitter: @patrick_h_lauke | skype: patrick_h_lauke

From: Jonathan Avila
Date: Thu, Mar 12 2015 7:25AM
Subject: Re: Unexpected Voiceover Tab Order and Focusing on Hybrid App
← Previous message | Next message →

> If it's a hybrid app, wouldn't this need use JavaScript's focus() method? (serious question, as I've not played with building hybrid apps myself).

Yes, if the issues are in the webview portion of the app then all standard HTML reading order and focus control mechanisms would apply. That is, reading order would be controlled by the order of the document object model and focus could be set with .focus() etc. With hybrid apps it's not always clear what content is native or web. One trick I use is to turn the rotor -- if I see web options in the rotor I know I'm in a web view -- otherwise I am in a native portion of the app. Both would contain heading rotor options if that is in your rotor -- so you can't rely on the headings option to make this determination.

Jonathan

-- 
Jonathan Avila 
Chief Accessibility Officer
SSB BART Group 
= EMAIL ADDRESS REMOVED =
Phone 703.637.8957  
Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter


From: Graham Armfield
Date: Fri, Mar 13 2015 6:11AM
Subject: Re: Unexpected Voiceover Tab Order and Focusing on Hybrid App
← Previous message | No next message

>
> If it's a hybrid app, wouldn't this need use JavaScript's focus() method?
(serious question, as I've not played with building hybrid apps myself).

>Yes, if the issues are in the webview portion of the app then all standard
HTML reading order and focus control mechanisms
>would apply. That is, reading order would be controlled by the order of
the document object model and focus could be set
>with .focus() etc. With hybrid apps it's not always clear what content is
native or web. One trick I use is to turn the rotor -- if I
>see web options in the rotor I know I'm in a web view -- otherwise I am in
a native portion of the app. Both would contain
>heading rotor options if that is in your rotor -- so you can't rely on the
headings option to make this determination.

>Jonathan

Thanks for your comments. The app is indeed hybrid and all the content is
in the right order, and focus() is used to try to set focus. It just seems
as if all that gets 'lost in translation' when the app gets produced from
the original HTML and javascript.


Regards
Graham Armfield



coolfields.co.uk <http://www.coolfields.co.uk/>;
M:07905 590026
T: 01483 856613
@coolfields <https://twitter.com/coolfields>

On Thu, Mar 12, 2015 at 1:25 PM, Jonathan Avila < = EMAIL ADDRESS REMOVED = >
wrote:

> > If it's a hybrid app, wouldn't this need use JavaScript's focus()
> method? (serious question, as I've not played with building hybrid apps
> myself).
>
> Yes, if the issues are in the webview portion of the app then all standard
> HTML reading order and focus control mechanisms would apply. That is,
> reading order would be controlled by the order of the document object model
> and focus could be set with .focus() etc. With hybrid apps it's not always
> clear what content is native or web. One trick I use is to turn the rotor
> -- if I see web options in the rotor I know I'm in a web view -- otherwise
> I am in a native portion of the app. Both would contain heading rotor
> options if that is in your rotor -- so you can't rely on the headings
> option to make this determination.
>
> Jonathan
>
> --
> Jonathan Avila
> Chief Accessibility Officer
> SSB BART Group
> = EMAIL ADDRESS REMOVED =
> Phone 703.637.8957
> Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter
>
>
>