One of the most neglected areas of web development, print CSS is a very good place to start with the principles of adaptive design and media queries. Users print web pages more frequently than most designers account for, and print stylesheets are a great “fit and finish” step for sites that remain a mark of quality and attention to detail.

Goals: Create a print media query and stylesheet

Total time for practice: 2 hours

Prerequisites: The CSS reading list to this point.

Core Material

1. Introduction to CSS media queries
2. CSS for print stylesheets
3. Force Accurate Colors For Print
4. Use CSS Filters For Print
5. Add QR Codes To Printed Pages
6. Print stylesheet development
7. Printing web page components

Additional Reading

For more information, I’d suggest following up with my Smashing Magazine article on print stylesheets, together with Rachel Andrew’s, and this article on how Medium rewrote its print stylesheets.

When You’re Done

Print stylesheets are an excellent introduction to media queries, leading naturally to the more complex world of responsive web design.

Photograph ofJessica Hische’s letterpressed note card monogram by Cranky Pressman, licensed under Creative Commons.

Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.