How to take full webpage screenshot?

24.04.08

Filed Under: Tutorial



There are tonnes of great website designs on the web out there. Sometimes, web users wanted to take screenshot of the website either for future reference or as collection. The easiest method to use is by hitting the Print Screen and Paste it in MS Paint. But what if we want a full page screenshot?

Last time, when I want a full site screenshot, I do print screen page by page and then join it back in Photoshop. Clever. But the tools below make me look so stupid.

Firefox Add-on: Screengrab!

Screengrab! saves the entire webpages as images. Once installed, the Screengrab! icon appears at the bottom bar of Firefox browser. You can either choose to save or copy to clipboard. Output formar is in PNG. Best use for quick screen grabbing and saving. However it cannot take screenshots of flash content sites thou.

Screengrab! Firefox extension

Firefox Add-on: FireShot

FireShot is a Firefox extension that creates and edits screenshots of web pages. Unlike other extensions, this plugin provides a set of editing and annotation tools, which let users quickly modify captures and insert text and graphical annotations. Such functionality will be especially useful for web designers, testers and content reviewers.

The Fireshot button appears at the right side of search bar. And like Screengrab!, it can’t capture flash contents. Although I use Screengrab! more often, but I found that FireShot is more useful.

FireShot Firefox extension

Web: Super Screenshot

Superscreenshot is a website that let you enter a URL, and will give you the website screenshots in return. The URL entered can be save as full page with full original size either in JPG (compressed) or png (best quality, but takes some time to load). Again, it can’t capture flash content sites. Plus the screenshot width is narrow, about 900 pixels only. This means that content that wider than 900px will be cropped.

There is alternative site which is Browser Shots, but normally people use it to test how the site looks in different browsers.

Super Screenshot

Application: WebShot

WebShot allows you to take screenshots of web pages and save them as full sized images or thumbnails. Screenshots images can be output in the JPG, GIF, PNG, or BMP formats. The application is very flexible, you can set the width for the screenshot, and if you did not set the height, it will capture a whole page.

And the best part is it successfully captured flash content sites. But, flash sites normally takes more time to load, so to capture flash sites, I suggests to set the Timeouts for document for more than 30 seconds, depends on how fast your line is. It is free to use too.

WebShot

End Note
Above are the 4 methods to take full web screenshots faster and smarter. If you have other methods, feel free to tell me by using the comment form below.


Similar Posts:

11 Responses to “How to take full webpage screenshot?”
    Sam
  1. Sam

    In Safari, I use a bookmarklet which opens up Netfixer. Unfortunately, in sites that need authentication, Netfixer will end up taking a screenshot of the login page. Do any of your recommended methods work well with taking screenshots from sites which need authentication?

  2. Apple
  3. Apple

    Nice share Jayhan. I didn’t know you can take full screenshots like this.

  4. jayhan
  5. jayhan

    @ Sam: Maybe you can try using WebShot? I really don’t know how to solve it.
    @ Apple: Thanks ;)

  6. maruyo
  7. maruyo

    http://dip.picolix.jp/disp5.html
    こちらのツールを使うとあっという間にできますよ

  8. Fath
  9. Fath

    I’m using WebShot :)

  10. jayhan
  11. jayhan

    @maruyo: このツールをご紹介本当にありがとうございます!
    @Fath: WebShot is a great tool indeed.

  12. Saawan
  13. Saawan

    WebShot is a great tool.. Lovin’ it! Super Screenshot doesn’t work at times. Strange!

  14. keymistress
  15. keymistress

    I use FF Screengrab though it lags sometimes. ;) Fantastic site you’ve got. I chanced upon while googling for kaomoji.

  16. Виталий
  17. Виталий

    Неплохо конечно, неплохо

  18. Wayne
  19. Wayne

    I use Paparazzi for Mac. Takes a .PNG screengrab of entire length of page. Great for archiving long tutorials and forum posts.

  20. umer
  21. umer

    THanks for the list although i must mention that the fire fox plugin SuperShot requires a good graphics card installed to work and the screen grab plugin has some limitations takin snapshots of embeded videos…

    good work . keep it up.

Leave a Reply

Subscribe to comments feed RSS.