How to Display Large Data Tables on Small Screens

The best responsive table design

UX Movement
5 min readOct 5, 2022

There’s no better way to display lots of data than to use a table. Viewing tables on desktop screens is easy but difficult when viewing them on mobile screens. A data table expands horizontally and can’t fit in such a confined space.

What’s the best way to display a large data table on small mobile screens? Many designers struggle with solving this problem. They’ve proposed potential solutions, but none offer an optimal user experience. To answer this question, you have to understand the purpose of tables and their information structure.

Carousel Columns

Tables are useful because they allow users to compare different data values. The main data they want to compare is the first column, the key identifier value. The rest of the columns are the attribute values that describe the key ID values.

This means that the key ID values should always stay locked in place so users can always see it. Users won’t have a reference point when viewing other values without the key ID. However, the attribute values don’t have to stay visible.

--

--

UX Movement

There’s a good and bad way to design user interfaces. Our publication shows you which way gives the best user experience. https://uxmovement.substack.com