Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I have a little problem, responsive design and tables with only 3-4 columns, so the tables can't be 100% of the width, because that would result in way too much white space between the columns and pretty bad readability. So we've centered and gave them a max-width.

Now here's what I'm not sure about, what's more readable/easier to orient/navigate in

1) this

enter image description here

2) or this

enter image description here

share|improve this question
    
Um? Both are there..for me anyway i.stack.imgur.com/voSxu.png and i.stack.imgur.com/KlS6e.png .. tried on a different connection with a different browser and they work as well, gotta be a problem on your side. –  foxx Jul 30 '13 at 8:46

3 Answers 3

The first one.

Compare the eye movement between the 2 of them. This is just based on my opinion. Hope it's useful to you. =)

enter image description here enter image description here

share|improve this answer
    
Well this means that those headings should be aligned with the table, but what about the background and borders, stretched or not? –  foxx Jul 30 '13 at 9:05
1  
Hi Foxx, the non-stretched are much preferred as it make the screen not as cluttered and more neat. Keep it simple and minimal. Cheers. –  SimonTeo Jul 30 '13 at 9:08

Maybe I'm a bit different, but second option looks more consistent to me. Anyway, there is another problem. Why do you have such a big difference in the font size?

enter image description here

Table is barely readable. Try to fix this problem and you'll probably get the answer to your initial question.

And yes, second is better, because it looks and feels solid. The first one is a bit broken and looks like a funnel.

enter image description here

Update

I would say: fix alignment/font and you'll get better result.

enter image description here

share|improve this answer
    
Thanks for your insight, font size difference aside, you prefer the second one including the title on the left? Or the mix of the two(bg strechted, title aligned), would be better? –  foxx Jul 30 '13 at 9:19
    
Regarding font size: if you have extra space, why can't you use bigger font in order to enhance readability? –  Renat Gilmanov Jul 30 '13 at 9:21
    
That would be question for the designers, we actually had a bigger font size(16px) and it felt way too big so we decreased it to 13, but yeah, maybe something between would be better. –  foxx Jul 30 '13 at 9:23
1  
Ok, I see. Answering your first question: I've described my general impression. Titles will require some attention (I will update the answer in several sec.) –  Renat Gilmanov Jul 30 '13 at 9:35
    
Because that is a title, and titles are bigger. –  Jop Vernooij Jul 31 '13 at 20:51

Pay attention to the interaction on tablets. Full width folding bars (Grafika, Analyze) could be accessible with left thumb, see red areas of gesture interaction. So if you suppose your users will have intensive interaction, this solution could be good.
enter image description here

Otherwise I'd choose first option, based on my visual perception.

share|improve this answer
    
true but given the resolution on tables, headings(grafika, analyza) would on tablets align with the table anyway –  foxx Jul 30 '13 at 12:21

Your Answer

 
discard

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.