Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Confused with what to use - List vs Table

Tags:

html

I've been browsing for about an hour now regarding what the best practice is for this and the majority of what I read is to use a table for tabular data and a list for lists, which makes sense. However, I'm confused about this type of UI:

enter image description here

So it has columns and rows but its a list of contacts . Can you give your thoughts on what should I use for this type of UI?

(Btw, there's nothing particular in this image, I'm not trying to create exactly this, just needed something to show what I mean)

like image 737
g_b Avatar asked Oct 24 '25 02:10

g_b


1 Answers

A table is appropriate here, since you have semantically meaningful columns as well as rows. HTML tables will automatically handle column alignment (and also provide a <th> tag for the table header), and tables will preserve the column information even for users using screen readers, text-only browsers, etc. (which lists won't).

You would want to use lists for e.g. the sidebar, tags, or items in the "Edit Contact" dropdown.

like image 198
Ollin Boer Bohan Avatar answered Oct 25 '25 17:10

Ollin Boer Bohan