WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Role of Filters for Ordered List

for

From: Jim Allan
Date: Jun 15, 2015 2:42PM

what ever is spoken by the screen reader will be displayed by the braille
display.

On Mon, Jun 15, 2015 at 3:25 PM, Paul J. Adam < <EMAIL REMOVED> > wrote:

> WAI-ARIA Support Matrix
> http://pauljadam.com/demos/ariasupport.html <
> http://pauljadam.com/demos/ariasupport.html>;
>
> Aria-label works with all screen readers that I'm aware of. Has been that
> way for a while.
>
> Paul J. Adam
> Accessibility Evangelist
> www.deque.com
>
> Join us at our Mobile Accessibility "Bootcamp!"
> August 6-7 in Austin Texas
> https://dequeuniversity.com/events/2015/mobile
> Topics include responsive web design, native apps, & more
>
> > On Jun 15, 2015, at 1:29 PM, Lynn Holdsworth < <EMAIL REMOVED> >
> wrote:
> >
> > How well do the various screenreaders deliver custom ARIA labels like
> > this to Braille displays these days?
> >
> > On 15/06/2015, Paul J. Adam < <EMAIL REMOVED> > wrote:
> >> Don't use role=application unless you plan to take over keyboard
> shortcut
> >> keys for ever single action on your custom web application. It disables
> the
> >> screen reader's default quick navigation commands like H for heading B
> for
> >> button, data table navigation is disabled. This affects NVDA/JAWS not
> >> VoiceOver.
> >>
> >> There's no reason to use role=application unless you really are
> building a
> >> google docs or yahoo mail type web app. So basically, be careful with
> >> role=application most people say avoid it.
> >>
> >> Use aria-labelledby or aria-label to modify the accessible names of all
> your
> >> controls so they sound good to the screen reader user.
> >>
> >> Paul J. Adam
> >> Accessibility Evangelist
> >> www.deque.com
> >>
> >> Join us at our Mobile Accessibility "Bootcamp!"
> >> August 6-7 in Austin Texas
> >> https://dequeuniversity.com/events/2015/mobile
> >> Topics include responsive web design, native apps, & more
> >>
> >>> On Jun 15, 2015, at 12:23 PM, Brian Lovely < <EMAIL REMOVED> > wrote:
> >>>
> >>> I have to admit I should have said sortable instead of ordered, if that
> >>> makes any difference. Right now there is a calendar widget for date, a
> low
> >>> text input and a high text input for dollar amount range, and a set of
> >>> checkboxes, one for each kind of transaction,
> >>>
> >>> I was thinking the whole thing, filters and list, as a
> role=application,
> >>> but I find it difficult to decide how best to deal with the filters
> >>>
> >>> Brian Lovely
> >>> <EMAIL REMOVED>
> >>>
> >>>> On Jun 15, 2015, at 12:45 PM, Paul J. Adam < <EMAIL REMOVED> >
> wrote:
> >>>>
> >>>> You could give the filtering panel a navigation role with an
> aria-label
> >>>> to make the container unique. To give the filtering buttons unique
> "link
> >>>> purpose" text you could use aria-labelledby pointing to the id values
> of
> >>>> multiple strings ordered in how you'd want the SR to speak them. Or
> you
> >>>> can just use an aria-label to make the accessible name unique and
> >>>> purposeful.
> >>>>
> >>>> <nav aria-label="Transaction Filters">
> >>>> <button aria-label="Filter by dollar amount range">Amount
> Range</button>
> >>>> </nav>
> >>>>
> >>>> Something along those lines with the basic idea of giving each element
> >>>> and navigation container a unique and helpful accessible name.
> >>>>
> >>>> Hope that helps!
> >>>>
> >>>> Paul J. Adam
> >>>> Accessibility Evangelist
> >>>> www.deque.com
> >>>>
> >>>> Join us at our Mobile Accessibility "Bootcamp!"
> >>>> August 6-7 in Austin Texas
> >>>> https://dequeuniversity.com/events/2015/mobile
> >>>> Topics include responsive web design, native apps, & more
> >>>>
> >>>>> On Jun 15, 2015, at 10:30 AM, Brian Lovely < <EMAIL REMOVED> >
> wrote:
> >>>>>
> >>>>>
> >>>>> Assuming a list of transactions that can be ordered by column header:
> >>>>> date, id, type, dollar amount, etc. if there is also a panel of
> filters
> >>>>> that can constrain the transactions that can appear in the list:
> dollar
> >>>>> amount range, specific type, etc. What is the role of this filtering
> >>>>> panel and what ARIA properties should be used to communicate the
> >>>>> relationship between the list and the filters
> >>>>>
> >>>>>
> >>>>> Brian Lovely
> >>>>> <EMAIL REMOVED>
> >>>>> > >>>>> > >>>>> > >>>>> > >>>>
> >>>> > >>>> > >>>> > >>>> > >>> > >>> > >>> > >>> > >>
> >> > >> > >> > >> > >>
> > > > > > > > >
> > > > >



--
[image: http://www.tsbvi.edu] <http://www.tsbvi.edu>;Jim Allan,
Accessibility Coordinator
Texas School for the Blind and Visually Impaired
1100 W. 45th St., Austin, Texas 78756
voice 512.206.9315 fax: 512.206.9264 http://www.tsbvi.edu/
"We shape our tools and thereafter our tools shape us." McLuhan, 1964