WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Tabset with X buttons to remove tabs

for

From: Jesse Hausler
Date: Jun 10, 2014 5:26PM


We've actually been following that spec, but i must have missed that line.
I still like Jonathan's method better, as it removed the need to know
keyboard commands.

Thanks for your help.
Jesse


On Wed, Jun 4, 2014 at 10:48 PM, James Nurthen < <EMAIL REMOVED> > wrote:

> 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
> > > > > > > list
> > > messages to <EMAIL REMOVED>
> > > > > > > > > > > >
> > > > > > > >
> > > >