: Web Page Resolution with Correct DPI/PPI I am designing a web template/admin panel and need to know, what correct page dimensions should I use and at what DPI? And What Font size will be compatible

@Kevin459

Web pages don't have a resolution as such (as joojaa already pointed out in the comments), because browsers ignore the ppi setting in raster images.

Different devices display images at different sizes depending of on the resolution of the display, or whether any system zoom has been set.

When designing a web page in Photoshop, leave it at the default 72ppi setting. Do not change it, doing so is pointless. Changing it will not give you better quality images. The ppi/dpi setting is not a measure of the quality of an image (a common misunderstanding). For more info read this The Myth of DPI - it's an old article, but still relevant.

All that matters in images intended for the web is the pixel dimensions of the images.

As for which dimensions to use, it depends on what device it will be used on. But in Photoshop CC there are presets available for common web page sizes. Use one of these.



You may wish to create additional artboards/documents for different devices like mobile phones/tablets, to give your developer an idea of how you would like the page to be laid out for these kinds of devices.

There are presets available in Photoshop CC, under the "Mobile" tab when creating a new document for common mobile devices, if you need them.

Vote Up Vote Down