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.

TBH Creative

About the author | TBH Creative

TBH Creative is an Indianapolis-based web design and marketing company. Our services include web strategy & planning, website design and development, inbound marketing, SEO, branding, graphic design, and marketing reporting.

Since 2004, TBH Creative has worked with hundreds of companies in a wide range of industries, including healthcare, finance, and service. We specialize in developing complex, enterprise-level websites that convert.

We believe in clear communication, high standards of excellence, and beating deadlines. But beyond those ideals, what really drives the heart of our business is your business. We take pride in helping our clients achieve more with digital marketing and web design than they ever thought possible.

View more posts by TBH Creative

Previous Web Design: Interactivity with jQuery Next Audio: 3 Tips for Getting Started

Receive articles in your inbox