• Skip to content
  • Skip to footer
A Bright Clear Web

A Bright Clear Web

A Bright Clear Web - Simple, effective, accessible websites

  • Home
  • About
  • Websites
  • Writing
  • Learn
  • Blog
  • Contact
You are here: Home / Software & Tech / Nifty Ways to Take a Full Page Screenshot

Nifty Ways to Take a Full Page Screenshot

Posted: May 7, 2015 Updated: June 26, 2019 by Claire Brotherton
17 Comments

A Bright Clear Web homepage

The problem with web page screenshots….

One of the things I often need to do as a web designer is to take screenshots of web pages.

If I’ve need to capture a shot of a full web page, up until now it’s been a tedious process:

  • Press the Prt Sc key
  • Paste the screenshot into Photoshop (you could do the same with any other image editing program)
  • Scroll down the page
  • Screen capture again
  • Paste into Photoshop again
  • Repeat until the whole page is done
  • Knit the shots together into a new file
  • Crop appropriately.
  • Save the file.

What a lot of work!

I have now discovered some new tools which make the process much easier.

Desktop browser extensions for taking full page screenshots

Awesome Screenshot: Screen capture, Annotate

Awesome Screenshot is a browser extension for Chrome and Firefox. I’ve tested it in both and it works really well.

The links to download it are:

Awesome Screenshot for Chrome

Awesome Screenshot Plus for Firefox

Taking a full page screenshot is easy.

  1. Click on the Screenshot (camera) icon.Select the screenshot to capture
  2. Select if you want to capture the whole page, the visible part or a selection. If you have selected an area, click the Take Screenshot button.Selecting screen capture area
  3. Annotate your screenshot if you wish using the Marker tool.An annotated screenshot created with Awesome Screenshot on Chrome
  4. Save or share your screenshot.

Free screenshot tools for Android

You can capture whole web pages using the Dolphin Browser for Android with the Dolphin Screen Cut add-on, both available free from the Play Store. Using both, you can capture all or part of a page.

To do this:

  1. Open Dolphin browser and navigate to the page you want to capture.
  2. Tap on the icon below the + icon.
  3. Select Screen Cut from the menu.
  4. Select the area you want to capture.
  5. Save or share the screenshot.
Navigate to the URL using Dolphin
Select the Screen Cut option in Dolphin
Dolphin Screen Cut options
Save or share Android screenshot

A screenshot app for iPad and iPhone

Awesome Screenshot for Safari is a free iPhone and iPad app which lets you to take a screenshot of a full web page. You can then annotate it using the inbuilt tools and save it.

There are two ways to use it – through the app natively, or through the Safari extension.

To activate the Safari extension, you need to do the following:

  1. Open Safari.
  2. Tap the Share icon.
  3. Scroll across the second row of icons starting with Add Bookmark and tap More.The More link for Safari on iPad
  4. Set Screenshot from off to on.The Screenshot option activated

To take a screenshot, tap the Screenshot button in the icon row. You can choose to capture a full page or part of a page, then annotate it.

Using the native app is even easier:

Input the URL of the page in the box and click Go.

Or tap the button and choose from an existing screenshot, which you can then annotate. When you are done, tap the green tick, then the Save link.

Tools to annotate an Awesiome Screenshot

The tools you can choose from are:

  • Crop
  • Draw rectangle or ellipse
  • Add arrow or line
  • Freeform drawing
  • Add text
  • Blur parts of the screen.

This is a wider tool suite than the desktop version, which I like.

Browserstack

Browserstack Screenshots is a useful tool I use when testing websites cross-browser. You can which browsers and operating systems to test on. 15 are selected for you to begin with. You can add to, reduce or change that list.

Browserstack Screenshots

The only caveat with Browserstack is that it tests pages on emulators of the devices rather than the actual devices themselves. So there might be very slight differences in the way a web page looks on say, an iPhone.

And finally…

If you have a Dropbox account, a useful feature is that you can send any screen captures taken with Prt Sc directly to your Dropbox. You won’t get full pages that way, but it’s great if you want to capture your whole desktop.

To do this, you need to install the Dropbox desktop app.

Screenshots are stored in a folder Screenshots, and are named with the date and time they were captured. You’ll get a notification each time one is added.

If you don’t have the screenshot option turned on, you can change that this way:

  1. Click on the Dropbox icon in the system tray (Windows) or menu bar (Mac).
  2. Click on the gear icon and select Preferences.Dropbox select preferences
  3. Choose the Import tab.
  4. Check the icon that says “Share screenshots using Dropbox”.Share screenshots using Dropbox option

If you want to edit your screenshots, you still need to do that yourself.

Note that you don’t have to share your screenshots with anyone else unless you want to!

Did this post help you? if so, please comment or share!

Tweet
0

Related

Category: Software & Tech Tags: Awesome Screenshot, Dropbox, screenshot, web page

About Claire Brotherton

Freelance web designer and front end developer based in Edinburgh, Scotland. I love WordPress, code, learning and blogging.

Reader Interactions

Comments

  1. Iain McGinn says

    May 7, 2015 at 11:39 am

    Thanks Claire.
    Handy tools.
    Cheers
    Iain

    Reply
    • Claire Brotherton says

      May 7, 2015 at 1:08 pm

      Thanks Iain – I’m glad it helped.

      Claire

      Reply
  2. Julie @Niackery says

    June 11, 2015 at 12:12 pm

    Another desktop solution is to use the built-in Windows Snipping Tool. It has a few options to choose from, such as including the url of a snip, choosing a default selection text colour, saving snips, and copying snips to the Clipboard by default. It also provides the choice of rectangular, free-form, window, and full-screen snips. The beauty of the Snipping Tool is that many people already have it on their systems — no need to install another app or extension 🙂

    Reply
    • Claire Brotherton says

      June 11, 2015 at 1:09 pm

      Thanks Julie – looks useful.

      It only seems to be available for Windows 7 though. Do you know if Windows 8 has it or Win 10 is likely to?

      Reply
      • Julie @Niackery says

        June 12, 2015 at 2:52 pm

        Windows 8 definitely has it. I hope Windows 10 has it, too, because I use it a lot!

        Reply
  3. TASG says

    September 10, 2015 at 6:51 am

    Perfect Article!
    Awesome Screenshot for Safari is awesome extension with me. Thank for your article again!

    Reply
    • Claire Brotherton says

      September 10, 2015 at 9:44 pm

      Thanks for your comment – glad it helped!

      Reply
  4. Sophie Wood says

    April 13, 2016 at 5:48 pm

    Hi Claire, thanks for this post – most useful – been struggling with another tool but this one is a great improvement.
    Thanks

    Reply
  5. Pingo says

    January 18, 2017 at 9:08 am

    Hi Claire,

    We’re sad to see that our extension is missing from your great list ;(

    In a nutshell, it allows you to take a screenshot and save it to all your favourite apps at once.

    So you can for example, capture a page, share it on Pinterest, rename and save it in your Dropbox and push it to Slack at the same time (and more…).

    Please check us out, I’d love to know what you think: http://getpingo.com/

    Reply
  6. John Robinson says

    May 17, 2017 at 7:37 am

    Thanks Claire, this is really useful.

    Just lately I’ve been using Firefox Developer Tools and it works really well. No need for a plug-in as its part of the browser.

    Second answer down on this post gives you instructions on how to take them.

    http://stackoverflow.com/questions/13158083/take-a-full-page-screenshot-with-firefox

    Reply
  7. Patrick71 says

    October 25, 2017 at 1:10 pm

    Thanks for sharing, very helpful! I’d like to recommend BugRem.com tool, this tool allows you to get easy screenshots.

    Reply
    • Claire Brotherton says

      October 30, 2017 at 2:40 pm

      Thanks Patrick! Is the paid version of BugRem worth it, do you think?

      Reply
      • Patrick71 says

        November 3, 2017 at 10:55 am

        I think so Claire, for now, i am very satisfied.

        Reply
  8. Sam Smith says

    November 3, 2018 at 10:25 am

    Another interesting way to take full page screenshot is by installing the LambdaTest Chrome extension. It can take full screenshot of any website in a single click. https://www.lambdatest.com/chrome-extension

    Reply
    • Claire Brotherton says

      November 12, 2018 at 10:10 am

      Thanks Sam, I haven’t heard of that one before!

      Reply
  9. Junaid Ahmed says

    July 8, 2019 at 11:08 am

    Hi Claire, another option that you may explore is LambdaTest Chrome Extension. It is pretty easy and useful.
    https://www.lambdatest.com/chrome-extension

    Reply
    • Claire Brotherton says

      July 8, 2019 at 3:56 pm

      Thanks Junaid, I haven’t tried that one.

      Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Subscribe to Blog via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email. Read my privacy policy.

potted cactus and laptop with code

Footer

Categories

  • Accessibility
  • Blogging & Content Marketing
  • Business
  • Personal
  • Software & Tech
  • Websites
  • WordPress

Top Posts

  • How To Create WordPress Excerpts And Include Links In Them
  • How To Solve WordPress Image Alignment And Text-Wrap Problems
  • Improve Your Divi Website's Reach With Divi Accessibility
  • How To Set Up And Customize Twenty Nineteen Theme
  • Registering a Domain Name with GoDaddy - Step by Step

Let’s Be Social

  • E-mail
  • Facebook
  • LinkedIn
  • Twitter
Copyright © 2014 -2025 A Bright Clear Web
  • Privacy and cookies policy
  • Site map