UX, Conversion & Accessibility

Responsive Data Table

A responsive data table presents rows and columns so that information remains usable on smaller screens.

A responsive data table presents rows and columns so that information remains usable on smaller screens. A cleaning company might show service options, visit frequencies, and included tasks in a comparison table. On a phone, the design may allow horizontal scrolling, reorganize clearly labeled content, or otherwise preserve relationships between headings and values. The table should retain meaningful markup and a sensible reading order for assistive technology. A responsive table differs from an accessible data table: responsiveness addresses available screen space, while accessibility also involves understandable headers, navigation, and semantics. Shrinking text until it becomes unreadable is not a satisfactory responsive solution.