Re: Behavior of device-pixel-ratio under zoom

On Nov 10, 2012, at 5:12 pm, L. David Baron <> wrote:

> On Saturday 2012-11-10 19:48 -0500, Robert O'Callahan wrote:
>> Should devicePixelRatio and device-pixel-ratio be affected by browser zoom?
>> It seems to me that if the user zooms in a persistent way, it would make
>> sense to adjust device-pixel-ratio to match. For example, if the user
>> always views the page with a zoom of 2x on a 96dpi desktop screen, then
>> there are two device pixels per CSS pixel and device-pixel-ratio should be
>> 2.
>> OTOH I can see that if the user zooms in and out a lot just to navigate (as
>> is often the case on mobile browsers), we might not want device-pixel-ratio
>> to vary.
> For mobile browsers that allow the user to pan and zoom around a
> viewport, media queries in general should not change as the user
> pans and zooms.  In general, those media queries should reflect the
> outer viewport that you'd get with a <meta viewport> or @viewport
> that prevents panning and zooming.
> On the other hand, for a browser zoom mechanism that effectively
> resizes the viewport, some media queries definitely should change in
> response to zoom (e.g., at a 2x zoom, height and width should be
> half what they are with a 1x zoom, so that the page layout correctly
> reflects the area available to it).  I don't have a strong use case
> for device-pixel-ratio here, but I tend to think it should probably
> match the other media queries absent strong reasons for the
> contrary.

We (Apple) feel quite strongly that device-pixel-ratio, like window.devicePixelRatio,
should not change under zoom. It's answering a question about the device hardware,
not the current zoom state of the page.

I think in general authors should not be able to directly affect the layout of the page
under different zoom levels. Zooming should shouldn't have unsurprising side effects
for the user.

In cases where it makes sense for the amount of detail of elements on the page
to increase on zooming (e.g. showing higher resolution image assets), features like
image-set() come into play, and allow the UA to make resource/resolution choices
without the author having to worry directly about things like devicePixelRatio and
zoom level.


Received on Monday, 12 November 2012 00:13:42 UTC