Take the 2-minute tour ×

I have a table that lists various attributes of an individuals personal development plan; objective, time to complete objective, comments etc. The table is editable so the user can directly add comments without having to go to an intermediate form. The problem is that the client wants to add more columns and this is messing up the visual display.

The alternatives I have are:

  1. allowing columns to expand out on click
  2. keeping essential attributes in table, rest in 'advanced edit option form' or somesuch
  3. I don't know - have you any ideas?

One more thing to add: I think the addition of extra columns is based on user feedback ...

edit: here is what I have gone for table with expandable columns

share|improve this question
Is horizontal scrolling out of the question? –  Steve Jun 1 '11 at 11:31
I'm wary of horizontal scrolling because it hides columns... –  colmcq Jun 1 '11 at 11:46

4 Answers 4

up vote 3 down vote accepted
  1. ...
  2. ...

  3. Put the table in a pane and allow the users to scroll horizontally to access additional columns. Be sure the column(s) that identifies the content of each row does not scroll away (i.e., acts a row “headers”) so user can keep track of what they’re look at.

  4. (More convenient version of your Option 2). Provide a separate “overflow” pane below the table for certain fields in a form-like layout. These may be the less important fields or fields that aren’t compared between rows or extra-large fields that are pain to show in a table. When the user clicks in a row in the table, the overflow automatically repopulates with the attribute values of the selected row. Bonus points for providing a control to hide or show the overflow pane, where hiding it expands the table to show more rows.

  5. Break your users into groups or roles and show each only fields they need for their roles. In other words, maybe the users who want additional fields don’t need all the fields you’re showing now, so you can replace some.

  6. Provide the users the ability to pick and arrange the fields they want to display. This may be combined with Option 3. You can provide default field sets to different user groups, thus also rolling in Option 5. Allow them to resize the width of their columns, taking a little of Option 1 too. Preserve all changes between sessions.

Note on your Option 2: This is attractive if you’re really sure these fields are of little value to the users despite the user feedback (e.g., it’s really the result of one influential stakeholder who doesn’t actually use the product very much). You may want to dig deeper and find out why the users want these fields. Maybe there is an alternative solution (e.g., a notification or an aggregate field) that will fulfill their needs better.

share|improve this answer

Is there an option to group some of the columns into a single column? For example, instead of:

Name, Age, Job

you would have a single column:

User details
Name: Joe Bloggs
Age: 27
Job: Engineer

share|improve this answer
I've proposed that with a comments column: they have three classes of comment so I've suggested they just reduce to one. Still too little room though... –  colmcq Jun 1 '11 at 11:16

There are some great suggestions here:

How To Display Too Much Data

share|improve this answer
One of the tricks that might work well for you is making your rows columns and having, say, 5 columns across the page. –  James Crook Jun 1 '11 at 12:49
this would work was it not for the fact that some of the cells will contain a lot of text.... –  colmcq Jun 1 '11 at 13:54

I have recently worked on a project which required to display a lot of information in a tabular format with large number of columns. We followed the following approach -

  • Horizontal scroll is inevitable.
  • You have to use it when dealing with lots of columns.
  • The thing which you can do is maximize the number of columns visible to the user at once.
  • Sometimes only the table headers take up more space and the actual values take up very little of it.
  • So you can use acronyms as a substitute for such large headers and reduce column width.
share|improve this answer

Your Answer


