User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

Currently, I am working on a mobile web application which displays all substitutions for each class in my school. To make this substitution list (varying between 5 to 60 entries) easier to parse, I group the substitutions for each class and display the entire list in a table. The rows for each grouped class share the same color. This currently looks like this:

Current Approach

But I think, there's a problem: The color shading does indeed distinct the classes from each other. However, this does not make reading/scanning the rows easier. This is as hard as it was before. So this approach only accomplishes one goal.

My question is: How do I achieve both of my goals? Grouping the rows of the same class as well as making the scanning of each individual row easier.

share|improve this question
up vote 6 down vote accepted

How about alternating the colours, and grouping with solid lines instead?

enter image description here

share|improve this answer
+1 It seems I have the same idea ). – Alexey Kolchenko Oct 7 '13 at 14:09

You could try the following idea.
enter image description here

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.