3

Ubiquity of display pixels (dp) as industry term

over 7 years ago from , Product Designer

I noticed that in Google's Material Design Guidelines they use "display pixels" rather than "pixels" to deal with hdpi displays. I've also heard - I think Apple - use "points" (pt). Is there an accepted industry term for this?

3 comments

  • Adam Brenecki, over 7 years ago (edited over 7 years ago )

    I don't think there's a ubiquitous term, probably because there's not even a ubiquitous unit - Android density-independent pixels (dp) are 1/160" (≅0.159 mm), the CSS px unit is 1/96" (≅0.265 mm), and iOS points - which are actually a real-world unit - are 1/72" (≅0.353 mm).

    (Obviously, these units won't map exactly to those inch/mm lengths on every screen - that's not what they're for - the point I'm making is that something 100dp big is going to be roughly half as big as something 100pt big on an identical screen.)

    Personally, I'm just waiting for the day when high-DPI displays are so high-DPI and so ubiquitous that I can stop thinking in pixels altogether and start specifying everything in mm.

    2 points
    • Brent C, over 7 years ago

      This is super helpful. I guess I'll just keep labeling my designs with "px" for now.

      With that last note about measuring things in mm, one thing that might arise is that different users might want to have the interface more or less dense. I guess as a designer you could just give an optimal mm count, with everyone being on the same page that the platform might shrink or expand it. Measuring everything as Optimal Millimeter (OM or OMM) would probably be semantic overkill.

      1 point
      • Adam Brenecki, over 7 years ago

        That's actually pretty much how the Web works right now! When you zoom in or out in most modern browsers, they appear to essentially multiply every length value (width, height, font-size, border-radius, etc) by the zoom factor.

        Actually, when you take things like media queries into account, the effect is more like rendering to a smaller but correspondingly higher-DPI display, in Chrome at least - zoom in enough on a responsive site like DN and you'll eventually get a huge version of the mobile site - but that's probably closer to what you actually want to happen anyway! If you say "this is what the site should look like on devices ≤320px (or ≤110mm) wide", and your user with their 640px (or 220mm) screen says "make everything twice as big as normal", you probably want them to see the small-screen styles rather than making them scroll horizontally.

        (It used to be the case that zooming would only change the calculated root font size, which is why specifying everything in px used to break zoom and you had to use em, but I don't think any browsers do this anymore.)

        0 points