1

I had a debate today with a colleague whilst designing the front end for a web application.

Most of the data throughout the application seemed tabular - a collection of records each with their own set of properties (columns).

On one of the pages, however, the data was presented in a tabular format, but each record was editable, with each property of each record containing an 'input' with the respective data for that property, and a 'save changes' button to the right of the record so the user could save the state of that record. The user could edit any field they wanted to. Just like an excel spreadsheet.

He argued that since the data was editable, and not static, that it should be designed with <div></div>. Bear in mind that this set of data was in the very traditional table-like format: a set of records with a set of columns for each property.

I know this is a questions beaten half to death, but am curious as to what the professional opinion is, and if maybe perhaps the context of my situation called for something other than a table.

1

Usability has come a long way and inline editing is almost standard these days so "data being editable" is definitely not a parameter.

The question here is: When should the table layout be used?

Answer - At any point of time, if you have data that can be categorized by/in columns or rows, use tables. They are clean, great for usability and offer great value for real estate on a page/screen.

However, people do have a point about tables having too many borders, lines, colors and distractions.

too often when we create a data table, we imprison our data behind a wall of grid lines.
- Clear Off the Table

Definitely check out the above link. Hope this helps settle the argument

  • A word of warning on "great for usability and great for real estate" qualification of tables: when structuring/ discussing data, the number of columns can quickly get out of hand. And columns are a terrible waste of (horizontal) real estate, especially in today's mobile-dominated world. See also here for "tricks to efficiently display large data sets": ux.stackexchange.com/questions/100786/… – wintvelt Jul 28 '17 at 10:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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