Full Page Screenshots for Website in Browsers

Who doesn’t know? You want to create an image from an entire website, but you can usually only virtually photograph the visible area. It’s actually pretty easy to take screenshots of a website from your browser, including the areas you can reach by scrolling.

Screenshot with Firefox

Firefox makes it by far the easiest way to take such a full-page screenshot. The process is extremely user-friendly and you don’t need extensions to easily photograph the website:

1. To do this, click on the three dots in the URL bar and go to “Take a Screenshot”:

Full Page Screenshots for Website in Browsers - Firefox

2. In the next step, you can then optionally photograph the individual elements of a page virtually by hovering over it and clicking on the respective area.

Full Page Screenshots for Website in Browsers - Firefox

3. In the very last step, a window opens, in which you actually only press the blue “Download” button. The file is then usually shipped to the Downloads folder and stored there. Unless you have defined another default folder.

Full Page Screenshots for Website in Browsers - Firefox

And that’s it. Surgery succeeded, patient lives. Now let’s look at the process in Chrome next.

Screenshot with Chrome

In Chrome, unfortunately, it’s not as easy as Firefox. This will certainly not be a problem for developers, as they are already familiar with Chrome’s DevTools. For not so savvy users, however, it is probably rather inaccessible, and you have to get used to the process first. And it goes like this:

1. You access the DevTools menu in Windows via CTRL + SHIFT + I, (in Mac via CMD + ALT + I). The following overview appears:

Full Page Screenshots for Website in Browsers - Chrome

2. In a second step, enter d in Windows CTRL + Shift + P, which calls an input field that looks like bellow.

3. Finally, you write the word “Screenshot” in the input field, which displays some options. What you need is “Capture full-size screenshot”.

Full Page Screenshots for Website in Browsers - Chrome

So you click on this now, and after a few seconds, an image of the entire website is downloaded to the Downloads folder. Finished. If this is too complicated for you, the screenshot functionality is also available for you as a Chome Extension.

For the sake of completeness, we take a look at the Safari browser.

Screenshots with Safari

In Safari you can also take a screenshot about the “Web Inspector”, which you can access via CMD + ALT + I in Mac. Here you only need another mouse click on “Capture Screenshot”, and in no time the file is in the Downloads folder. If you don’t like such developer tools, you can also use Awesome screenshot extension.

Full Page Screenshots for Website in Browsers - Safari

What are your favorite extensions or tricks to take such screenshots? Write it down in the comments! We will include the best tips in the article.

Happy photography!

Comments

Write a Reply or Comment

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


This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.