What is the difference between dpi and ppi?

Thursday, 01 June 2023

3372 Hits

Difference between dpi/ppi - pixelated pictures

A picture is worth a thousand words - but only if you actually recognise something. If a picture is "pixelated", it could be difficult. To make sure that everything looks the way you want it to, we explain what pixels are about and how mistakes can be avoided when printing pictures or sending digital images.

Dpi stands for "dots per inch" and is a measure of spatial dot density - especially in printing. It is the number of dots per inch, whereas one inch corresponds to 2.54 centimetres.

The abbreviation ppi stands for "pixels per inch" and refers to digital image display. Pixels are clearly defined colour dots in a fixed grid. However, the terms dpi and ppi are mostly used interchangeably nowadays. Image formats with grid pattern extensions are e.g. JPEG, GIF and PNG.

If images in flyers, brochures or other printed products are "pixelated", this is usually due to a too low dpi value, i.e. a too low dot density. During the printing process, printers split an image into individual dots, which then make up the entire printed image. If the dpi value is not sufficient, the image appears blurred or pixelated because the possible print resolution is not fully used.

dpi when printing

dpi wehn printing

For printable files, a dpi resolution of 300 is considered a good benchmark. If a digital image is to be printed in DIN standard A5 for example, 1754 x 2480 pixels per inch are required at a 300 dpi resolution. For a larger print size, more pixels are needed in width and height.

To calculate the image resolution, there are various pixel calculators on the internet.

Rule of thumb is: dpi = horizontal number of pixels of the image x 2.54 / width of the image in centimetres.

The resolution can be displayed by any image editing programme. In Windows Explorer, for example, this can be done by right-clicking on the image. The dpi value can be found in the properties under "Details".

dpi/ppi on the web

The dpi value is relevant for printing, whereas for digital images in general and on the web only the size of the image is decisive, because on screens only pixels are relevant. For example, an image with a size of 800 x 600 (i.e. 800 pixels in width and 600 pixels in height) is displayed on the screen with exactly these pixels. A 25-inch screen with full HD resolution (1080 x 1920 pixels) displays the image larger than an identically sized screen with 2K resolution (2048 x 1080 pixels). The maximum quality is always derived from the available image information, regardless of the dot density stored in the image.

Pixels do not have a fixed size; the size of a pixel depends on the screen. Modern screens have an ever-increasing resolution, so that one and the same image is displayed in a smaller size with a higher pixel density.

The original file should be saved in the highest possible resolution and suitable images should be generated in the correct resolution for web and print.

For websites, the bigger the image, the longer the loading time. Long loading times are a problem for a website, as bounce rates are increased. In addition, long loading times ensure that search engines such as Google rank your own homepage further down in the search results list. Therefore, the lowest resolution that still makes the image look sharp is aimed for on the web: 72 ppi or dpi.

If you want to print your images in the best possible quality, you should save originals with a preset 300 dpi value and use them for printing with or without transparencies in .tiff or .jpg format

This table summarises which dot density is suitable for which application:

Possible applications	Dot density
Images for magazines, brochures, flyers	300 dpi
Images for posters up to DIN A2 (German industrial standard, viewed from a distance of up to 1 metre)	100 dpi
Images for larger posters (viewed from a distance of more than 2 metres)	60 dpi
Images on the Internet	72 dpi/ppi

Vector graphics

With vector graphics, the overall situation is somewhat different. A vector graphic does not store the image information in pixels, but the individual elements are stored in image descriptions. For example, a circle in a vector graphic is not composed of pixels aligned to a grid. In vector graphics, the information consists of the position of its centre point, the diameter of the circle and the colour. Vector-based graphics are therefore scalable and the image information does not change. Image and edges remain pin sharp and can be enlarged without any loss of quality. Vector graphics are often used for logos, for example, which are required in different sizes. Vector graphics have file extensions such as EPS, AI or SVG. Read more about image formats and vector graphics in our blog post JPG, PNG, GIF & Co – What image file formats exist and what are they used for?

Cavok Digital Asset Management for always using the right image

Managing image files with different resolutions and formats can be complex, but the Cavok digital asset management software simplifies manging images with different resolutions and formats. A programming interface ensures fully automated processes, thus saving effort and time. By default, metadata such as resolution, colour tone, file format, mirroring, rotation and pixels are stored for images. Individual requirements can be additionally saved and retrieved as needed. The software enables you to convert digital assets into a specific formats and sizes. Furthermore, you can mirror or rotate images any time. This allows images to be downloaded for different media with specific requirements. For example, if a car manufacturer needs images of a vehicle for advertising purposes in different formats for different media such as flyers at 300 dpi with CMYK colour information or for the web shop at 72 dpi in the RGB colour system, he or she can exactly define these requirements in the digital asset management system. Cavok guarantees that the original assets are retained in the highest quality.