All tables on my app look like sh*t, it's making me lose hair, I've been trying to make them look better but I end up making them look worse, do you have any examples of nice looking tables? preferably with lots of rows and a fair amount of columns.
I've added a couple of collections as comments at the top.
Connie Malamed who Wrote understanding graphics wrote a popular article about designing effective data tables which I helped explain through visualization and examples in my own somewhat lengthy resource on Effective design of data tables. Connie's original article is here.
The points made in both our articles may help you understand how to make your own tables look better rather than worse, by considering what is important to show and not to show. In particular, the Gestalt principles of design and whitespace are key elements of a good looking table.
Here's a summary of the design tips:
- Meet the audience’s expectations
- Order data to match the purpose of the table
- Remove clutter
- Create a visual hierarchy
- Round numbers and avoid questioning
- Perform calculations for the user
- Provide consistent appearance
- Separate figure and ground
- Reduce number of columns
- Make comparison easy
- Group similar data
- Make effective use of the grid
- Highlight the important values
- Provide a brief verbal commentary
- Use the white space
- Use meaningful labels, and manage headings
I highly recommend this article: Designing with white-space: why 1+1=3
Abstracting away his own blog's layout, he has a very good point.