Printing Pages with Print What You Like

Generally web developers are supposed to create a print friendly stylesheet for their website(s) in case visitors actually want or need to print something out. Unfortunately, this is often skipped by developers leaving a large majority of websites in a very sad state when printed. Of course, the content of a website may determine the importance of a print stylesheet.

PrintWhatYouLike.com makes it super easy to clean up websites for better printing so they not only look better but save on ink and paper. Today I’ll walk through a quick how-to on using PrintWhatYouLike and their browser bookmarklet.

Why?

I don’t typically print web pages but there has been quite a few occasions I can think of when I wished I had known about PrintWhatYouLike (PWYL). When registering for CES I had to print several web pages, of which only a small portion was needed. My girlfriend often prints recipes from many different sites around the web. Without realizing it, PWYL is something I actually did need, even if it was only a few times a month.

Using PWYL can help save not only ink and paper but the time it takes to print or even read through what may have been a pile of unnecessary information.

Print What You Like

Print What You Like

Installing the Bookmarklet

You don’t really need to use PWYL’s bookmarklet, but it might be worth it if you end up using it frequently. Installation is easy; just drag and drop into your bookmark toolbar.

Bookmarklet Install

Bookmarklet Install

Using PrintWhatYouLike

Once the bookmarklet is installed, just visit the page you want to print and click the bookmarklet. A sidebar will popup with options to clean up the page to prepare for printing.

PrintWhatYouLike Sidebar

PrintWhatYouLike Sidebar

Removing Images and Backgrounds

Images use more ink when printing than any other website element. So, if you don’t need the image(s), get rid of them. That includes backgrounds!

Remove Background

Remove Background

I’ve removed the page background(s) in the screenshot above but there are a couple small backgrounds I’d actually like to keep (such as dividers). So, I’ll click the Undo button at the top to bring it all back. The content I want to print from Web.AppStorm is the blog posts so while I could go through and remove images or backgrounds, one by one, I’ll take a different approach.

Isolating Sections

Probably the fastest way to clear everything from a page except the section you want to print, is to select the desired selection and click Isolate.

Isolate Section

Isolate Section

The selected section is outlined and highlighted yellow. Once you click the Isolate button, everything else on the page is removed.

Section Isolation

Section Isolation

You’ll notice the window still has a black background, which cannot be removed unless you click the Remove Background button—which will also remove post dividers (which I don’t want). Not to worry though, this won’t actually be printed. We can double check by clicking the Print button and checking the print preview.

Background Not Printed

Background Not Printed

Finer Details

You can further refine your print selection by selecting individual elements and resizing or removing them. For example, I want the intro image used in the first post but not the second or third ones. In addition to that, I want to resize the post titles and remove the comments. In the third post I also want to remove the category. Easy, just a few extra clicks.

Final Edits

Final Edits

Now it’s ready for printing and only includes the information and images I actually want and/or need printed.

You can also use the More or Less buttons to select elements in order according to their structural tree. You’re also able to change fonts and font sizes, along with saving clips or even full sets (PWYL account required).

Conclusion

PrintWhatYouLike.com is a great little resource and actually fun to play around with. It’s definitely worth bookmarking and maybe even installing the bookmarklet if you think you’ll need it. As a coder, I’d like to see a few options for a little better control but the productivity side of me says simplicity is best.

What do you think of PrintWhatYouLike.com? I know there are many apps and bookmarklets similar, so if you use or know of one, please share it with us in the comments.


  • http://regexpr.com/ GasheK

    Thank you for the article, I have long dreamed of a similar service.

  • http://twitter.com/aziz_light Aziz Light

    Until now I used Chris Coyier’s Printliminator (http://css-tricks.com/printliminator-update/) but this bookmarklet is absolutely amazing. Good find!

  • http://www.manastudios.net Amador

    That’s awesome, really helpful, thanks for sharing!

  • http://webtoolfeed.com Webtoolfeed

    Great web app.

  • Avelino Guerrero

    This is really a green useful app! Good work!

  • http://www.cartridgeshop.co.uk Kathy Blackmore

    PrintWhatYouLike.com is a good recommendation.
    It can help you to save on inkjet cartridges and paper. You can simply choose any web page to print and the tool will help you to print according to your selection of text or pictures. If you do not want the photos or pictures to be included in your printout, you can opt for them to be left out.

  • http://webdevelopergeeks.com webdevelopergeeks

    I do agree. Great find!! Everybody definitely would like to use such service.

theatre-aglow
theatre-aglow
theatre-aglow
theatre-aglow