Psychology-Driven Brand Design. Creating and Refining Remarkable Brand Identities.

The Importance of a Print Stylesheet

Table of Contents

I’m an avid recipe-hunter. When I get bored with our usual dinner routine, I hit the web for a new recipe I can try. And when I find one? I print it out. Yes, I’m a digital, save-the-trees type, but me in the kitchen with the iPad isn’t the best idea (think sticky fingers, hot liquids, raw meats, overly-vigorous mixing… [I’m not the neatest cook in the world]). I need my recipes on paper. So, I can’t tell you how grateful I am when the website owner has considered the print experience…. and how frustrated I am when they haven’t. 

What is a print stylesheet?

For those unaware, a quick lesson: the way a web designer or developer controls how a website looks is by writing code called a stylesheet — basically a document with a series of style rules that your browser understands and interprets. By default, web developers create a screen stylesheet, which controls how your website looks on a screen. And many will stop there. However, you can also create a print stylesheet that controls the style of your page when it is printed. (There are other media types that you can create stylesheets for: braille, projection, speech, and tv are some of them, but these aren’t as commonly used for a typical website.) 

Why have a print stylesheet?

Have you ever wanted to simply print out some information from a website and had any of the following situations happen?

  • It printed out a haphazard hodgepodge of stuff you didn’t need (ads, long comment threads, large images, navigation links…); or
  • It used up extra sheets that only had a tiny strip printed on it because the screen’s content extended across multiple sheets of paper; or
  • You used up three gallons of ink printing a single page that had a black background and bright colorful images everywhere… 

Get my drift? Usually, when someone wants to print something for reference, they’re only interested in the content, the meat and potatoes, and they don’t need all the extra stuff that only serves to waste paper and guzzle precious printer toner. 

How do I get a print stylesheet?

It’s relatively easy for someone who knows HTML and CSS to set up a print stylesheet. If that’s not you, your web developer can handle it, either by creating and linking to a separate print stylesheet or using media queries in the existing stylesheet to modify rules for print. It is not the purpose of this article to get into the technical details, but there is no shortage of instruction out there if you’re interested in finding out!  

So the big question is, does YOUR website need a print stylesheet?

It depends on your site’s purpose and design. There are cases when it could actually be frustrating for users who want to print an exact screen shot of your website, only to find that when they print, it looks different than what they saw on their screen. So, you’ll have to consider your audience and the type of information you have on your site to determine what your printed web page should look like. Ultimately, you can’t predict every situation. However, I recommend that it be a considered aspect of user experience. You won’t necessarily have to change up your print view drastically, but a few simple tweaks to standardize print output, optimize page space, and minimize ink usage can really make a difference to your end user.

(By the way, you can see an example of a print stylesheet in action by printing from this very website! Go ahead: File > Print and check out your Print Preview.)

Nyla Smith

Nyla Smith

Nyla is a Graphic Designer, Web Designer, Front-End Web Developer and Consultant with over 15 years of experience. She is the owner of n-Vision Designs, LLC in Hampton Roads, Virginia, which exists to provide marketing support and brand consulting to small- and medium-sized businesses needing creative solutions. Contact Nyla if you'd like to discuss your next creative project. She can usually be bribed to a meeting with a cup of green tea and an oatmeal cookie.

More Like This...

How Nike Failed at User Testing

Business owners can learn an important lesson from Nike’s latest showing at Wimbledon. Mainly that “just do it” should never supercede “just think it through”. In this case, that means designing products with the end-user in mind; which, in the world of web design, comes in the form of user testing or user experience.

Read More »

Signing Off! Email Signatures the Right Way

In this high-tech age, something as simple as an email signature should be a breeze to create on your computer. Think again! Although all email clients support these signatures, each interprets it differently. This causes the HTML email signature to be one of the most unpredictable beasts in the digital world.

Read More »

Why SEO is a Partnership

Search Engine Optimization (SEO) encompasses a lot. Like a big mutant octopus with too many arms to count, SEO’s various components can seem overwhelming at times. Don’t be intimidated! There are easy things that you as a website owner should and can do to help your site rise in the rankings.

Read More »