It’s common for web designers to want to make screenshots of web pages. But if you use a Mac and Safari you don’t need to do anything special — at least not for shots of the upper portion of the page. If you know where to look, you’ll find the Mac has already made the screenshot for you. You didn’t need to do a thing.
Visit a page in Safari
Ok, step 1: visit a web page in Safari. You could try http://knowit.co.nz, for example. You now have a screenshot.
Open the Safari cache folder
Step 2: open the Safari cache folder. You should find it here:
/Users/[your user name]/Library/Caches/com.apple.Safari/Webpage Previews/.
It’ll be filled with files with ghastly names like
011E33481600D6E7A61C2CD1B2AFCDC7.png, but that’s OK. Sort by date so the newest is at the top.
Notice that in fact each file name occurs twice, once as a
.png and again as a
.jpeg. Safari has kindly saved the image of each web page in 2 different formats.
View the image
Step 3: view either or both of the newest images. You’ll see a preview of the page you just visited in Safari.
On my machine that image of KnowIT is 1200 pixels by 2000, and didn’t capture the full length or even width of the web page. Ooops.
On other pages I tested the image was smaller and did capture the full width and height.
So, if you’re a web designer and need to make screen captures of web pages for yourself or for clients, don’t make extra work for yourself. Check the Safari cache folder first.
Hey, Windows Safari users — does this Tip work for you? I have no idea where you’d look for the cache, I’m afraid.
I’d be interested to hear your experiences of using these caches files from Safari. Tell us in the Comments how you’re using them.