The Internet has been around for years now, and the print world has been trying to get into this bubble for years, causing misunderstandings between our two worlds.
What is the Dpi of an image?
The Dpi (Dots per inch) is a value defining the quality of printing of a document, indicating the number of dots to print per inch. We can therefore deduce that the higher this value is the better the printed image will be. This point is not completely true since it will depend on the technique of impression used, it is for that reason, that since the advent of the digital impression and the digital cameras, one considers that the "resolution" perfect for an image will be 300 Dpi.
I'm not going to extrapolate on the subject that concerns photographers and printers, who I hope have all the necessary knowledge on this point.
You can find a more in-depth approach to the definition of Dpi on wikipedia.
What Dpi for the images on my site?
Starting from the approach defined above, we can legitimately ask ourselves what DPI we should apply to our images on our websites.
If you've done your research, you'll know that a computer screen is considered to have a display resolution of 72 DPI, so we can say that our images, in order to be displayed properly, must all have a Dpi of 72 in their definition. Unstoppable logic and that we all applied in the 90s to modify all our images to have this resolution.
Except that all this is totally useless since this Dpi value is only used to print a document.
Thus, if your image is defined in pixels, as is the case on the Internet during the development of your site, you can change to any value the Dpi, the image will always have the same weight and the same dimensions on the screen of your computer.
An image of 640x480 pixels, whether at 72 Dpi or 300 Dpi, will always be 640x480 pixels. However, if you want to print it, the first one, at 72 Dpi will measure 22.578x16.933 cm while the second one will measure only 5.419x4.064 cm, since the concentration of dots will be more important.
What emerges from all this is that you must absolutely banish the notion of Dpi from all your web productions and focus only on the pixel dimensions of your images.
An image of 640x480 pixel will never change with the Dpi on your screens which are defined in pixels.