E-mail List Archives

Search E-mail List Archives for

Number of posts in this thread: 12 (In chronological order)

From: Michael Vogt
Date: Tue, Feb 10 2015 1:34AM
Subject: Reorder table columns
No previous message | Next message →

Hello.

I was asked what would be a sensible way to provide reordering of
columns in an accessible way. Couldn't find anything helpful
elsewhere.

Is this even possible?


Thanks,
Michael

From: Birkir R. Gunnarsson
Date: Tue, Feb 10 2015 8:00AM
Subject: Re: Reorder table columns
← Previous message | Next message →

Hi

You could have a "move left" and "move right" buttons for each of the
column headers in the table. When activated these would move the
columns left or right in the table structure. (these should be in the
th cell containing the column header for the table).

You can use the table summary attribute (which is invisible) to
explain this to screen reader users, something along the lines of
"Each column header has two buttons which, when activated, move that
column to the left or right in the table."
Make sure to put aria-disabled="true" on buttons that are inoperable,
such as the "move right" button when column is the rightmost column in
the table or "move left" for leftmost column.

You could also implement a drag n drop type functionality e.g. using a
dropdown containing all the column names, where users can grab an item
(column) using the spacebar and then drop it elsewhere within the list
using the spacebar again. That dropdown would then control the display
of the associated table.
This can be done, it is more coding, but makes for a nicer table
(withouta additional controls).
Cheers





On 2/10/15, Michael Vogt < = EMAIL ADDRESS REMOVED = > wrote:
> Hello.
>
> I was asked what would be a sensible way to provide reordering of
> columns in an accessible way. Couldn't find anything helpful
> elsewhere.
>
> Is this even possible?
>
>
> Thanks,
> Michael
> > > >


--
Work hard. Have fun. Make history.

From: Don Mauck
Date: Tue, Feb 10 2015 8:03AM
Subject: Re: Reorder table columns
← Previous message | Next message →

Before I go too far down the wrong path, are you talking about moving columns around or just changing the ascending/descending order?

From: Birkir R. Gunnarsson
Date: Tue, Feb 10 2015 8:07AM
Subject: Re: Reorder table columns
← Previous message | Next message →

Good point ..
if we are talking sorting, that is a different animal witha different
answer, slightly.

On 2/10/15, Don Mauck < = EMAIL ADDRESS REMOVED = > wrote:
> Before I go too far down the wrong path, are you talking about moving
> columns around or just changing the ascending/descending order?
>

From: Michael Vogt
Date: Tue, Feb 10 2015 8:16AM
Subject: Re: Reorder table columns
← Previous message | Next message →

Hello Birkir.

Thank you for your answer. This helps a lot.

Cheers,
Michael

From: Michael Vogt
Date: Tue, Feb 10 2015 8:18AM
Subject: Re: Reorder table columns
← Previous message | Next message →

Hello Don.

Birkirs answer was exactly what I was looking for - reordering columns of a
table (moving them left or right). Sorry when my question was not clear
enough.


Thanks,
Michael

From: Jonathan Avila
Date: Tue, Feb 10 2015 11:02AM
Subject: Re: Reorder table columns
← Previous message | Next message →

> I was asked what would be a sensible way to provide reordering of columns in an accessible way. Couldn't find anything helpful elsewhere.

I'd follow paradigms that I see in the software world for making these accessible. This usually consists of a dialog box with a list of columns with move up and move down buttons. There are of course other ways to accomplish this such as via keystrokes.

Jonathan

--
Jonathan Avila
Chief Accessibility Officer
SSB BART Group
= EMAIL ADDRESS REMOVED =

703-637-8957 (o)
Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter

From: Ryan E. Benson
Date: Tue, Feb 10 2015 11:14AM
Subject: Re: Reorder table columns
← Previous message | Next message →

I would advocate for Jonathan's approach over Birkir's. Birkir's would add
2x(number of cols)-2 tab stops to the page, and would be burdensome for
people who use the keyboard vs a screen reader to navigate. Jonathan's
could be tucked into another page or modal window.

--
Ryan E. Benson

On Tue, Feb 10, 2015 at 1:02 PM, Jonathan Avila < = EMAIL ADDRESS REMOVED = >
wrote:

> > I was asked what would be a sensible way to provide reordering of
> columns in an accessible way. Couldn't find anything helpful elsewhere.
>
> I'd follow paradigms that I see in the software world for making these
> accessible. This usually consists of a dialog box with a list of columns
> with move up and move down buttons. There are of course other ways to
> accomplish this such as via keystrokes.
>
> Jonathan
>
> --
> Jonathan Avila
> Chief Accessibility Officer
> SSB BART Group
> = EMAIL ADDRESS REMOVED =
>
> 703-637-8957 (o)
> Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter
>
>
>

From: Tim Harshbarger
Date: Tue, Feb 10 2015 2:28PM
Subject: Re: Reorder table columns
← Previous message | Next message →

Another way to implement Birkir's solution would to only include the extra buttons if the user selects an option indicating they want to change the format of the table. Think of that as being more a mobile paradigm, here certain features are hidden on the UI until you click an Edit button

Thanks,
Tim

From: James Nurthen
Date: Tue, Feb 10 2015 6:07PM
Subject: Re: Reorder table columns
← Previous message | Next message →

If adding extra stuff to the table headers I would also recommend
using the abbr attribute on the th cell to avoid the additional
buttons getting read as headers when navigating throught the rest of
the table with a screen reader.
i.e.
<th abbr="Last Name">Last Name <button>Move last name
left</button><button>Move last name right</button></th>

On Tue, Feb 10, 2015 at 1:28 PM, Tim Harshbarger
< = EMAIL ADDRESS REMOVED = > wrote:
> Another way to implement Birkir's solution would to only include the extra buttons if the user selects an option indicating they want to change the format of the table. Think of that as being more a mobile paradigm, here certain features are hidden on the UI until you click an Edit button
>
> Thanks,
> Tim
>
>
>

From: Michael Vogt
Date: Wed, Feb 11 2015 10:11AM
Subject: Re: Reorder table columns
← Previous message | Next message →

Thank you very much. All great advice.

Yes, not polluting the header with a lot of elements is a for sure a
good idea. Birkir's popup and Jonathan's dialog are good ideas, I
think. To open these, would be one settings button for the whole
header/table an acceptable idea?

Cheers,
Michael

From: Jonathan Avila
Date: Wed, Feb 11 2015 10:35AM
Subject: Re: Reorder table columns
← Previous message | No next message

> To open these, would be one settings button for the whole header/table an acceptable idea?

Yes.

-- 
Jonathan Avila 
Chief Accessibility Officer
SSB BART Group 
= EMAIL ADDRESS REMOVED =
Phone 703.637.8957  
Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter