How to Track Web Page Changes with Automated Screenshots

CaptureKit Team·
How to Track Web Page Changes with Automated Screenshots

Learn how to track web page changes using automated screenshots to monitor updates, detect visual differences, and stay informed about website modifications.

There are many ways to track changes on web pages. This can be useful for SEO monitoring, price tracking, or even keeping an eye on what competitors are doing, such as updates to product pages, landing pages, or job listings.

One practical way to monitor these changes is by capturing screenshots of a webpage at regular intervals and comparing them over time. By analysing differences between screenshots, it becomes easier to spot visual updates that may not always be obvious from the HTML alone.

In this guide, we will look at how webpage change tracking can be implemented using Python and a few helpful libraries. We will capture automated screenshots and compare them to detect visual differences between different versions of a page.

Why companies track webpages at scale using automated screenshot

Capturing screenshots of web pages helps companies understand what is changing on websites over time. Instead of relying only on HTML changes, screenshots allow teams to see the page exactly as users see it. Many B2B companies use automated screenshots to monitor websites, track updates, and analyse visual changes.

Some common use cases include:

1. Visual regression testing
Development teams capture screenshots during automated tests and compare them with a baseline version. This helps detect unintended visual changes in the user interface after code updates.

2. Cross browser testing
Teams verify how a website appears across different browsers and devices by capturing screenshots in multiple environments.

3. Content archiving
Companies preserve the state of a webpage at a specific moment in time. This is useful for historical reference, compliance, or documentation.

4. Competitor monitoring
Marketing and product teams capture screenshots of competitor websites to track updates in design, messaging, product launches, or pricing strategies.

5. Campaign monitoring
Marketing teams monitor how banners, offers, or promotional sections appear on a website during campaigns. Screenshots help ensure that promotions are displayed correctly.

6. Performance benchmarking
Teams observe how a webpage renders under different network speeds or server conditions to understand how performance affects the visual experience.

7. Price monitoring for ecommerce
Businesses track product pages to see when competitors change prices, update discounts, or modify product listings.

8. SEO and content change monitoring
SEO teams capture regular snapshots of landing pages to detect changes in page layout, content blocks, or internal linking.

9. Job posting and hiring activity tracking
Some companies monitor competitor career pages to understand hiring trends, new roles, or department expansion.

Knowing how to detect visual changes automatically becomes essential for many of these scenarios. 

In the next sections, we will look at how this can be implemented by capturing and comparing screenshots of the same webpage over time.

Setup

Before we start tracking changes on web pages, we need to prepare our working environment and install a few required tools.

In this guide, we will use Python along with a browser automation library to capture screenshots of a webpage programmatically.

Capturing Screenshots

To capture webpage screenshots programmatically, we will use Playwright. It is a browser automation library that allows developers to control real browsers through code. Tools like Puppeteer and Selenium offer similar functionality, but Playwright has become popular among developers working on scraping and browser automation tasks.

Playwright supports multiple programming languages, including Python, JavaScript, Java, and .NET. In this guide, we will use the Python version.

First, make sure Python is installed on your system. If it is not installed, you can download it from the official Python website.

Next, install Playwright using Python's package manager pip. Run the following command in your terminal:

pip install playwright

After installing the package, you also need to install the browser drivers that Playwright will use. In this example, we will install the Chromium browser driver.

Run the following command:

playwright install chromium

You can also install other supported browsers such as Firefox or WebKit depending on your needs.

Playwright will allow us to automate the browser and capture screenshots of web pages. In the next step, we will set up an image processing library that will help us compare screenshots and detect visual changes between different versions of a webpage.

Comparing Screenshots

After capturing screenshots of a webpage, the next step is to compare them to detect visual changes. For this, we will use ImageMagick along with its Python binding called Wand.

ImageMagick is a free and open source software suite used for creating, editing, and manipulating digital images. It supports many image processing operations such as resizing, cropping, format conversion, and image comparison.

Installing Wand

To install Wand using Python's package manager pip, run the following command in your terminal:

pip install wand

Since Wand is only a Python binding, you must also install ImageMagick on your system.

ImageMagick installation depends on your operating system:

Debian or Ubuntu
Fedora or CentOS
Mac
Windows

Once ImageMagick is installed, Wand will be able to use its image processing capabilities from Python.

Verifying the Installation

To confirm that Wand is working correctly, you can run a simple script that resizes an image.

from wand.image import Image

# Open an existing image
with Image(filename='input.jpg') as img:

    # Print the original size
    print(f"Original size: {img.size}")

    # Resize the image
    img.resize(200, 200)

    # Print the new size
    print(f"Resized size: {img.size}")

    # Save the image
    img.save(filename='output.jpg')

This script loads an image, prints its original size, resizes it, and saves the modified version.

Beyond resizing images, Wand together with ImageMagick provides many useful image processing features. In our case, we will use it to compare two screenshots and identify visual differences between them.

Automating Screenshot Capturing

Capturing screenshots once is useful, but monitoring webpage changes requires capturing them repeatedly over time. To automate this process, we can use the Python library called schedule.

The schedule library allows us to run Python functions at regular intervals with a simple syntax. This makes it useful for tasks like periodic screenshot capturing.

Installing Schedule

Install the library using pip:

pip install schedule

Example Scheduling Script

The following example runs a function every ten seconds.

import schedule
import time

def job():
    print("capturing screenshot")

# every 10 seconds
schedule.every(10).seconds.do(job)

# run an endless loop checking for tasks
while True:
    schedule.run_pending()
    time.sleep(1)

With this setup, we can run screenshot capturing tasks automatically at fixed intervals. This allows us to continuously monitor a webpage and store screenshots for later comparison.

Now that all the required tools are installed and configured, we can start building the screenshot capturing script using Playwright.

Capturing Screenshots Using Playwright

Most browser automation tools support capturing webpage screenshots. In this guide, we will use Playwright to demonstrate how screenshots can be captured programmatically.

If you are more familiar with tools like Selenium or Puppeteer, the overall approach is very similar. All these tools allow developers to automate browsers and interact with webpages through code.

Playwright runs in headless mode by default. This means it launches a browser instance without opening a visible browser window.

A headless browser runs without graphical interface elements, which allows it to operate faster and makes it suitable for automation tasks such as scraping, testing, and screenshot capturing.

To capture a screenshot of a webpage using Playwright, we can use the page.screenshot() method.

from pathlib import Path
from playwright.sync_api import sync_playwright

def get_screenshot(url, path):
    with sync_playwright() as p:
        browser = p.chromium.launch()
        context = browser.new_context()
        page = context.new_page()

        # request target web page
        page.goto(url)

        # screenshot as bytes
        image_bytes = page.screenshot()
        Path(path).write_bytes(image_bytes)

# example usage
get_screenshot("https://web-scraping.dev", "./screenshot.png")

In this example, we created a small function that performs the following steps:

• launches a Chromium browser controlled by Playwright
• opens a new browser tab
• navigates to the target webpage
• captures a screenshot of the page
• saves the screenshot to a file

Now we can use the same function to capture screenshots of different pages. For example, we can take screenshots of two product variants from the demo site.

get_screenshot("https://web-scraping.dev/product/1?variant=orange-small", "product-1.png")

At this point, the screenshot will be saved locally. In the next step, we will compare screenshots to detect visual differences between them.

  Changes on the webpage automatically.

Next, we capture a second screenshot from another product variant on the same page.

get_screenshot("https://web-scraping.dev/product/1/?variant=cherry-small", "product-2.png")

Now we have two screenshots saved locally.

product-1.png
product-2.png

Both images represent the same product page, but with different variants selected. In the next step, we will compare these two screenshots to identify visual differences between them.

This comparison will allow us to detect changes on the webpage automatically.

Comparing Screenshots

Now that we have captured two screenshots, the next step is to compare them and detect visual differences.

To do this, we first load the screenshot files using the Image constructor provided by Wand.

Wand provides a .compare() method on the Image object which allows us to compare two images directly. This method compares the images and returns two results.

• a reconstructed image that highlights the differences
• a numerical value that represents how different the two images are

The reconstructed image marks the visual differences, which are usually highlighted in red.

Below is a simple function that compares two screenshots and saves the resulting difference image.

from wand.image import Image

def compare_images(image1, image2, diff_image):

    # Open the two images you want to compare
    with Image(filename=image1) as img1, Image(filename=image2) as img2:

        # Compare the images
        diff = img1.compare(img2, metric="root_mean_square")

        # The result contains the difference image and the computed difference value
        diff_image, diff_value = diff

        print(f"The difference between the images is: {diff_value}")

        diff_image.save(filename=diff_image)

        return (diff_image, diff_value)

compare_images("product-1.png", "product-2.png", "difference.png")

This script loads the two screenshots we captured earlier and compares them using the root mean square metric. The resulting image highlights the visual differences between the two pages.

When we run the script, it produces a difference image similar to the one shown below.

 Produces a difference image similar

Now we need to automate this process, so we get reports on what has been changed in a webpage programmatically. 

Automating Screenshot Capturing

We can automate the workflow in Python using the schedule library.

With scheduling, the script can run at regular intervals such as every hour or once a day. Each time it runs, it captures a new screenshot, compares it with the previous screenshot, and checks whether any visual changes occurred.

If a difference is detected, the script can trigger a notification.

Sending Notifications

When a visual change is detected, it is useful to receive an alert. This can be done by integrating an email service or messaging API into the script. Some commonly used services include email providers, Slack, or notification APIs such as Twilio or SendGrid.

Below is a simple example that sends an email when a change is detected.

import smtplib
from wand.image import Image

def compare_images(image1, image2, diff_image):

    # Open the two images you want to compare
    with Image(filename=image1) as img1, Image(filename=image2) as img2:

        # Compare the images
        diff = img1.compare(img2, metric="root_mean_square")

        # The result contains the difference image and the computed difference value
        diff_image, diff_value = diff

        print(f"The difference between the images is: {diff_value}")

        diff_image.save(filename=diff_image)

        return (diff_image, diff_value)

compare_images("product-1.png", "product-2.png", "difference.png")

This function creates a simple email message and sends it whenever the script detects changes between screenshots.

Scheduling the Monitoring Process

Now that we have functions to capture screenshots, compare them, and send notifications, we can schedule the entire workflow to run automatically.

The example below runs the monitoring job once every day.

import schedule
import time

def job():
    get_screenshot("https://example.com", "new-screenshot.png")

    diff_image, diff_value = compare_images(
        "new-screenshot.png",
        "old-screenshot.png",
        "diff-screenshot.png"
    )

    if diff_value > 0:
        send_change_email(diff_image)
    else:
        print("No change detected")

schedule.every().day.do(job)

while True:
    schedule.run_pending()
    time.sleep(1)

With this script running in the background, the webpage will be checked automatically every day. A new screenshot will be captured, compared with the previous version, and an email notification will be sent if a change is detected.

This approach works well for small monitoring projects. However, as the number of pages increases, managing browser automation, storage, and scheduling can become more complex. In such cases, dedicated screenshot automation tools can help simplify the process.

Using CaptureKit Screenshot API To Scale This Process

So far, we built a simple Python workflow using Playwright to capture screenshots and compare them. That works well for learning and small projects, but once you start monitoring many pages, handling browser setup, retries, rendering issues, and scheduling can take extra effort.

This is where CaptureKit can simplify the workflow. Its Screenshot API lets you capture webpages as PNG, JPEG, WebP, or PDF through a browser-like rendering layer, without managing your own headless browser setup. The endpoint is POST /v1/capture, and each request costs 1 credit.

Capturing screenshots with CaptureKit

To call the API, send a POST request to the CaptureKit endpoint and include your API key in the x-api-key header. The page you want to capture is passed through the url query parameter. The docs show that format defaults to png, while viewport defaults are 1280 by 1024. CaptureKit also supports full page capture, device emulation, delays, selector based waits, cookie banner removal, ad removal, proxy routing, and S3 upload options.

Here is a simple Python example:

import requests

api_url = "https://api.capturekit.dev/v1/capture"

headers = {
    "x-api-key": "YOUR_API_KEY"
}

params = {
    "url": "https://web-scraping.dev/product/1?variant=cherry-small",
    "format": "png",
    "viewport_width": 1280,
    "viewport_height": 1024,
    "full_page": "false"
}

response = requests.post(api_url, headers=headers, params=params)

response.raise_for_status()

with open("capturekit-screenshot.png", "wb") as f:
    f.write(response.content)

print("Screenshot saved successfully")

This keeps the screenshot flow much simpler because you do not need to manage Playwright locally just to capture a page image.

A more practical example for monitoring

For webpage monitoring, you may want a cleaner screenshot and more stable capture conditions. CaptureKit supports parameters that help with this, including remove_cookie_banners, remove_ads, wait_until, wait_for_selector, and delay. It also supports full_page screenshots and full_page_scroll to load lazy content before capture.

import requests

api_url = "https://api.capturekit.dev/v1/capture"

headers = {
    "x-api-key": "YOUR_API_KEY"
}

params = {
    "url": "https://example.com",
    "format": "png",
    "full_page": "true",
    "full_page_scroll": "true",
    "full_page_scroll_duration": 800,
    "viewport_width": 1440,
    "viewport_height": 1200,
    "remove_cookie_banners": "true",
    "remove_ads": "true",
    "wait_until": "networkidle2",
    "delay": 2
}

response = requests.post(api_url, headers=headers, params=params)
response.raise_for_status()

with open("monitored-page.png", "wb") as f:
    f.write(response.content)

print("Monitoring screenshot captured")

This kind of setup is useful when you want more consistent screenshots before running image comparisons.

Helpful options for advanced use cases

CaptureKit also supports capturing a specific element using selector, blocking resources with block_resources, blocking request patterns with block_urls, and routing requests through HTTP, HTTPS, or SOCKS5 proxies using the proxy parameter. For teams that want direct cloud storage, the docs also list S3 related options such as s3_bucket, s3_object_key, s3_region, and s3_url.

Useful for no code and low code workflows

Because CaptureKit works through a standard HTTP request, it fits nicely into no code and low code tools. You can plug it into Zapier, Make, or n8n to run screenshot captures on a schedule, store outputs in Google Drive or S3, and send alerts through Slack or email.

A few practical workflows could be:

• capture competitor pages every day and save screenshots to cloud storage
• monitor product pages and notify your team when visual changes appear
• create weekly screenshot archives for reports, QA, or client updates
• trigger screenshot captures from Claude Code or other coding agents as part of a larger monitoring script

This makes the API useful not only for developers, but also for operations teams, marketers, QA teams, and no code builders.

Why this is easier to scale

Once you move from a few pages to dozens or hundreds, browser automation scripts become harder to maintain. With CaptureKit, you can keep the same screenshot monitoring logic from this guide, but replace local browser capture with an API call. That gives you a cleaner setup for automation and makes it easier to connect screenshot capture with schedulers, storage tools, notifications, and AI workflows.

Additional Resources

  1. 7 Ways To Automate Chrome Screenshots

  2. How To Take Screenshot on MacOS

  3. How to Take Screenshot of All The URLs in a Domain

Ready to get started with CaptureKit?

Start capturing screenshots and extracting content today. Get started for free.

Get Started