WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: HTML5 and iOS VoiceOver

for

From: Jesse Hausler
Date: Nov 29, 2012 1:15PM

Hi Jim,

My goal is always to not code specifically for any device or AT. We are developing new touch friendly products that are likely to be widely used on iPad and iPhone, so VoiceOver is an important factor.

Typically, I preach that developers should code using proper semantics, following HTML and WCAG specs, and *most* accessibility needs will fall into place. This does not happen to be the case with VoiceOver which has lead our discussion to VO detection, etc.

Bryan, I'll get a colleague to put together a scrollable div using the attributes you mentioned below and will let you know how it goes.

Jesse


On 11/29/12 12:05 PM, "Corbett, James" < <EMAIL REMOVED> > wrote:

Hi:

If I may, are you coding specifically for a device or AT in general?

Jim

-----Original Message-----
From: <EMAIL REMOVED> [mailto: <EMAIL REMOVED> ] On Behalf Of Bryan Garaventa
Sent: November 29, 2012 3:02 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] HTML5 and iOS VoiceOver

I agree, this may be possible using role=list, role=listitem, aria-setsize,
and aria-posinset.

It would need to be tested in iOS to see if this works though.

----- Original Message -----
From: "Jesse Hausler" < <EMAIL REMOVED> >
To: "WebAIM Discussion List" < <EMAIL REMOVED> >
Sent: Thursday, November 29, 2012 11:45 AM
Subject: Re: [WebAIM] HTML5 and iOS VoiceOver


> That makes sense. Thanks for the clarification.
>
> Ideally, I'd love to see something in html5 apps similar to how Android
> does native scrolling regions.
> There if you have 30 items in a master list and only 5 on stage, Talkback
> will say "Showing items 5 through 10 of 30".
>
> It would be great if there were ARIA attributes we could add to a list
> element in a scrollable div to get this effect.
>
>
> On 11/29/12 10:30 AM, "Bryan Garaventa" < <EMAIL REMOVED> >
> wrote:
>
> No problem. One way this can be helpful is like so.
>
> <div class="hidden">
> <button>Scroll Up</button>
> <button>Scroll Down</button>
> </div>
> <div class="scrollable">
> Content...
> </div>
>
> Then, when Voiceover is enabled, you can remove the class of 'hidden' to
> display the scroll buttons at the top of the scrollable div, and when
> Voiceover is disabled, the class of 'hidden' can be readded to continue
> with
> the original layout.
>
> ----- Original Message -----
> From: "Jesse Hausler" < <EMAIL REMOVED> >
> To: "WebAIM Discussion List" < <EMAIL REMOVED> >
> Sent: Thursday, November 29, 2012 9:38 AM
> Subject: Re: [WebAIM] HTML5 and iOS VoiceOver
>
>
>> Bryan, Can you expand on this point?
>>
>> "The detection mechanism though, can be used to add buttons or
>> controlling
>> elements for accomplishing the same tasks accessibly in a dynamic
>> manner."
>>
>> I'm curious to learn more about how to address scrollable divs.
>>
>> Thanks again,
>> Jesse
>> >> >> >
> > > >
> > >