Printer Friendly Pages with Stylesheets

by Abhinav Kaiser on October 22, 2007

If you quickly wanted to print something off the web, hitting the print button would print all the graphics displayed on the screen; things wanted and unwanted. In the age of web, readers should be able to print only the content rather than the website banners, sidebars, footers etc.

A small tweaking is needed in the stylesheet to provide an option for the reader to print only the content. Using a separate stylesheet for printer friendly pages is preferred by most web designers worldwide. The first stylesheet would a normal one with no changes done to it. The second stylesheet will have a display:none element under the sections that are not to be printed.

37signals provides an example of the code and the outputs obtained with and without printer friendly stylesheets.

A simple tweak one every website would help in reducing consumption of printing fuel which is great for the consumer and the environment.

{ 0 comments… add one now }