To use or not to use "Zebra Stripes", or Alternating Row Colors for Tables

  • Is there any research out there showing whether or not alternating the row colors for a table increases/impedes the time it takes to parse information? An example can be found at the following location:

    enter image description here

    I generally find it easy to associate the input fields with the row names as long as the table is formatted correctly. So, I am not sure if alternating the colors actually adds to the user experience, but I guess I can see why this is stylistically appealing.

    I'm not going to be citing any scientific survey or anything like that, so I'll make this a comment instead of an answer, but I prefer zebra'd tables. The color difference should be slight, however -- I don't like strong zebras. Also, as explained by others, the very best method is allowing the user to highlight a selected row, but that's sometimes not really appropriate, in which case a weak zebra is preferred.

    The example is bad because the first column is not included in the alternate coloring, making it rather painfully useless.

    Zebra strips add noise without meaning to tables. Please avoid them. Edward Tufte (top visualization expert) says so, and me too :). "Strips are merely bureaucratic or designer chartjunk; good typography can always organize a table, no stripes needed". Longer explanation here: https://ux.stackexchange.com/a/121430/33122

  • Jessica Enders wrote an article on A List Apart about three studies she did to determine whether "zebra stripes" are helpful.

    The first study, described in an earlier article, tested users' ability to read and interpret data in a simple table. The second study was similar to the first, with an improved methodology. The third study attempted to determine whether users tend to have a subjective preference for striped tables.

    The recommendation

    The results of the three studies conducted to date suggest that the safest option is to shade the alternating, individual rows of your table with a single color. Taking this approach is likely to ensure that:

    • task performance is better, or at least no worse, than with other table styles, and
    • the aesthetic sensibilities and subjective preferences of the majority of your users are catered for.

    If zebra striping of this type cannot be done easily, then ruling a line between each row may be the next best option.

    Update: Don't miss Filipe Hoffa's answer below.

    Funny, I just read a study that said exactly the opposite. I'm going to see if I can dig it up.

    I wonder if a rainbow-like styling has a more positive effect. Since each row has a distinct color it seems like they would be even easier to tie together. That obviously wouldn't be desirable in most cases though, for aesthetic reasons.

    This experiment shouldn't be used as a general guide since it lacks different scenarios (small datasets, big datasets, small gaps between columns/rows, big gaps etc). My gut feeling is that zebra stripes help, but on the other hand - why doesn't Excel use zebra stripes in its standard mode (you have to create a table with custom striping)?

    Thanks, @sholsinger! Rewrote the answer to emphasize the newer article.

    @Pat and by that you mean it completely reverses your original answer :p

    @Joe Yeah, pretty much. :-)

    @HenrikEkblom: "why doesn't Excel use zebra stripes in its standard mode (you have to create a table with custom striping)?" - I suspect for purely technical reasons: Unless explicitly specified otherwise, each cell uses the default background colour. Automatically initializing every second row across the entire sheet with a different background colour setting (or assigning a conditional formatting to all cells) would not simply be a different preset, but rather an entirely new feature. Combine that with the issue that there are *many* cases where the default would not work (a focus on ...

    ... columns rather than rows, rows being used for vertical spacing, several logical tables arranged on one worksheet, forms or other displays that are not directly row-based tables in the conventional sense, ...), and it's easy to explain why Excel does not generally use zebra stripes as a default. In a way, it optionally even sort of does use zebra stripes when rows or columns are selected.

License under CC-BY-SA with attribution


Content dated before 7/24/2021 11:53 AM

Tags used