WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accordion semantics?

for

From: Bryan Garaventa
Date: Jun 18, 2014 8:29PM


Personally I've never been fond of using ARIA Tab constructs for accordions,
because it's impossible to tell the difference between a tab group and an
inline accordion, because the feedback is the same for screen reader users.
E.G if you have a tab group nested in an accordion, how do you know which is
which for instance, which may be important because accordions render content
inline whereas tabs render content after a tablist group.

Is there something wrong with just keeping it simple?

E.G

ARIA Toggles:
http://whatsock.com/tsg/Coding%20Arena/ARIA%20and%20Non-ARIA%20Accordions/AR
IA%20Accordion%20(Internal%20Content)/demo.htm

Expandable ARIA Links:
http://whatsock.com/tsg/Coding%20Arena/ARIA%20and%20Non-ARIA%20Accordions/AR
IA%20Accordion%20(Internal%20Content)/demo2.htm

-----Original Message-----
From: <EMAIL REMOVED>
[mailto: <EMAIL REMOVED> ] On Behalf Of Jesse Hausler
Sent: Wednesday, June 18, 2014 5:32 PM
To: WebAIM Discussion List
Subject: [WebAIM] Accordion semantics?

Thoughts on the best semantic for an accordion component?

I'm good with the keyboard and ARIA recommendations in the ARIA Authoring
guide:
http://www.w3.org/TR/wai-aria-practices/#accordion

I'm just don't care for the semantics in their only example:
http://www.oaa-accessibility.org/examplep/accordian1/

Paired headings and divs as the way to go?

Thanks,
Jesse
messages to <EMAIL REMOVED>
<mailto: <EMAIL REMOVED> >