The page map: a section heatmap of your Shopify homepage
The page map is Store Decode’s section heatmap for your Shopify homepage. It draws the page as a column of blocks, one per section, in the order visitors meet them, inside a phone or desktop frame. Each block is coloured and labelled with one number, so you can see at a glance which sections visitors view, click, click in vain or buy after.
Type it in Find
- What on the homepage does almost nobody see?
- Mobile vs desktop on the homepage
- Which homepage sections are working well?
Type it in Find on Home or Explore and Store Decode opens the view with your numbers.
How it differs from a click or scroll heatmap is set out on Shopify heatmaps.
What it tells you
Section titled “What it tells you”A click heatmap paints dots where pointers landed on one picture of a page. The page map works per section instead: every block carries its own numbers, measured on each visitor’s own screen. You pick what the colour shows under Colour the page by:
- Views (orange): of the sessions that had the section on the page, the share that saw at least half of it. A section taller than the screen counts when it filled at least half the screen. The legend runs from Few to All.
- Clicks per 100 views (blue): clicks anywhere in the section for every 100 sessions that viewed it. Few to Most.
- Dead clicks (red): clicks in the section that did not land on a link, button or other control. None to Most.
- Orders after a click (green): orders whose last product click within 7 days was in the section, always labelled “last click, 7 days”. None to Most.
Orders after a click says where the last click was, not why the order happened. The glossary has every term on the map in one line each.
Where to find it
Section titled “Where to find it”The full map is on the Homepage tab of Explore. Pick Mobile, Desktop or All devices in the card’s header; Desktop includes tablets.
Home shows a smaller version in the card Your homepage, section by section. It draws the first screen on a phone and on a desktop side by side. Beside them it lists up to seven of your sections with a bar for each device, and Open your page map → opens the full map.
Reading the map
Section titled “Reading the map”The map’s own guide sums it up: each block is one section of your homepage, in the order visitors meet it, and darker means more. Block heights follow where each section started on visitors’ screens, so a tall hero is drawn tall. Sections below the frame are drawn shorter so the whole page fits, and the legend says so. The drawing never changes a number.
Each block’s label gives its position and name, then its value and its signal, if any. Select a block, or move to it with the keyboard, and the panel beside the map shows all of that section’s numbers. The previous period appears beside them when both periods have 50 sessions of the section’s own.
The first-screen line
Section titled “The first-screen line”On Mobile and on Desktop a dashed line, labelled Typical first screen ends, marks where the first screen ended for most visitors. It sits after the last section that started on the first screen in at least half of its views. Beside it is the share of sessions that did not view the next section, such as “9% didn’t view Shop by category”. The frame is drawn at the most common screen size among your visitors on that device. What a phone shows first covers the line in depth.
The line needs 50 homepage page views with section positions on that device; until then the map says when it will appear. On All devices there is no line, because the first screen depends on the screen.
Counts before percentages
Section titled “Counts before percentages”A block prints a percentage only when the device has 300 homepage sessions in the window and the section itself was on the page in 300 of them. Below that it prints the count over its base, its fill is fainter, and the clicks colouring counts clicks instead of a rate. A section added or moved during the window counts from the first day it held its place, tagged with that day.
Signals on the blocks
Section titled “Signals on the blocks”A block may carry one signal, a short label worked out from its own numbers: Working well, Phones skip it, Dead clicks, Seen, not clicked or Rarely seen. No section gets a signal before 300 sessions had it on the page. The exact rule behind each one is at the end of this page.
In the sample store
Section titled “In the sample store”The sample store, Tidewell Home, is invented. On its mobile map (Mobile · 7 days · n=4,100) the first screen ends after the Hero slideshow, which is 760 px tall on phones and was seen in 3,772 of the 4,100 sessions. The next section, Shop by category, was seen in 3,731, so the line reads “9% didn’t view Shop by category”. Shop by category gets 0.2 clicks per 100 views and carries Seen, not clicked.
The Why Tidewell section has 231 dead clicks out of 231 clicks in the same week: every click there landed on something that is not a link, button or other control. The sample shows one section for each of three signals.
Try this
Section titled “Try this”- Colour the map by Dead clicks and select the darkest block to see what visitors click there.
- Switch between Mobile and Desktop with Views on to see where the first-screen line falls on each.
Common questions
Section titled “Common questions”Does the page map cover collection and product pages?
Section titled “Does the page map cover collection and product pages?”No. The map and its signals are your homepage’s. Your collection pages, product pages and cart have their own tabs in Explore, with numbers for filters, product cards, the reviews and the cart.
How much traffic does the map need?
Section titled “How much traffic does the map need?”It draws from the first homepage session, with counts. Percentages, the colour scale and signals come once a section has been on the page in 300 sessions on a device. Until then you see how many sessions have arrived and what appears at 300.
Can I watch session recordings on it?
Section titled “Can I watch session recordings on it?”No. Store Decode keeps no replay of a visit: each section has its own numbers instead, and those are what the map colours. What Store Decode collects lists every field.
What do the colours mean?
Section titled “What do the colours mean?”Each metric has its own colour, and darker means more of it: more of the sessions viewed the section, more clicks per 100 views, more dead clicks or more orders after a click. A faint block is one still collecting.
The exact rules for the signals
Section titled “The exact rules for the signals”- Working well: among the top 3 sections for clicks per 100 views (at least 2) or for orders after a last click (at least 3), seen by at least 100 sessions. The header, footer and announcement bar are not ranked.
- Phones skip it: Views on desktop at least 35 points above Views on mobile, both devices with 300 or more sessions with the section on the page.
- Dead clicks: 50 or more dead clicks.
- Seen, not clicked: Views over 90% with under 1.5 clicks per 100 views, in a section with a link, button or form field.
- Rarely seen: Views under 35%.
How each number is built is on how Store Decode measures, and Views in detail on scroll depth, section by section.
See the page map on your own store.
Install free →Something missing or wrong? Tell us through Support.