Slashdot Mirror


Do Zebra Stripes Actually Help?

RyoShin writes "A List Apart, an excellent resource for web development and related aesthetics, has put together an article based on original research by Jessica Enders into 'zebra striping.' From the article: 'Zebra striping [coloring alternate rows] is used when data is presented in an essentially tabular form. The user of that table will be looking for one or more data points. Their aim is to get the right points and get them as quickly as possible. Therefore, if we set a task that uses a table, and zebra striping does make things easier, then we would expect to see improvements in two things: accuracy and speed.' The conclusion of the peer reviewed paper? It's a wash. Striped tables offered only a slight increase in accuracy and speed overall. The article notes a few other benefits to using Zebra striping, so it's all up to the individual."

5 of 234 comments (clear)

  1. Coloring every 3rd or 5th row helps too by davidwr · · Score: 3, Interesting

    I don't have a study to prove it, but coloring or otherwise marking every Nth row, where n is a smallish number, say 2-5, helps.

    Anyone else remember fanfold wide-format computer paper that was colored white and green in alternating blocks of 3 rows each?

    --
    Knowledge is how to play a game, intelligence is how to win, wisdom is knowing what game to play.
  2. Bad example by Anonymous+Cowtard · · Score: 4, Interesting

    So they conclude it doesn't help (though their own data says that it does, even though it's slight) based on THAT table? Maybe they should try it again with a zebra striped table where the difference between the colors used is slightly more pronounced. I don't know about the rest here but I personally think I had a harder time with that because the color difference between rows was so slight than if they had left out the color. Played tricks on my eyes.

  3. Possible alternative? by sloth+jr · · Score: 3, Interesting

    If zebra striping doesn't actually make it easier to identify which cells actually belong to a given row - maybe a rethink of what is trying to be accomplished here could help. Perhaps highlighting of the row under the cursor?

    sloth jr

  4. Helps a LOT if you have Nystagmus by blind+biker · · Score: 4, Interesting

    Nystagmus is a condition where your eyes oscillate at a frequency of about 1 Hz (roughly), usually horizontally. Having rows and especially columns coloured differently helps very much for someone affected by Nystagmus, to distinguish between columns.

    BTW, a wider font like Verdana is also highly recommended.

    --
    "The agriculture ministry is not in charge of Gundam" - Japanese ministry official.
  5. Re:Maybe not faster but more Aesthetically Pleasin by CrazedWalrus · · Score: 4, Interesting

    On printed pages, I've seen people using a ruler to help scan through tables of numbers. I thought that was where the idea for zebra striping came from. Honestly, I'm surprised that it was only a minor improvement. Maybe it's just me and my bad eyes, but I think it helps tremendously. It probably also matters how many columns there are -- the more there are, the more it helps. I'd also suspect that fatigue would kick in, so it would make less difference for, say, less than 100 exercises, and more difference after that. [Didn't RTFA. Maybe they address those points.]

    I'm no GUI designer, but when I make utility web pages that use tables, I tend to use either zebra striping or a tr:hover that uses a light yellow to highlight the line under the mouse pointer. That way, if I feel I need the help to track through the table, I just run the mouse down the columns and it lines up the current row for me very nicely. IMHO, this is a nice compromise where zebra striping might not look good, but the user might want the help nonetheless.