Friday, November 22, 2013

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 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):

  1. Which media queries have you used AT ALL in practical projects in the past year?
  2. Which media queries have you used in MORE THAN HALF of your practical projects in the past year?

He presented the following options:

  1. width
  2. height
  3. device-width
  4. device-height
  5. device-pixel-ratio
  6. resolution
  7. orientation
  8. aspect-ratio
  9. device-aspect-ratio
  10. 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 use
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%
print 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.


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.”

Update: January 13, 2014

It's nice to see others agree: The printer is a device too!

No comments:

Post a Comment