Web AppWeb Design & Development

Shotty Captures Full Page

Every page of a site captured in under two minutes, instead of one screenshot at a time

  • 1-2 hrs
    fifty pages, screenshotted by hand
  • 107 sec
    the same fifty in shotty
  • 7/7
    sections captured on scroll-animated pages, up from 1/7

Challenge

Capturing a site meant opening every page one at a time and screenshotting each by hand. For a fifty-page site that is fifty rounds of the same thing, and it all had to be repeated at every screen size and after every design change.

The harder problem was that the screenshots came out wrong. Sites animate their sections in as you scroll — and many hide them again when you scroll past. A full-page screenshot renders the whole page at once, so most of it came back blank. The capture looked like it had worked; the content simply was not in it.

The interruptions did the same thing in a different way. Every capture starts from a clean browser, so every capture is a first visit: cookie bars, "10% off" popups and consent walls all appear, and a modal locks the page so a full-page shot stops after one screen. A login wall produced fifty pictures of a login form. A country picker meant capturing an empty catalogue that looked perfectly valid.

Solution

One URL, every page. The site's own sitemap and links are followed to find the pages, or they can be listed first and picked from.

Animations are stopped rather than undone. The browser is told, before the page's own code runs, that everything is on screen — so reveal animations play once and never reverse. Un-hiding sections afterwards does not work, because the page simply hides them again.

A page is only photographed once it is genuinely finished: preloaders gone, the layout stopped changing, fonts loaded, every image decoded rather than merely requested.

Interruptions are closed by the page's own button, not hidden with CSS, so the scroll lock and the dimmed backdrop go with them. Nothing that submits or navigates is ever clicked.

Where a person is genuinely needed, the run pauses instead of guessing. A login wall opens a real browser window to sign in — two-step codes included — and closes itself once the session actually works. A country picker does the same, because guessing a region with no stock would produce an empty page that still looks correct. Either choice is made once and reused for the whole site.

Results

Fifty pages captured in 107 seconds, across a full run — the work that used to be fifty separate rounds of opening, waiting and screenshotting.

Scroll-animated pages come back complete. On a page whose sections hide again when scrolled past, one section in seven was being captured; now all seven are.

Cookie bars, consent walls and newsletter popups no longer appear in the images, and the modals that used to cut a full-page capture short no longer do.

Sites behind a login or a country picker can be captured at all — signed into once, or the region chosen once, then applied to every page and every screen size in the run.

Project details

A screenshot tool for whole websites. One URL goes in, and every page of the site

comes back captured, at whatever screen sizes are needed — desktop, laptop, tablet,

phone — in one run.

The work it replaces is not really the screenshotting. It is everything around it:

finding every page, opening each one, waiting long enough for it to actually finish

loading, resizing the window for each device, scrolling a long page and stitching it

together, then doing the same again for the next page and the one after that.

What makes it more than a loop around a screenshot command is knowing when a page is

genuinely ready, and what to do about the things that get in the way — scroll

animations, cookie bars, newsletter popups, sign-in walls, country pickers. Each of

those quietly ruins a capture, and each is handled before the shutter fires.

Gallery

Have a project like this?

Tell us what you're working on — we'll reply within 24 hours.

Start a Project