Heatmaps

Heatmap devices

Compare desktop, tablet, and mobile heatmaps to understand responsive behavior.

Updated Jun 19, 20262 min read

Why device filters matter

Visitors experience different layouts on desktop, tablet, and mobile. Heatmaps should be reviewed by device so the data matches the layout being displayed.

A desktop heatmap over a mobile layout can be misleading. Always select the device that matches the visitor data you want to inspect.

Desktop heatmaps

Desktop heatmaps are useful for reviewing:

  • large navigation menus
  • hover and pointer movement
  • wide pricing tables
  • multi-column layouts
  • desktop calls to action

Move heatmaps are most useful on desktop because visitors use a pointer.

Tablet heatmaps

Tablet layouts often sit between desktop and mobile. They may use different navigation, spacing, or breakpoints.

Review tablet heatmaps separately when tablet traffic matters or when your design has tablet-specific layouts.

Mobile heatmaps

Mobile heatmaps show taps, scrolling, and attention on smaller screens.

Use mobile heatmaps to check:

  • tap target size
  • sticky buttons
  • mobile menus
  • form fields
  • long-page scroll depth
  • content hidden below the fold

Mobile users often behave differently from desktop users, especially on forms and checkout pages.

Device-specific issues

Common device issues include:

  • calls to action too low on mobile
  • desktop navigation hidden on tablet
  • mobile tap targets too small
  • content order changing by breakpoint
  • sticky headers covering content
  • forms becoming harder to complete on small screens

Device checklist

  • Start with the device that has the most traffic.
  • Compare desktop and mobile before making page changes.
  • Use scroll heatmaps to check mobile content depth.
  • Use friction heatmaps for device-specific frustration.
  • Watch recordings for the device with the issue.