Print Styles Are Media Queries
I have alluded to this point in the past. Usually when I get off on a rant about print styles, I lump it into the overall process of making responsive sites and I use media query formatting in my examples. But I haven’t just flat-out said that print styles are media queries.
I believe I always assumed that the reader would just understand that in the context of my writing, in using print styles on sites, and understanding that print is a medium in which web pages have been displayed for years.
Peter-Paul Koch (@ppk on Twitter) has spent years tracking browser support for even some of the most minute features. From way back in the evolt.org days I’ve watched him dive into testing without concern for his own wellbeing (browsers have sharp edges). Most recently he put out calls on the Twitters for web developers to fill out a survey about how they use media queries.
I did not grab a screen shot of the survey, but he asked the following two questions (which you can glean from the raw results):
- Which media queries have you used AT ALL in practical projects in the past year?
- Which media queries have you used in MORE THAN HALF of your practical projects in the past year?
He presented the following options:
- width
- height
- device-width
- device-height
- device-pixel-ratio
- resolution
- orientation
- aspect-ratio
- device-aspect-ratio
- Other
You’ll note that “print” is not an option. Despite that, 1% of his respondents to the questions (of the 33 and 23, respectively, that chose “other”) wrote in “print,” because that’s what this chart indicates in his write-up (Media query/RWD/viewport survey results):
Media query | Regular use | Occasional use |
---|---|---|
width | 84% | 7% |
device-width | 32% | 15% |
device-pixel-ratio | 25% | 18% |
height | 17% | 16% |
orientation | 13% | 20% |
resolution | 9% | 5% |
device-height | 7% | 7% |
aspect-ratio | 3% | 4% |
device-aspect-ratio | 3% | 3% |
1% | 1% |
I want to be clear, I am not faulting PPK. His survey was very much about the work he’s been doing lately understanding how viewports, pixel densities, and screen sizes are reported across the current landscape (jungle) of devices. Instead, I am happy that 1% of his 1,251 respondents consider print to be a media query and took the time to make it a write-in answer.
Now I just wonder how long before the other 99% would do the same. Or even for the much smaller percentage who write media query tutorials, examples, libraries, CMSes, and so on.
@ppk I’m really sad there are only 1% print MQs…
— Nicolas Hoizey (@nhoizey) November 22, 2013
Related
If you want to learn how print media queries can be useful to you, please follow the links below (which themselves contain many more links). “The more you know.”
- My WordCamp Buffalo 2013 Presentation: Making Your Site Printable, Sept. 14, 2013.
- My Presentation Slides: Making Your Site Printable, May 19, 2013.
- Tracking When Users Print Pages, Mar. 26, 2013.
- Calling QR in Print CSS Only When Needed, Mar. 8, 2013.
- My Print Styles Article in .net Magazine, Jul. 18, 2012.
- Announcing PrintShame.com, Apr. 9, 2012.
- More Evidence of the Need for Print Styles, Apr. 6, 2012.
- Test in Lynx and Print, It’s Your Job, Dec. 12, 2011.
- More Samples of Responsive Web Design ≠ Print, Oct. 13, 2011.
- Print Styles Forgotten by Responsive Web Developers (at evolt.org), Oct. 4, 2011.
Update: January 13, 2014
It’s nice to see others agree: The printer is a device too!
Leave a Comment or Response