Modules > Responsive Media > Terminology for Responsive Media

Terminology for Responsive Media

dppx

Dots per px unit. You can effectively think of this as a density multiplier. For example, most Retina screens have twice the display density of normal screens. They have a dppx of 2. In CSS, 1dppx = 96dpi. W3C CSS Values Spec

device-pixel-ratio (dpr)

Number of device pixels per CSS Pixel (non standard, use for Webkit browsers) Made with Drew

dpi

Dots per inch W3C CSS Values Spec

retina display

Retina refers to Apple devices that have a screen with such a high pixel ppi (pixels per inch). Initially they were always 2 dppx, but that is not necessarily the case any longer. Apple owns the word Retina so it technically only refers to Apple products.

intrinsic dimensions

Reference to the set of the intrinsic height, intrinsic width, and intrinsic aspect ratio (the ratio between the width and height) for an image or object. These intrinsic dimensions represent a preferred or natural size of the object itself. W3C CSS Image Spec

intrinsic height

Natural or preferred height of the image or object. W3C CSS Image Spec

intrinsic width

Natural or preferred height of the image or object. W3C CSS Image Spec

intrinsic aspect ratio

Natural or preferred aspect ratio of the image or object. Aspect ratio is the ratio between the width and height. W3C CSS Image Spec

ldpi, mdpi, tvdpi, hdpi, xhdpi, xxhdpi and xxxhdpi

Names for various categories of dppx for Android devices. Note how there are many of them because there are so many devices in the Android eco system.

resolution (in CSS media query)

describes the resolution of the output device, i.e. the density of the pixels. Most common units are dpi (dots per inch) and dppx (dots per px unit). W3C CSS Image Spec

Modules > Responsive Media > Terminology for Responsive Media