How to take screenshots of a list of URLs

Question

I need to save thumbnail-sized screenshots of about 20 intranet pages and repeat every week.

I ruled out using an online service because the screenshots are business information.

I ruled out installing an application because my office uses both Windows and Mac OS. I didn't want to rely on an application some of us can't install.

I couldn't find a Chrome extension that accepts a list of URLs. I only found extensions that save a screenshot of one open page, not a batch.

Are there other ways?

Solution 1

Are there other ways?

You may want to consider using Chrome in --headless (GUI-less) mode (available since version 59+). Firefox has had a similar feature since version 56+.

Combined with the --headless option in Chrome (or -headless in Firefox), you can use the --screenshot option (since Firefox 57) to take screenshots of a website from the command line. These features should be supported on both Windows and MacOS, assuming you are using the current versions of each browser.

Chrome on Windows

As an example of using Chrome on Windows to capture a web page, you could use the following command to take a screenshot of e.g. http://example.com:

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --headless --disable-gpu --enable-logging --screenshot="C:\path\to\screenshot.png" http://example.com/

Chrome on MacOS

Likewise, you should be able to use a similar command with Chrome on MacOS:

chrome --headless --disable-gpu --enable-logging --screenshot http://example.com/

Note that simply using chrome (above) seems to generally rely on having an appropriate alias e.g.:

alias chrome="/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome"

Additional Options

• --print-to-pdf — creates a .pdf version of a web page e.g. --print-to-pdf="C:\path\to\output.pdf"

• --window-size — specify an exact window size to render for screenshots, etc. e.g. --window-size=1366,768

• --hide-scrollbars — removes any scroll bars that might otherwise be rendered in a screenshot, etc. (due to a small viewport).

An updated list of additional switches is available here.

Headless Chrome Pitfalls

• On Windows, Chrome seems extremely picky regarding paths. To avoid odd behaviors (or outright failures), make sure to always specify a full path + file name. This applies to --screenshot and --print-to-pdf particularly, but even putting Chrome in your Windows PATH/Path and simply using chrome (ala MacOS) could lead to issues (especially in batch files).

• Individual pages take individual times to render. For example, a screenshot of https://example.com was created nearly instantaneously on a test system, whereas https://superuser.com consistently took around thirty seconds or longer to render.

• Using --screenshot without --headless could cause issues with capturing multiple screenshots.

• Screenshots are captured as .png files, regardless of image extension (i.e. no .jpg files).

• If there is content you wish to capture that isn't being captured, try adjusting the --window-size option. Note, however, that capturing "full" (scrolling) web pages may be problematic (at least in theory), so you may have to dig into more complex solutions later, depending upon circumstances.

• Capturing screenshots works best with more "traditional" web pages. Web applications may produce undesirable results.

I couldn't find a Chrome extension that accepts a list of URLs. I only found extensions that save a screenshot of one open page, not a batch.

Unfortunately, using --headless mode and --screenshot doesn't allow you to directly specify multiple URLs to capture (as far as I am aware). You will probably need to create a script of some kind to accomplish this goal.

For instance, as brute force method in Windows, you could simply save variations of the appropriate command in a batch (.bat) file e.g.:

ECHO off

REM A batch file to automate downloading website screenshots

ECHO on

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --headless --disable-gpu --enable-logging --screenshot="C:\path\to\screenshot1.png" http://website1.com/

REM More commands here [...]

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --headless --disable-gpu --enable-logging --screenshot="C:\path\to\screenshot20.png" http://website20.com/

A similar approach using shell scripting would likely work in MacOS as well.

Of course, you can make a script that actually reads a list of URLs (say from a text file) with e.g. batch (Windows), Powershell (Windows), shell scripting (MacOS), Python (Windows and MacOS) or any other options available.

I need to save thumbnail-sized screenshots of about 20 intranet pages [...] I ruled out installing an application because my office uses both Windows and Mac OS. I didn't want to rely on an application some of us can't install.

I don't think that you will be able to get around a third-party application for this step. Again, --headless mode with --screenshot doesn't support actually resizing images (just the viewport i.e. window size). Furthermore, Windows doesn't come with a built-in tool to resize images (outside of MS Paint).

As a recommendation, ImageMagick might be worth looking into as it supports both Windows and MacOS. Once installed, you could simply use e.g.:

magick screenshot1.png -resize 50% thumbnail-screenshot1.png

to resize an image (although there are many more potential options available).

Note that the command above is for current versions of ImageMagick 7.x+. For legacy versions of ImageMagick, you will likely want to use convert in place of magick i.e.:

convert screenshot1.png -resize 50% thumbnail-screenshot1.png

You could make these (or any similar commands) part of the script that captured the screenshots themselves or part of a separate post-processing script.

Solution 2

Also looked for such soft, in the end wrote the script myself https://github.com/rytsikau/eeScreen

Comments

[scenography]

Running Chrome from the command line! I didn't know about that. I can use that solution. ImageMagick will help me too.

[bertieb]

Welcome to Super User! Whilst this may theoretically answer the question, it would be preferable to edit your post to include your script in your answer. Thanks!