This document describes a standard for storing metadata related to art direction in responsive images. It is based on the [XMP] standard which is supported by most image formats and programming languages.

The author of an image can embed the rules for art direction directly into the image file. A web server that processes the image can then crop it according to those rules. The [html-picture-element] can be used to request the matching version of the image from the server.

Status of This Document

This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at http://www.w3.org/TR/.

As a First Public Working Draft, this document is incomplete. The editors seek to illustrate the full scope of the best practices- albeit with the details missing at this stage. In particular, the examples for each best practice are largely incomplete. The editors intend to compile a much richer set of examples in the period leading up to publication of the next Working Draft. Feedback is requested on the scope of this document and the best practices herein. The editors are particularly keen for reviewers to cite examples that may be used to further illustrate these best practices.

The key words "MUST", "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", "SHOULD", "SHOULD NOT", "RECOMMENDED", "MAY", and "OPTIONAL" in this document are to be interpreted as described in RFC 2119.

This document was published by the Universal Images Community Group as a First Public Working Draft. This document is intended to become a W3C Recommendation. If you wish to make comments regarding this document, please send them to public-universalimages@w3.org (subscribe, archives). All comments are welcome.

Publication as a First Public Working Draft does not imply endorsement by the W3C Membership. This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.

This document was produced by a group operating under the 5 February 2004 W3C Patent Policy. W3C maintains a public list of any patent disclosures made in connection with the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) must disclose the information in accordance with section 6 of the W3C Patent Policy.

This document is governed by the 1 September 2015 W3C Process Document.

1. Introduction

This section is non-normative.

Art direction in the context of universal images means cropping and re-framing an image in one or two dimensions depending on the context it is in.

Art directed responsive images start with the photographer. The current situation is that the person who uploads an image to a web server usually makes the decision how an image is cropped. Apart from the technical challenges there are also legal ones. In general, copyright prohibits altering a work of art in any way, even cropping it. (The interpretation of this differs between countries). However, most image agencies allow cropping an image in their license agreements. Nevertheless, this is a factor that has to be taken into consideration when a server is supposed to automatically crop an image.

The purpose of this standard is to give authors and copyright holders a possibility to define the responsive behavior of their images. For web developers and content editors it would simplify things when dealing with responsive issues. Images would always be framed correctly on every device and screen size.

2. Audience

This section is non-normative.

The audience is professionals in the web publishing environment. The most important groups are described below.

2.1 Image authors (aka photographers)

The photographers as the authors of an image are the only persons that can decide how and if their image can be altered. This standard allows them to define the rules for the responsive behavior of their images themselves.

2.2 Online editors

They are the ones who publish images together with their editorial content. Up until now they specified a focus point within the image themselves if the content management system allowed it.
With images that have responsive information embedded, this will not be necessary anymore.

2.3 Web developers

When using stock images for responsive designs, developers have to make sure that when re-sizing the browser window, important areas of the image are not cut off.
With universal images the web framework takes care of correctly cropping the images.

3. Definition

3.1 Namespace

The namespace for this standard is http://universalimages.github.io/rmd/<version>/.
The version is part of the URL. While the standard is still in the first draft phase, a version below 1.0 MUST be used. The prototype implementations are currently using version 0.1.

The XML namespace prefix is rmd

3.2 Units

Pixel (px)
A single pixel of an image file.
Display-independent pixel (dp), aka CSS Pixel
This pixel is defined by a viewing angle and is independent of the physical medium. It is defined in section 4.3.2 of [CSS2]. It is around 12.8' or "the visual angle of one pixel on a device with a pixel density of 96dpi and a distance from the reader of an arm's length".

In the following sections the abbreviation dp is used for CSS pixels to avoid confusion.

The only place where actual image pixel values are used is the image dimensions field. In that case the unit uses the abbreviation px.

Relative values are between 0.0 and 1.0

The point (0, 0) is the top left point relative to the upright image. After [Exif] rotation has been applied.

4. XML Schema

4.1 Attributes

Field NameValue Type OptionalDescription
rmd:AppliedToDimensionsDimensionsno Width and height of the upright image (px) at the time of processing when storing responsive metadata.
rmd:AllowedDerivatesAllowedDerivatesyes Lists the allowed operations.
rmd:PivotPointXMP Area Pointyes All dynamic crop operations MUST be relative to this point.
rmd:CropAreaFrameStructyes Specifies the outer limits of the visible area. The outer area is considered the bleed. If this tag contains area information, the image SHOULD be cropped to those values, otherwise the full image is used. The outer part (bleed) MAY only be used if the target aspect ratio differs from the source aspect ratio.
The `rmd:MinWidth` tag MUST be set if interpolation is set to `linear` so it is clear when to start cropping. This is the only allowed tag apart from the `stArea` tags.
rmd:SafeAreaFrameStructyes An area that cannot be cropped into. This area holds the relevant information within the image.
The `rmd:MaxWidth` tag MAY be set to define at which point this region will be used. Otherwise the value is calculated implicitly. This is the only allowed tag apart from the `stArea` tags.
rmd:RecommendedFramesBag of FrameStructyes A list of recommended crop regions for different output sizes. Those SHOULD only be considered if `Interpolation` is set to `step`.
rmd:InterpolationClosed Choiceyes Specifies how intermediate sizes MUST be treated. The following values are allowed:
Cropping MAY happen between markers
Cropping SHOULD only happen on markers

4.2 Constraints

4.3 Value Types

4.3.1 Allowed Derivates

Currently, there is only one rule:

Field NameValue TypeDescription
rmd:CropClosed Choice This attribute controls the level of modification allowed by the license restrictions of the image.
The following values are allowed:
The image MUST NOT be cropped at all.1
Cropping MAY only be done to prevent the visibility of details within an image. Editorial integrity MUST NOT be compromised.
This allows cropping for layout purposes as well.

1 The CropArea rule MUST still be applied if it was set.

4.3.2 Frame Struct

Extends [XMP] Area (Rectangle). The fields are using the stArea and rmd namespaces.

Field NameValue Type (Unit) OptionalDescription
stArea:xReal (relative)no1 X coordinate of the center of the area (point, rectangle)
stArea:yReal (relative)no1 Y coordinate of the center of the area (point, rectangle)
stArea:wReal (relative)no1Width of the area (rectangle)
stArea:hReal (relative)no1Height of the area (rectangle)
rmd:MinAspectRatioReal (dp)yes2 A minimum aspect ratio MAY be set (in dp). For this frame to be considered the crop aspect ratio MUST be greater or equal.
rmd:MaxAspectRatioReal (dp)yes2 A maximum aspect ratio MAY be set (in dp). For this frame to be considered the crop aspect ratio MUST be less or equal.
rmd:MinWidthReal (dp)yes If set, the crop with (in dp) MUST NOT be less for that frame to be considered.
rmd:MaxWidthReal (dp)yes2 If set, the crop with (in dp) MUST NOT be larger for that frame to be considered.

1The Area fields are OPTIONAL for the Default Crop Area.
2Either MaxWidth or the AspectRatio fields MUST be specified for a frame to be considered.

4.3.3 Dimension

The field namespace URI is http://ns.adobe.com/xap/1.0/sType/Dimensions# and the prefix is stDim.

Field NameValue TypeDescription
stDim:wInteger Width of the image
stDim:hInteger Height of the image
stDim:unitClosed Choice Currently, pixel is the only allowed value.

4.3.4 Area

For reference, the XMP Area definition which is part of the [XMP] namespace is described here. This structure represents an area or a point. Similar to Dimensions (stDim) the “unit” field describes the specific unit being used. The following table gives an overview of the different types and properties being used.

PointSingle point at stArea:x, stArea:y
RectangleCenter at stArea:x, stArea:y. Width and height defined by stArea:w and stArea:h

The field namespace URI is http://ns.adobe.com/xmp/sType/Area#
The field namespace prefix is stArea.

4.4 Compatibility with other standards

The RMD standard combines all information needed for responsive images into one namespace. It is possible that some information is already stored in a different place. The following table specifies how existing metadata should be treated.

Field NameAction
SubjectArea If SubjectArea is a Point type, the value SHOULD be used as a placeholder value for rmd:PivotPoint. If it is a Rectangle type, it SHOULD be used as a placeholder for rmd:SafeArea.
SubjectLocation If SubjectLocation is specified and SubjectArea is not a Point type, then SubjectLocation SHOULD be used as a placeholder value for rmd:PivotPoint.
XMP-cc:License If the image contains a popular restrictive license such as the Creative Commons NC license, rmd:AllowedDerivates MUST be set to none.

5. Interpretation

5.1 Rules

The default behavior for cropping MUST follow these rules:

All values have to be normalized to dp for the calculations.

5.2 Process

The recommended way to process the image is described in the activity diagram which is referenced in the appendix.

A. Appendix

A.1 Use Cases

The following is a collection of use cases where art direction is used:

A.2 Prototype Implementations

A.2.1 Adding Metadata to an Image

A.2.2 Processing the metadata

A.3 Further Documentation

B. References

B.1 Normative references

Bert Bos; Tantek Çelik; Ian Hickson; Håkon Wium Lie et al. W3C. Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification. 7 June 2011. W3C Recommendation. URL: http://www.w3.org/TR/CSS2
Adobe Systems Incorporated. ISO/IEC. Extensible metadata platform (XMP) specification -- Part 1. 15 February 2012. URL: http://www.iso.org/iso/home/store/catalogue_tc/catalogue_detail.htm?csnumber=57421

B.2 Informative references

Japan Electronics and Information Technology Industries Association. Exchangeable image file format for digital still cameras. May 2013. URL: http://www.jeita.or.jp/japanese/standard/book/CP-3451C_E
Tab Atkins Jr.; Simon Pieters; Yoav Weiss; Marcos Caceres; Mathew Marquis. W3C. The picture Element. 22 July 2014. W3C Note. URL: http://www.w3.org/TR/html-picture-element/