WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Tabset with X buttons to remove tabs

for

From: James Nurthen
Date: Jun 4, 2014 8:48PM

Have you checked http://www.w3.org/TR/wai-aria-practices/#tabpanel
It says to use a keystroke or a popup menu to accomplish this.
We also add aria-describedby pointing to some text that says that the tab
can be removed so a user knows it is removable without requiring trial and
error.

Regards,
James


On Wed, Jun 4, 2014 at 5:31 PM, Jesse Hausler < <EMAIL REMOVED> >
wrote:

> That's not a bad idea!
>
> So I think we'll set tabindex="-1" on the non active tabs, and tabindex="0"
> on the active tab. This way mouse users can still click the links and close
> out the tabs without needing to open them first.
>
> Thanks Jonathan.
>
> Jesse
>
>
>
> On Wed, Jun 4, 2014 at 7:08 PM, Jonathan Avila < <EMAIL REMOVED>
> >
> wrote:
>
> > > Here's the catch... we have little x buttons on each tab, so users can
> > remove them from the page. The "remove tab" x's are currently anchors,
> but
> > this causes a problem.
> >
> > I make only the currently active tab's close X focusable by removing the
> > others from the focus order.
> >
> > Jonathan
> > SSB BART Group
> >
> > -----Original Message-----
> > From: <EMAIL REMOVED>
> > [mailto: <EMAIL REMOVED> ] On Behalf Of Jesse Hausler
> > Sent: Wednesday, June 04, 2014 7:03 PM
> > To: WebAIM Discussion List
> > Subject: [WebAIM] Tabset with X buttons to remove tabs
> >
> > Hi everyone,
> >
> > We're working on building a tabset component, and are following the ARIA
> > authoring practices guide for keyboard accessibility (and aria).
> >
> > This means that all of the tabs are one focus stop, with right and left
> > arrow to navigate from tab to tab.
> >
> > Here's the catch... we have little x buttons on each tab, so users can
> > remove them from the page. The "remove tab" x's are currently anchors,
> but
> > this causes a problem.
> >
> > Here's what happens.
> >
> > When i press the Tab-Key, I move through the close anchors before
> entering
> > the selected tab panel. So if i have 20 tabs open and i want to enter the
> > second tab, i have to tab through 20 "remove tab" links before entering
> > the panel.
> >
> > With Jaws, i can do Jaws+Alt+M and move inside the tab panel without
> > issue.
> > However, that doesn't help other keyboard users...
> >
> > Any thoughts or advice?
> >
> > Thanks,
> > Jesse
> > > > > > messages to <EMAIL REMOVED>
> > > > > > > >
> > > >