Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Mobile UI for large data tables

Featured Replies

I've been working on a client control panel which involves a lot of data relating to customer reports. The majority (80%) of their users are desktop-based, so this was the priority for my client. The challenge I faced was displaying as much of this data as possible, on smaller devices.

After discussing this obstacle with the client, I went down the path of allowing side scroll on smaller devices, for these tables. My justification was based on analytical data, showing mobile users are existing customers, most likely making changes on the go. Therefore, these users would know their way about the control panel and want to see the level of data that's visible on desktop.

What format do you use for data tables in mobile UI,  and why?

It's hard to say without seeing an example of what type of data you want to see. Sideways scrolling is definitely the easy thing to do. Depending on how much data you are displaying you may need to build a special interface just for mobile. Maybe the ability to toggle columns on/off. Then tapping on a record can open all of the details for that record in a modal. 

19 hours ago, StrangerPings said:

What format do you use for data tables in mobile UI,  and why?

It depends on the data type.

I do a lot of comparison tables for clients and the preferred method is to stack the data on mobiles. Sideways scrolling is easy to do but the UI/UX isn't good.

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.