Kelvin
Kelvin

Reputation: 585

Image resolution for web design on both desktop and mobile

I plan to have both desktop and mobile web design, for desktop, most the screen resolution is 72dpi, how about mobile?

As most photo taken is 300dpi resolution, is it the best practice to downgrade the image to 72dpi instead of keeping it as 300dpi in order to speed up the download time?

Upvotes: 0

Views: 1183

Answers (1)

Jake
Jake

Reputation: 1217

Mobile Device screen resolutions and ppi's:

iPhone3               320x480  163 ppi
iPhone4               640×960  326 ppi
iPhone4S              640×960  326 ppi
iPhone5               640×1136 326 ppi
iPhone5C              640×1136 326 ppi
iPhone5S              640×1136 326 ppi
iPad                 1024x768  132 ppi
iPad2                1024x768  132 ppi
iPad (3gen)          2048x1536 264 ppi
iPad (4gen)          2048x1536 264 ppi
iPad Air             2048x1536 264 ppi
iPad mini            1024x768  163 ppi
iPad mini (retina)   2048x1536 326 ppi

I believe it is still pretty standard to use 72dpi for images, unless the site is focussed on design/photography where the users will notice the difference.

Keeping it at 72dpi MAY reduce load times as mentioned and there will be little to no visible difference in the image quality.

If the image is small to start with there will very little difference in the actual file size.

A good explanation of the difference between ppi and dpi can be found here

Upvotes: 1

Related Questions