132 ppi? 72 dpi? 144? 264 ppi? What image resolution should you use for the new iPad with Retina display?

Wed, Mar 14, 2012

Digital Publishing, How-to, Learn, Tip

There was an interesting question on the Quark Forum: http://forums.quark.com/t/27985.aspx

Bottom line, what resolution is ideal for the iPad and what to do now for the NEW iPad (with Retina display)? And I am sure, like the original poster, most of us heard the rule to use “72 dpi” (which should be ppi of course) when designing for screen. The 72 dpi you hear a lot results from 1) the misunderstanding about dpi and ppi (dots and pixels) and 2) monitors historically having a resolution of 72 ppi. By the way, modern monitors have much more — the Retina display of the new iPad uses 264 ppi.

So what’s the best resolution for designing for tablets?

If you are interested in the background and exhaustive explanation, then please read this excellent blog post, which my colleague Sarbjit referenced: The Myth of DPI

If you just want to hear the bottom line, my advice is:
Forget resolution. Use pixels.

That means if you want to use a picture fullscreen on the iPad 2, make sure it has 1024 x 768 pixels. For the new iPad? Twice as many pixels in both directions (2048 x 1536 pixels). Resolution? It doesn’t matter: use any. (For Print of course that’s a completely different story.)

Have a look at the following example, where I used the same photo just using a different resolution each time — the last one even having only 1 ppi (yes, ONE ppi, no typo). Do you see a difference?

Screenshot of an iPad2 showing the same motive with different ppi values

Screenshot from an iPad 2 showing the same photo using different resolutions but always the same pixel count (click to see full image)

And don’t let anyone tell you that ppi has an influence on file size when you keep the same amount of pixel. So as I kept the number of pixels exactly the same for all four examples, they all even have the same file size. Try in Photoshop yourself (deselect “Resample” obviously), when you change the ppi value and the pixel count stays constant, only the output size changes.

Feel free to download the issue (.zave) to see for yourself on an iPad using Quark AVE Publishing using the Quark AVE Issue Previewer:

Click to download iPad issue

If you want to have the original QuarkXPress document, please send me an email.

 

Create as many apps as you want – for free, from your Desktop?

Export_As_iOS

, , ,

This post was written by:

- who has written 78 posts on Planet Quark.

Both an engineer and a layout artist, Matthias bridges the gap between technology and people. - Before joining Quark, Matthias pioneered print, Web, and multimedia products for multiple German publishing companies. Since 1997 he has played a central role in shaping Quark’s desktop and enterprise software. Starting 2003 Matthias has focused on Quark's interactive and digital publishing solutions. He is an active participant in design and publishing communities and represents Quark in the Ghent PDF Workgroup. - Matthias is a frequent speaker at seminars and conferences worldwide, helping both individual designers and large organizations to uncover the possibilities and implications of digital publishing, including the business considerations, design and technology implications, and business capabilities offered by digital design and publishing tools. - Since February 2014 Matthias heads Quark's Desktop Publishing business unit and is therefore responsible for QuarkXPress.

Contact the author

8 Responses to “132 ppi? 72 dpi? 144? 264 ppi? What image resolution should you use for the new iPad with Retina display?”

  1. Alan Says:

    So what is the point of the new retina display if it isn’t actually higher resolution?

    I design a 1024×768 image in Photoshop so it fills the screen on iPad 2’s. Someone has a fancy new iPad with twice the resolution, in the same amount of space, so it looks tiny and they have to zoom in to see it, and we are right back to the iPad 2….

  2. Matthias Guenther Says:

    Hi Alan,

    the Retina display shows more pixel (thus smaller) on the same area. Sure, that means a higher resolution and my sole point was, forget bout resolution, care about pixel.

    Imagine you want somebody to give you an image for the new iPad, will you tell them, please give me an image with 264 ppi?

    It’s much easier to tell them to give you an image with 2048×1536 pixel (and then it does not matter at all what resolution Photoshop lists there, 72 ppi or 264 ppi).

  3. Fredrik Says:

    Thank you very much for this post!!

  4. jose pacheco Says:

    What Mat told us here is true. In my understanding using pixels you´ll never fail the size. Although the 72 ppi is the density pixeis needed for all screens. Our eyes perception cant understand much more then 72ppi (or 72 is the picel density needed to understand the image through the screens). Although if you save your images with more ppi resolution im sure when it comes to print from the ipad or other suports you´ll get more a clean and cristal images size it aprouches from 300 ppi needed to print :D

  5. Cynthia Nugent Says:

    Thank you very much for this article. I also found your link to “The Myth of DPI” extremely helpful. I’m moving from children’s books print to children’s book apps and found this topic difficult to understand. I feel a lot clearer now and am very grateful to you.

  6. Andrew Says:

    This can be very simple by thinking in pixels, e.g. 800×600, forget pixels per inch / dots per inch(both translate into the same unit of measurement), they are irrelevant for displaying images on a monitor at 100% unless you want to display an image by physical measurement such as 5″ x 4″(using a real measure, not in-software) you can ignore DPI.

    If you create an image to display at a particular physical size, say 5″ x 4″ at 100% zoom on your monitor it will be a different physical size on different monitors anyway unless the monitors are identical in physical size and resolution, however it will be the same pixel size regardless of the monitor.

    An image which is 1024×768 pixels zoomed at 100% will fill the screen of a Monitor with a resolution of 1024×768 regardless of the images DPI value.

  7. Lee Says:

    I’m just starting in on this, but my interest is in zoom factors.

    Presumably if I want the image to be sharp at the highest zoom factor, say 300%, I will need to produce imagery with pixel density at 3x iPad dimensions.

    So for the iPad 1 or 2 I will need to create imagery at 3 x (1024 x 768) ie 3096 x 2304px

    And for the retina screen I will need it to be 3x (2048 x 1536) or (6192 x 4608)px

    That still makes for large files, no?

  8. Matthias Guenther Says:

    Hi Lee, yes, of course, if you enabling zooming on the device you need to adjust your pictures accordingly, so double the pixels when you allow zooming to a factor 2. And of course that makes larger files (double the resolution = quadruple the size).

    However for digital devices like tablets you should consider if zooming is necessary. Except for some special cases (Google Maps, pictures that have a lot of detail to discover etc.) zooming is typically a bad user experience and hinders your storytelling.

    Imagine a magazine or newspaper where you need to zoom on every page to read type, as maybe it has just been converted from print to tablet. Which reader really wants to do that for each article?

    So zooming, yes, increases file size, but if you use it selective it is not that bad. And alternatively you can always consider to put the larger images online and notify your readers that the offline version only shows the normal picture.

Leave a Reply

You must be logged in to post a comment.