Before and after: how Verploy compares your pages on desktop and mobile

2 min readBy the Verploy team

Every tested page, before and afterMeasurepages beforethe updateUpdateon thetest copyMeasurethe samepages againComparedesktopand mobileDecidelive, held backor your clickChanged only where you expect it? Then nothing stops the update.

A plugin update rarely breaks a site with an error message. Far more often, something just looks wrong: a menu that collapsed, a slider that no longer loads, a checkout button pushed off screen. Those are the problems your client finds before you do. That is why Verploy compares how your pages look, not only whether they load.

Which pages are tested

Verploy picks the pages that matter automatically: the homepage, the pages in your menu and, on a shop, the shop pages. You can add up to five extra pages per site. The login page is tested too, because a broken login is the last thing you want to discover after an update.

Desktop and mobile, per page

Every page is captured before and after the update, on desktop and on mobile, and Verploy calculates how much of the page changed. You see the before and after side by side, with the changed pixels marked.

The same page section after an update, with the changed pixels marked
After the update, changed pixels are marked so you see exactly what moved.

Your threshold, your masks

Every site is different. A news site changes every hour; a brochure site barely changes in a year. That is why the threshold for a visual difference is set per site, and why you can mask parts of a page that change by themselves, such as a rotating banner, a date or a live feed. Up to ten masks per site, set with a CSS selector.

When only the look changed

Sometimes an update is supposed to change the look, for example a new version of your theme. If every other check passes and only the look changed, you see before and after side by side and put it live with one click.

Want to see it on your own sites? Start free on up to 3 sites, no credit card.