How Printer friendly is your site?

There is nothing worse than starting to read an article or a tutorial on a website and thinking I should print this out and read it on the train home (I print duplex and 4 pages to 1 sheet of A4, save the trees and all) to then look at the print preview to an absolute mess. Nine out of ten times an article will sit on 2 pages and adverts, comments will take up another 8.This then results in having to cut and past the web page into a document and formatting it so it’s readable which can take some time depending on the length of the article.

If your site is marked up properly then making it easier for us and the trees why not use a Cascading Style Sheet specifically for printing?  This isn’t difficult to achieve and can be done quite quickly.  Where do I start?

The starting point is setting up a Cascading Style Sheet specifically for printing this is down by adding:

<link rel=”stylesheet” type=”text/css” href=”PrintFriendly.css” media=”print” />

This tells the browser to look at this style sheet when printing.  In my print style sheet I have hidden anything that makes the site look pretty and have taken out elements such as my menu, links, archive list etc basically leaving behind the most important thing, Content.  Nothing complicated in this all I have done is assign a display:none; style to the page elements i don’t want to show on my print out.

For other style sheet print options check out : http://www.w3schools.com/css/css_ref_print.asp

If you write long posts please consider the environment and your audience and implement a “printer” friendly cascading style sheet.