Image size advise please

[tvalleau (Tracy Valleau)]

setting dpi or ppi for a website has NO effect whatsoever on the displayed image. DPI/PPI - the PI is Per Inch. That has no meaning on a monitor - it’s a PRINTER thing.
Web browsers do not pay any attention to a PPI setting, any more than they do to a DPI setting.

Here’s how it works: your image dimensions are your image dimensions forever. They are fixed. So an image that is 1000 x 2000 will always be 1000 x 2000.

If you use 300 DPI, then that image will -print- at 1000/300 = 3.3 inches wide and 6.6 inches tall. If you print that image a 72 DPI it will print at 1000/72 = 13.8 inches wide and 27.6 inches tall.

Yet if you “print to the screen” in a web browser the images will both be the same size. That’s because the browser is using the image dimensions NOT the dpi/ppi associated with the file, The setting for “per inch” has no effect in a browser.

Look at it the other way: if you say 5" x 7" at 300 ppi or dpi, that image will still be exactly 1500 x 2100… and will look exactly the same on any given browser.

I do this a lot, both as a photographer whose works are shown in museums, and as the web developer for the famous photography.org site. In both cases I’m dealing with 10s of thousands of images.

Here’s an old post of mine with pictures and a long-winded explanation.

https://www.valleau.art/blog/archives/299

(Don’t feel bad: it confuses lots of folks…

[tvalleau (Tracy Valleau)]

How to make the image smaller.

You can do this two ways:

1)Cut down the dimensions. (I’ve never used an image that is more than 1900 wide, and typically never find a need for anything more than 800 pixels.

2. make sure you’re using .jpg or .png

3. compress the image using a lossy but high quality compressor app. My choice is optimage for best lossy quality.

Changing the “resolution” (DPI, PPI) will not change the file size at all. You’re just sticking in a bit of metadata. The only way it will change the file size is if you are starting out by aiming at an INCH dimension. (Which, again, makes no difference except for printing.

So: yes - setting your program to 5" x 7" output at 72 dpi -will- make a smaller file (360 x 504, while 5 x 7 at 300 dpi will be a file that is 1500 x 2100.)

But taking that 1500 x 2100 file and simply appending metadata that says “@72ppi” will have ZERO effect on the file size or how it displays in a web browser.