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."

It looks nice

[dintech (998802)]

Although it might not provide much extra accuracy, it does make for a nicer looking GUI. That counts for something in todays widget driven environment...

Re:It looks nice

[couchslug (175151)]

If your are PRINTING a checklist for use outdoors, at night, etc striped tables IMO work MUCH better for checklists. In the Air Force we used them for generation checklists (scan down task lists at the side vs tail
numbers at the top) to fill in times.

Re:It looks nice

[holophrastic (221104)]

Personally, I think that they are done best when striped in sets of three, makes following the line even easier. But that's not my point. Apparently the article says that it offers only minor improvements in accuracy and speed. That's not a wash, that's a minor improvement. Considering the virtually no effort to achieve the minor improvement, I'd call that a significant benefit.

Re:

[MythoBeast (54294)]

I'm in agreement with the parent post. Highlighting every other line doesn't actually produce much difference between the highlighted lines and the unhighlighted ones. There's a minor difference between the two, and you can double check to the front of the line that you're looking at a line of the right color, but the regular spacing between the two actually eliminates the ability to use the striping as a horizontal guide for the eye.

Shading in every third line actually provides the eye a stronger guideli

Re:It looks nice

[ShieldW0lf (601553)]

It seems that way, doesn't it?

Zebra striping becomes more useful the further apart the key row is from the data in the row. It also becomes more important if there are no lines between the rows and columns. It's practically essential when you're trying to view a wide table where the key must be scrolled off screen to view the pertinent data.

In this study, the key row was the tolerance in grams, and the data was the factory outlet boolean. They were an inch and a half apart from each other, and there was no necessity to interpret multiple values in a row, but only vertically scan the key column and test for the existence of a row that has yes in the factory outlet column right next to it.

These people are spreading misinformation. The study was so contrived to support the premise, and so consciously avoidant of the actual situations where zebra striping becomes useful, that it's difficult to believe it wasn't intentionally done. If nothing else, there was far, far too little study done to make any conclusion whatsoever.

Whoever is behind article this should be working at MacDonalds.

Re:It looks nice

[holophrastic (221104)]

two things. first, it's only insignificant if it took effort to do. if it's free to do, and it doesn't hurt, and it rarely helps, then it's worth doing.

second, authetically pleasing is also worth points when it doesn't hurt anything else.

third, and perhaps most importantly, just because I can drive as fast and as safely on a sunny day as I can on an over-cast day, doesn't mean that one isn't easier than the other. professional typers type just as quickly on a qwerty keyboard as they do on a dvorak keyboard because they are professional typers and will adapt to just about anything. But they still expend more effort on a owerty keyboard than on a dvorak one -- simply put, their fingers travel farther.

I don't suppose that this experiment studied the cognitive effort required, nor stressed the patricipants to measure their accuracy during significant distraction -- like driving, or listening to something important, or carrying a conversation, or giving a presentation.

Re:It looks nice

[redxxx (1194349)]

But they still expend more effort on a owerty keyboard than on a dvorak one -- simply put, their fingers travel farther.

They have fewer typos with the word Qwerty though.

Re:It looks nice

[kent_eh (543303)]

Still, a slight improvement is still an improvement.
Isn't an improvement in accuracy is better than no improvement, or a decrease?

Re:

[moderatorrater (1095745)]

Okay, saying it's a wash is absolute bullocks. The difference was small, but it was there. When you're an end user, do you want the designer to say, "screw it, it's only a few percentage points," or do you want them to do everything they can to make it easier?

Most UI differences are small; the difference between having the task bar in the middle of the screen and on the edge of the screen is very small as well, but that doesn't make it not worth doing.

Re:

[by Anonymous Coward]

The difference is small for a half-assed 9 column table with lots of visual clues like they prepared. Try a real table in small print without alternating text entries and with narrow spacing. The difference will be enormous.

Re:It looks nice

[abolitiontheory (1138999)]

Exactly. Is the improvement in "accuracy and efficency" really the only goal? What about a more pleasurable user experience, reduced stress or sense of fatigue, etc? Essentially, any time we treat humans like machines we miss a huge part of the equation. If a humans overall comfort level is increased, as long as it is not in a way which directly detracts from the work they are performing (alcohol comes to mind), they're almost guarunteed to be more productive and committed in the long term. This is the same reason we buy fancy coffee for drastically overmarked prices, instead of the dollar cup from BlowJoe Coffee. Aesthetic and experience matter, and if there are no marked *decreases* in efficiency due to table striping, then I'll do it every day of the week.

a candidate for the ignobel prize?

[circletimessquare (444983)]

http://improbable.com/ [improbable.com]

Do Zebra Stripes Actually Help?

[Rik Sweeney (471717)]

Yes, much in the same way that Go Faster Stripes work...

Re:Do Zebra Stripes Actually Help?

[Thanshin (1188877)]

The other option is Red. Red is always faster.

The now extinct Red Go Faster Striped Zebras easily outran cheetahs. They didn't actually go extinct; they just migrated so fast, time stopped for them.

Re:Do Zebra Stripes Actually Help?

[WhiplashII (542766)]

Except...

Please remember that some of us are colorblind!

(I was trying to start the "Meet the Robinsons" Blue Ray disk the other day, and couldn't find the "Play" option. It seems some genius over there made the text green on white, and therefor invisible to me...)

Re:Do Zebra Stripes Actually Help?

[Palshife (60519)]

green on white, and therefor invisible to me...

Good God, how do you read Slashdot?!

Re:

[edalytical (671270)]

That's why DVD menus in all incarnations shouldn't exist! I can imagine how frustrating that can be, I've had problems using DVD menus and I'm not color blind. I've also had to sit though a class were a professor was trying to show a clip from a DVD, but the DVD menu designer didn't make the highlight color contrast enough for a projector, needless to say a lot of time was wasted while the professor tried to guess when the correct item was selected.

I really hate DVD menus. At the very least make them

Re:

[WhiplashII (542766)]

Heh, my family keeps making fun of me because when I was teaching my daughter to safely cross the street at intersections, I told her to look at the "green guy". Apparently although the traffic light is green, the little guy is white - who knew?

Also, I can never move to Texas. The rest of the country has vertical traffic lights, but not Texas. It is bad enough to choose red and green as the stop and go colors, with the full knowledge that a large percentage of the population can't see them - it is a trav

How about scalability?

[by Anonymous Coward]

Finding data in nine columns with alternating text and numbers is easy. Try upping the number of columns, using only numbers, use close spacing, and reduce the text size. Then you will see a difference. This experiment is flawed because they didn't test how the values scale with more columns and less helpful clues (like the differences between text and spacing in their sample table). This article should have been rejected for not taking into account these issues.

Coloring every 3rd or 5th row helps too

[davidwr (791652)]

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?

Re:

[by Anonymous Coward]

3 rows is the most you should go when striping. That makes every row distinctive -- it's either unbordered, bordered on top or on bottom.

Don't try 2-row striping -- for some reason it just looks wrong, like each pair is supposed to be related. Probably because it's just less common.

Re:Coloring every 3rd or 5th row helps too

[rubycodez (864176)]

it's called green bar paper, and it's still used, young jedi.

Re:

[boris111 (837756)]

It's a fond memory actually from growing up in the 80's. When I was young brat my dad would bring those home with him to look them over. He'd also bring left over print outs for us to draw on. I remember they had a strange smell. He also brought home old punch cards for the same purpose.

at zebra crossings

[line-bundle (235965)]

if you get run over at a zebra crossing you'll be easier to see whether you are black or white.

Yes, please.

[mpathetiq (726625)]

I personally hate when long tables/lists aren't zebra striped. If the type is smaller than 10 point or so, I REALLY need this.

Yes and No.

[LWATCDR (28044)]

It depends on the program displaying the data. Some programs allow you to to click on the row and get that one row highlighted. That is a huge help. Others like tables on a web page don't allow that. In that case I say it does help.
Also the size of the table makes a difference.

Re:Yes and No.

[WhiteDragon (4556)]

It depends on the program displaying the data. Some programs allow you to to click on the row and get that one row highlighted. That is a huge help. Others like tables on a web page don't allow that. In that case I say it does help.

In Firefox, when looking at html tables, you can hold down ctrl and select the row. I find this to be fairly helpful.

A test without fatigued test subjects...

[jakesher (546070)]

is irrelevant.

Re:

[raddan (519638)]

Good point, and here's another: her tables are not nearly large enough. I'd like to see the author add a "scale" component to her study. Striping on small tables may have a negligible benefit, but on large tables, I think you'll see something significant. Maybe the obviousness of this benefit is lost on people now that we have fast computers-- after all, a fast computer can look up table data (or heck, compute it directly) a lot faster than you can, so I expect that really big tables aren't so common any

They absolutely help

[truthsearch (249536)]

On narrow tables they don't make a difference. But on wide tables they're almost a necessity. Without any table cell borders, like a spreadsheet, or striping, the eye easily wanders up or down into another row when reading across. I can say anecdotally that I'm far more accurate and faster when reading a table with stripes.

Either way, they certainly can't hurt, especially if they're a pale color. So why are we even having this discussion?

of course

[gEvil (beta) (945888)]

Of course they help. They let us know where it's legal to cross the street.

Bad example

[Anonymous Cowtard (573891)]

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.

Possible alternative?

[sloth jr (88200)]

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

Re:

[A Friendly Troll (1017492)]

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?

I'd mod you up if I had some points.

I've worked for a reasonably large company and designed a web app that was potentially to be used by several thousand different people (by the time I left, about eight hundred did). So, I've done some rather amateurish usability testing by observing what people actually do when reading tabular data.

Over 60% of my test subjects used the mouse to scan a table (a striped one, obviously). They would move the pointer to the first column, and then slide it to the right until t

That was useful

[LighterShadeOfBlack (1011407)]

Study conducted of whether long-held belief has real benefits. Conclusion: Maybe a little.

News at 11.

Depends on the table

[techpawn (969834)]

The more columns/complex the table Zebra striping will help the user not lose their place. But, this needs to be balanced with the length of the table. After a while they will forget which line they're on regardless of formatting.
That's why I'm a fan of showing the least amount of data I can. More complex = more chance for errors. Drill down application are a pain, but, better than a mistake in payroll.

I love it

[krog (25663)]

That's why I still print out web pages on greenbar before reading them.

Why it didn't help...

[BytePusher (209961)]

I can tell you why it didn't help. They formatted their table with large spaces between columns and they had only 9 rows. If they tried the same study where they also varied the number of rows I am sure they would find that as the rows increase the positive effect of zebra striping increases. It seems they had a bias built into their test in order to find something unexpected... otherwise the study would have proved pointless.

I can see the Slashdot headline now, "A practice used for over half a century still proves to be useful!" Somehow, I think such a headline falls under the category of "not news."

Re:

[BytePusher (209961)]

correction: switch rows with columns in my post.

I can tell you why it didn't help. They formatted their table with large spaces between columns and they had only 9 columns. If they tried the same study where they also varied the number of columns I am sure they would find that as the columns increase the positive effect of zebra striping increases. It seems they had a bias built into their test in order to find something unexpected... otherwise the study would have proved pointless. I can see the Slashdot headline now, "A practice used for over half a century still proves to be useful!" Somehow, I think such a headline falls under the category of "not news."

An obvious problem with the study

[archeopterix (594938)]

I see a problem with the experiment. The hard part of the questions involves scanning down a column , where horizontal striping obviously does not help.

Re:

[hyfe (641811)]

Heh, that's I really good point.

I thought it was self-evidentary that stripes should run the same way you're most likely to scan.. so you don't have to work too hard to keep your eyesight on the same line. Apparently it wasn't that evident though.

That said, zebra-stripes are nice when you choose good colours, and have them run in the direction they're supposed to.. and they're really horrible when you screw up.. as a lot of people do.

Another problem

[Selanit (192811)]

In addition to that excellent point, I'm skeptical about the way the table was designed. There's an image of the table here:

http://alistapart.com/d/zebrastripingdoesithelp/data-table.png [alistapart.com]

The "ordinary" rows have a background color of pure white. The "striped" rows have a background color of #F5F5F5, a very light grey. I'm all in favor of subtle design, but there is such a thing as being too subtle.

Perhaps the stripes did not help noticeably because there was insufficient contrast between the rows?

Not enough data to answer the question!

[elwinc (663074)]

The experimental design is good, and I'm glad the experiment was done, but the conclusion of the paper is that there's not enough data to answer the question!

There may be an effect, but if so, it's small enough that 281 experimental subjects and six questions are not enough to yield statistically significant results. That result alone (that the effect is small at best) makes the paper worthwhile to me. One small quibble: on a web page, I can often use scrolling and the bottom or top of the page to check alignment on a wide table. Maybe zebra stripes are more useful on paper.

But before I give up entirely on zebra stripes, I'd like to see what happens when [1] the table is made wider; [2] the table is made taller; [3] the zebra stripes are 2 or 3 rows wide instead of 1; [4] the stripes are made darker and/or a different color.

C'mon people who want publications, there are lots of other things to try here.

Helps a LOT if you have Nystagmus

[blind biker (1066130)]

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.

sample size too low, and wtf?

[Animaether (411575)]

I'll get the wtf out of the way first
"Given that applying zebra striping in an electronic medium is a nontrivial task"

Say what? Any application that is based on columns and/or rows has trivial access to those columns/rows as separate entities. Markup for such columns/rows is easily changed. 'mod N 2 == 0? grey:white' is hardly nontrivial, it's so basic that if you can't manage to do it, you must be using the wrong software.

---

Now for the scope - it seems like the only research they have done is when data in the sheet is dense and the sheet itself is not all that wide.

Now try with a wide sheet and instead of every 'cell' or at least one of its close neighbors having data in it, imagine lots of empty cells. Now try and see if zebrastriping helps or not. I can guarantee you that without any visual cues, your lining up of something in the leftmost column to the same line on the rightmost column is going to fail far more often than you'd like.

--

Oh wait, they even admit as much:
"However, there is clearly a need for additional studies to investigate how task difficulty and the size of the table/form influence the effect of zebra striping."

No shit. I'm glad you admitted that your sample size is too low.

Questions are bizzare

[bperkins (12056)]

Perhaps I'm being a bit pedantic, but am I the only one that thought some of the questions were oddly worded?

Here's what I view as correct answers:

Q What is the name of the screw that costs $35.66?

A: None. The M28 screw costs $35.66 per 50.

Q There are 664 screws of which minor diameter tolerance?

A: None. The M18 Screw has a minor diameter tolerance of 8g, and there are 664 of those, but there are 1442 screws with a tolerance of 8g.

Q: There are 292 screws of what thread pitch?

A: None. There are 292 M16 screws which have a thread pitch of 2mm, but there are 527 screws with a thread pitch of 2mm.

Follow-up Survey

[RyoShin (610051)]

If you didn't like how they ran this test (and I agree with most of the complaints), A List Apart is running a follow-up survey over the internet. I almost missed this, as it isn't mentioned until the very end of the article.

You can find it at http://surveys.formulate.com.au/dtfu [formulate.com.au]. It takes about three-five minutes. I just took it, and they appear to be using darker row colors now. It's still too narrow to see how useful it is when you have to scroll horizontally, but it's a small improvement at least.

whoa, even worse

[nguy (1207026)]

Apart from the just plain wrong statistical reasoning, the experiment was done under uncontrolled conditions over the Internet. The sample table in the article actually had lines separating the columns and rows. Geez, with that, it's not surprising that the author finds no differences!

Zebra striping may or may not help significantly, but this paper won't tell you either way.

Re:

[stoofa (524247)]

They also help the pack slice their dinner up fairly. For very lazy lions there are now even zebras with perforated easy-claw edges down every third black stripe.

Re:Maybe not faster but more Aesthetically Pleasin

[CrazedWalrus (901897)]

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.