search

w3c / csswg-drafts

CSS Working Group Editor Drafts
https://drafts.csswg.org/
Other
4.52k stars 673 forks source link

[css-images-4] It's unclear what "intrinsic resolution" mean in 6.1 (image-resolution: from-image). #4881

Open noamr opened 4 years ago

noamr commented 4 years ago

Is it EXIF-based resolution-x/resolution-y? How does it work when they're not 1:1? Is it based on something else? Format specific?

eeeps commented 4 years ago

Is it EXIF-based resolution-x/resolution-y […] Format specific?

I think it can be anything: format/implementation-specific. It's been intentionally unspecified.

See this discussion (source), re: image-orientation:

<tantek> or image-orientation: exif ?
<tantek> why not be specific and say exif rather than auto?
<fantasai> tantek, because it might be done via some other technology
           in some other image format
<fantasai> CSS keywords are format-agnostic

For instance, PNGs have a dedicated piece of metadata for this, that isn't EXIF.

There were a couple of discussions about how “inches” and “centimeters” in metadata – which may have initially been intended to affect printing – should be interpreted, in CSS. It was ultimately resolved that they should be interpreted as CSS in and cm (so, visual angles instead of physical units), but this doesn't appear to have made it into the spec.

How does it work when they're not 1:1?

There was also a discussion about this, which resolved on:

  1. Giving image-resolution the ability to take two (X+Y) values.
  2. Distorting the image when they aren't the same.

There's an open issue about this, but it also doesn't appear to have made it into the spec.

(Note! That while the primary use case discussed the old mailing list posts about this was weird content from weird scanners and/or fax machines, I actually have a reasonable, modern, use case for this, now, I think: low-resolution image placeholders)

eeeps commented 4 years ago

If nothing in the intervening seven years has undermined these WG resolutions, I could get a PR or two together, with:

  1. A note about interpreting formats' physical units, in CSS
  2. The two-resolution syntax for image-resolution
eeeps commented 4 years ago

Actually, it looks like there was a big discussion in 2014 about what to do when intrinsic resolution was not 1:1. After reading it through a couple of times, I'm not totally clear on what direction folks wanted to go; @tabatkins any guidance on what happened then, or perhaps since?

noamr commented 4 years ago

I think that now that EXIF orientation is explicitly supported in the spec, it should be entirely clear in the spec how EXIF resolution (and other metadata formats) should work in the case of from-image. Otherwise from-image would create cross-browser interop issues...

faceless2 commented 4 years ago

If the image's metadata specifies it's intrinsic resolution is not 1:1, I don't see any way to satisfy from-image that doesn't involve honouring that.

I expect this feature is primarily of interest for print output, where anisotropic scaling of images is trivial.

noamr commented 4 years ago

Thinking of printing, I'm wondering how dpi in EXIF should translate to dppx in css. The default in EXIF is 72dpi (an old Mac default) while the default in CSS is 96dpi (an old windows default). It sounds more "correct" to align with inches; that would mean that if both the image and the content use inch-based measurements, and from-image is present, the resolutions would be correct. However, what would that mean for images without EXIF resolution? would they all change their intrinsic size by 4/3?

faceless2 commented 4 years ago

Inches, mm (used in PNG), pixels and points all have fixed relationships in CSS values: 1in = 72pt = 96px. This applies in all media, print or screen. So provided the metadata specifies a resolution, it's unambiguous. If there is no resolution metadata, then a pixel is just a pixel: the resolution is 1dppx = 96dpi.

As for the relationship between "CSS pixels" and actual physical pixels, well that's a different matter altogether. See https://github.com/w3c/csswg-drafts/issues/614 - still going strong, despite being closed for two years.

noamr commented 4 years ago

Inches, mm (used in PNG), pixels and points all have fixed relationships in CSS values: 1in = 72pt = 96px. This applies in all media, print or screen. So provided the metadata specifies a resolution, it's unambiguous. If there is no resolution metadata, then a pixel is just a pixel: the resolution is 1dppx = 96dpi.

As for the relationship between "CSS pixels" and actual physical pixels, well that's a different matter altogether. See #614 - still going strong, despite being closed for two years.

Ok, so if I understand correctly - 72dpi in EXIF stands for Pt per inch, and is equivalent to 96dpi in css (which stands for px per inch). Thanks for the clarification!