Skip to content
Go back

How deep can a simple website screenshot/video tool go?

更新于:

In August I built a small tool that can take screenshots or scrolling video recordings of any publicly accessible website.

At first, my idea was very simple—just grab a screenshot. But as I explored more, I realized this could be much deeper.


Website Screenshots

How to capture clean, full, and useful screenshots? Here are some of the factors I considered:

  1. Support for different device resolutions (desktop, tablet, mobile).
  2. Option to capture only the visible viewport or the entire page (“Full Size”).
  3. Output formats: JPEG/PNG are enough for most cases, but for long articles or reference content, I added PDF export.
  4. Capture timing: too early and you’ll catch a loading state. I added options to wait for load, network idle, plus a custom Capture Delay parameter.
  5. Ads: nobody wants them in their screenshots, so I added a Block Ads option.
  6. Cookie consent & GDPR banners: common on European sites, so I added Block Cookies & GDPR Banners.

Screenshot interface:

Image

Website Scrolling Video Recording

The second feature is recording scrolling videos of websites. Many options overlap with screenshots (resolution, Block Ads, Block Cookies/GDPR, Initial Delay), but video requires extra care:

  1. Recording usually starts as soon as the page loads, so the video includes the loading phase. I trim this initial part later.
  2. Smooth scrolling requires pacing. I added Scroll Distance (how far to scroll each step) and Scroll Delay (pause between scrolls).
  3. Output formats: raw recording is WEBM, but I also support MP4 (more universal) and GIF (great for social sharing, e.g. on Twitter). Processing (trimming + conversion) is handled with ffmpeg.

Video interface:

Image

Here’s an example (default settings) recording Stripe’s homepage (~4MB): https://github.com/user-attachments/assets/8ab22ba0-23cd-42ac-a2be-67f1927fb7be


What’s Next

There’s still lots to explore, such as:


💡 Try it out and let me know what you think:


分享这篇文章:

下一篇文章
我做了一个给网站截图或录制滚屏视频的在线小工具