0

Im designing a data table in which one of the columns has the potential to hold a lot of information in each cell. Here's a screenshot from the live app as it exists today: enter image description here The column with red outlines called "Access Level" has the potential to hold all of the agencies a user has access to, and that can quickly become a lot. We didn't anticipate this many items being in cells in that column, and since we didn't plan for it, it looks like the above, i.e. terrible.

Here are a couple things I've tried to solve the issue & make the column more scannable.

1.) Separate each agency name with a bullet point enter image description here

2.) Break the line at each agency name: enter image description here

3.) Break the line at each agency name & create pagination within each table cell with more than 2 agencies via "Show More" link: enter image description here

I'm sure there are solutions I haven't thought of as well. If you know which of these options is best or have a better solution, please let me know!

1

1 Answer 1

1

You should ask yourself what are they going to do with this data. In general a table is not a very convenient way to store data - a form with a custom-made layout is usually a better option. Data tables are useful for working with this data - comparing it across rows, sorting, filtering, bulk-editing etc. When a cell holds a lot of information usually it's a good indication that none of these use-cases apply, since you can't really do any of them on large chunks of text.

This in turn would mean that you don't really have to place all of this directly in the table cell itself, and you can consider aggregating this data. For example, you could say "10 agencies" with a hyperlink formatting, and then display the list on hover. Or you can show the first 3 or so items, and then say "7 more". Or you could have a sidebar showing this info on the selected item. I would examine whether this data really needs to be at the user's immediate field of view.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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