Taking Screenshots in Chrome

What a screenshot is, hopefully, doesn’t need explaining. There are many ways and tools for taking website screenshots in Chrome, but we’ll focus on three very different ones. Each of the methods described below implies that you can take a screenshot of either a visible part or the entire page of a website. You just have to choose the one that suits you best.

An example of screenshot creating in Chrome Command menu

How to Take a Screenshot

Developer Tools

Not the most convenient way, but available in Chrome “out of the box”.

  1. Open “Developer tools” using one of the three methods:
    • F12 or Ctrl+Shift+I
    • menu → “More tools” → “Developer tools”
  2. To launch the “Command menu”, use:
    • the combination Ctrl+Shift+P
    • the Developer Tools menu button in the top right → “Run command”
  3. In the search box, type “screenshot”, where you will have access to 4 options for capturing a page:
    • Capture area screenshot – use the cursor to select a rectangular screen area
    • Capture full size screenshot – captures an entire length of the page
    • Capture node screenshot – in the “Elements” tab, you can select any part of a page to capture
    • Capture screenshot – captures only a visible part of the webpage

Windows Application

In Windows 11 and 10 (from version 1809), there is an excellent tool for taking screenshots of both window interfaces and arbitrary forms. It’s called Snip & Sketch. To get started:

  1. launch it using the combination Win+Shift+S or PrntScr
  2. choose one of the 4 screen capture methods

Extension

There are dozens of extensions for taking screenshots in Chrome, both from well-known thematic services and from individual enthusiast users. We provide a link to their convenient search in the Web Store, as well as consider one of them for example, namely Scrnli. We won’t dwell on installing the extension, we’ll just look at the main features of its functionality.

Creating a Page Snapshot

  1. Click on the extension’s quick access icon in the top right corner, the first 4 items from the list are of interest to us:
    • Visible Page
    • Entire Page
    • Selected Area
    • Browser Window
  2. After selecting the desired screenshot creation option, the extension opens a taken screenshot in its editor, where you can:
    • save the frame as a PNG image or PDF file using the “Download” button
    • copy the image to the clipboard via the “Copy” button for subsequent pasting into any other graphics editor
    • add text, lines, arrows, retouching, etc. using the toolbar at the top left
  3. If you liked the extension, we also recommend paying attention to the set of hotkeys. You can assign them yourself at:
0
Leave a comment
1 Comment:

The first method is the simplest for Windows if you know how to press buttons :), no need to install any junk in Chrome.