Welcome to WebmasterWorld Guest from 174.129.127.214

Forum Moderators: ergophobe

Message Too Old, No Replies

Table Sorting

What is best practice?

   
10:15 pm on Feb 8, 2007 (gmt 0)

WebmasterWorld Senior Member pageoneresults is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Top to bottom?

A D G
B E H
C F I

Or left to right?

A B C
D E F
G H I

I'm involved with a discussion right now where an application I'm having developed was done with a left to right sort for tabular data. Unfortunately this doesn't work for the client and I'm catching some flack from the development side.

Is there a "best practice" for this? As a user of tabular data, I'm used to seeing it from top to bottom.

11:47 pm on Feb 8, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Top to bottom?

A D G
B E H
C F I

Or left to right?

A B C
D E F
G H I

I'm involved with a discussion right now where an application I'm having developed was done with a left to right sort for tabular data. Unfortunately this doesn't work for the client and I'm catching some flack from the development side.

Is there a "best practice" for this? As a user of tabular data, I'm used to seeing it from top to bottom.

I guess it depends upon the use case. If each item is a cell, with everything it needs in one atomic unit, then probably top to bottom is best. However, if, as your example suggests, the cells relate to each other in some "flow" order, then, as long as the intended audience is used to a Roman/Cyrillic script system, left to right is better from a user point of view.

I have a feeling that it is being objected to on the basis of technical implementation. I had a massive epiphany a few years ago, when I switched from an "engineering-centric" model to a "user-centric" model, which can be more difficult to implement.

As NNG is constantly saying, a user study is the only way to really answer your question. However, if the client that is paying the duckets wants it one way, then they make the rules...

Post your resolution here. This is an interesting conversation.

11:52 pm on Feb 8, 2007 (gmt 0)

WebmasterWorld Senior Member pageoneresults is a WebmasterWorld Top Contributor of All Time 10+ Year Member



What I'm dealing with is a category page similar to that of dmoz.org. I have three columns from left to right. The data is coming in just like it does at dmoz.org, from left to right and not top to bottom. From a user perpective (me), I'm used to reading alphabetized data from top to bottom, then to the next column from top to bottom, and then the next column.

In this scenario, I have alphabetized data running left to right and then top to bottom. My eye keeps wanting to travel down the column instead of across the row.

12:13 am on Feb 9, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



alphabetized data running left to right and then top to bottom

As I understand it - where's DrDoc? ;) - that's the correct way to list tabular data from an accessibility standpoint, because it's the order in which a text-only browser would read it.
12:16 am on Feb 9, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I would say simply personal preference or requirement specification (with accessibility concern noted). Most tables I read fit door#1. I believe this is primarily because it most closely replicates our normal ltr reading habit.

1. Do you place the 'importance' on the columns and read data across table by row? Or rephrased: is the table primary 'index' the first column?
Note: JAWS 'screen layout' mode reads this way.

2. Do you place the 'importance' on the rows and read the data down table by column? Or rephrased: is the table primary 'index' the first row?

3. Or is the table a true matrix where the juncture is most important?
Example: a milage chart with city names repeated both down the first column and across the first row. Picking any two cities yields the same juncture regardless which is read from row or column.

11:19 pm on Feb 9, 2007 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



where's DrDoc?

Without complicating things ... Yes, left-to-right and then top-to-bottom would be the preferred way of sorting things.
With complication ... you can actually instruct the user (and useragent) with regards to how things are sorted logically, without regards to the actual visual presentation layout.

Now, that being said ... Does the data you are listing actually follow a row and column matrix, or is it better understood as multiple sets of information that will appear on one row only to wrap to the next whenever suitable?

Perhaps a definition list would be a more suitable element? In other words -- instead of this (hypothetical data):

<table>
<caption>Available Destinations</caption>
<tr>
<td>Aberdeen</td>
<td>Brussels</td>
<td>Cairo</td>
</tr>
<tr>
<td>Dortmund</td>
<td>Eilat</td>
<td>Zurich</td>
</tr>
</table>

Something like this:

<dl>
<dt>Available Destinations</dt>
<dd>Aberdeen</dd>
<dd>Brussels</dd>
<dd>Cairo</dd>
<dd>Dortmund</dd>
<dd>Eilat</dd>
<dd>Zurich</dd>
</dl>

Then, for visual representation, you can always give each

dd
element a fixed size and float it left. You get the appearance of a table, but the semantics of something more suitable for the data in question.
11:22 pm on Feb 9, 2007 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Thought #2:

Why not just have a long single-column table, with appropriate <tbody> sections for each letter, and then style it -- somehow -- to get the "phone book" appearance?

2:21 am on Feb 12, 2007 (gmt 0)

WebmasterWorld Administrator robert_charlton is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month



What I'm dealing with is a category page similar to that of dmoz.org. I have three columns from left to right. The data is coming in just like it does at dmoz.org, from left to right and not top to bottom. From a user perpective (me), I'm used to reading alphabetized data from top to bottom, then to the next column from top to bottom, and then the next column.

In this scenario, I have alphabetized data running left to right and then top to bottom. My eye keeps wanting to travel down the column instead of across the row.

pageone - I think the word "table" biases the question. In software like MS Word, as well as in html, the order of data is left-to-right across each row and then down to the next row.

You are actually talking about a long list. When I look at dmoz, I see several kinds of layouts for long lists, and they are in fact inconsistent. Either kind can work if you pay attention to certain visual considerations.

Take a look at the Recreation page. Up at the top, there's a two column unordered list of subcategories, and each column reads top to bottom. The layout works because of the horizontal alignment of the bullets (in two vertical columns), and because of the white space between the columns, which keeps you from wanting to read across.

But, down below, there's a three-column list of languages... and these read across each row and then down to the next row. No bullet points, and not much white space in between columns, so you do read across.

Both are tables, of course, but the "tabular" display of the language names is a tighter visual grouping. The language names are all also pretty much the same length.

The top bulleted list in columns, I feel, is better suited to handle category entries that differ in length, since the white space in between the columns doesn't cause a problem... and it's probably better suited to lists that change, as it would be easier to maintain.

But with proper layout, use of grid-lines and space, etc, you could probably make either work visually.

On this particular dmoz page, I prefer the vertical columns that I read down.

PS: If you're talking about the home page of dmoz, there I do prefer the rows. With three columns, particularly with subcategories, I don't think there could be enough white space between columns to make columns predominate so you would read them down. I tend to read these rows across.

[edited by: Robert_Charlton at 2:32 am (utc) on Feb. 12, 2007]