Web Development: Print Stylesheets & Why They’re Important

Not every website needs a print stylesheet, but it wouldn’t hurt to have one.

What is a print stylesheet? This special stylesheet that specifies what to print from the website page. Setting up this stylesheet is easy. Make sure you link your html to the stylesheet: <link rel=”stylesheet” href=”print.css” type=”text/css” media=”print” />. The browser can’t automatically detect that it’s on the server.

Get rid of anything that is “unnecessary”

Navigation is safe to get rid of for the print stylesheet because the user cannot “click” on printed paper. It’s silly for them to print out something that isn’t useful and uses up their printer ink. Do they really need that logo and random picture of your cat, too?

The main question you need to ask is: will the user really want this information printed out? If the answer is no, it’s best to leave that information off of the print stylesheet.

Display link destinations

Users obviously cannot click on links on a printed page. Displaying the link destinations on printed pages will help the user out significantly. Line 25‘s article “Handy Tips for Creating a Print CSS Stylesheet”shows the code needed to display the link destinations on printed pages.

By supplying the link destinations, the user can print out the page without worrying about where the links were pointing to. It makes it easy for them to go back and reference items.

Widen the content area

Widening your content area for printing helps to conserve the user’s paper. Don’t have whitespace included in the print stylesheet unless it’s absolutely necessary.

Some websites have very skinny content areas from forced width dimensions–these can transfer to the print stylesheet. It is very simple to condense a five page printed website into two pages.

TBH Creative Example

RJE Knoll Business Furniture by TBH Creative

RJE Furniture’s web version.

RJE Furniture’s print version.

Your print stylesheet doesn’t need to be beautiful or highly ‘designed’. The goal is to keep it as simple as possible without confusing the user. Saving trees and using less color ink is also suggested.