Intrinsic image size scaling factor

I've suggested on whatwg[1] that there should be a possibility of easily  
embedding all images on a page at 192dpi/2dppi *by default*.

My reasoning is that in not-so-far future high-DPI displays will be common  
enough, and bandwidth cheap enough, that authors will want to design  
primarily/only for "2x" displays.

Images at intrinsic size of 1 image pixel to 1 CSS pixel look awful on  
high-DPI displays, so 1:1 scale with CSS pixels is going to become a bad  
default.

Currently the only solution is to specify explicit size for all  
<img>/background-image, and that is quite tedious. In the future the need  
to specify img-set(…2x) and <img srcset="…2x"> every time just to get  
"normal" resolution will seem like an annoying historical quirk, and basic  
forms of <img> and url() will become useless.


To alleviate that I suggest adding a property that scales intrinsic size  
of images embedded on a page via <img> and url() (except image-set()).

The property would be inherited to allow pages easily make *all* images  
high-dpi:

html {image-size-scale: 2x}


For example a 100x100 pixel image without width/height set, but with  
image-size-scale:2x applied would be displayed at 50x50 CSS pixels.

Image with size explicitly set via <img width/height> or CSS width/height  
would not be affected by image-size-scale.


Same for background-image: background:url(100x100px) without  
background-size would show double-density background 50x50 CSS pixels  
large. image-set(url() 1x) or background-size would take precedence over  
image-size-scale property.


-- 
regards, Kornel Lesiński

[1]http://lists.w3.org/Archives/Public/public-whatwg-archive/2012May/0398.html

Received on Monday, 21 May 2012 00:10:53 UTC