What is a Printer-Friendly Web Page?

How to Design a Printer-Friendly Version of Your Page

Ready printer sheet
Stephan Zabel/E+/Getty Images

As Web pages get more and more complex with images, ads, and links all over the place, they become harder and harder for people to read. Combine that with the eye-strain caused by most monitors and you create an environment where people want to print out Web pages.

Many Web designers feel that if a Web page is written for the Web, that's where it should be read. But some Web pages can be difficult to read online, either because of the ads and flashing blinking images, or because they are so long that it's easier to read them in print.

For how to articles, it's easier to have the article printed out to follow along with, perhaps writing notes or checking off the steps as they are completed.

Besides, it's not yet possible to take a Web browser into the bathtub with you, and falling asleep in bed with a computer can be very uncomfortable.

What Makes a Printer-Friendly Page Printer-Friendly?

There are some disagreements about how to write a printer-friendly page. Some people feel that only the article content and title (with perhaps a by-line) should be included on the page. Other developers just remove the side and top navigation or replace them with text links at the bottom of the article. Some sites remove advertising, other sites remove some advertising, and still others leave all of the advertising intact.

What I Recommend for Print-Friendly Pages

  • Change colors to black on white.
    If your Web page has a background color, or you use colored fonts, your printer-friendly page should be black text on a white background. Most people use black & white printers, and colored backgrounds can use up a lot of ink.
  • Change the font to a serif face.
    Most Web pages are written in a sans-serif font, because that is easier to read online. But when moving to print, serif fonts are easier to read.
  • Watch the font size.
    If you're writing a Web page with a small font size (11px or smaller), you should definitely increase the font size for printing. I recommend 12pt text or larger, depending upon your audience.
  • Underline all links.
    The links will not be clickable on your printer-friendly page, so making it obvious that they are links will clarify the page information. I like to also change the color of links to blue, for color printers.
  • Remove non-essential images.
    What makes an essential image depends on the developer and the marketing department. I limit images to those that are required for the article and a brand logo at the top left of the page.
  • Remove navigation.
    A lot of what makes a page difficult to print is caused by advertising and side-navigation. Removing it allows the text more room to flow across the screen - making it easier to read when printed out. Also, since the page is meant to be printed, navigation is just a waste of ink.
  • Remove some or most of the advertising.
    This is a sticky subject, as some printer-friendly mavens would have all images removed from the printer-friendly pages, including and especially advertisements. But the reality is many sites (including this one) are supported by advertising, and removing all ads affects the ability of those sites to stay in business. If I had to choose between ads on a printout or the site being gone, I'd choose ads. After all, if I like it enough to print out, I would like the site to continue.
  • Remove all JavaScript, Flash, and animated images.
    These don't print out well or at all, and in some cases can cause problems printing Web pages.
  • Include a by-line.
    Even if you don't typically have a by-line on your articles, you should include one on the printer-friendly version. This way, if a customer files the article she can quickly find who wrote it later without having to return to your Web site.
  • Include the original URL.
    It is very important to include the URL to the original article at the bottom of the print out. This way, your customers can get back to the exact page online if they need to follow a link or get more information from your site. Also, if they photocopy the print out, your site will get more exposure.
  • Include a copyright notification.
    What you write on the Web is your writing. Just because a customer can print it out or copy and paste the text does not mean that it is public domain. It won't stop the determined thief, but it will remind casual users of your rights.

    With these simple guidelines, you can create printer-friendly pages for your site that will have your customers happy to use and return to.

    How to Implement a Print-Friendly Solution

    Use CSS media types to create print friendly pages. Yes, it's possible to write scripts to convert your Web pages to print friendly, but why use them when you can just write a second style sheet for when your pages are printed.