First, one should understand that PPI, and subsequently DPI, really only matter for printing. They have no real bearing on images destined for the web or displays. PPI of web images doesn't matter. A 500x500px image set to 300ppi or 72ppi, it's still a 500x500px image in a browser. SEE HERE
The Resample checkbox means a lot....
With Resample checked:
Photoshop will add or remove pixels to the image (interpolate) in order to maintain the physical width and height and then match the desired PPI. You may start with 30,000 pixels, but after changing the PPI value you will always have more or less pixels than that original number. Resample checked tells Photoshop that the physical dimensions are important and to maintain those by adding/removing pixels.
- If you make pixels more dense, meaning increase the PPI, those original 30,000 pixels will fill less space - the physical dimensions (w x h) of the image will stay the same. Photoshop must generate new pixels through interpolation to supplement the original number of pixels in order to fill the allotted image space. One may think this somehow "improves" image quality. However, because Photoshop interpolates to add new pixels, more pixels do not always result in a "better" quality image.
- If you make pixels less dense, meaning decrease the PPI, those original 30,000 pixels will fill more space - the physical dimensions (w x h) of the image will stay the same. Through interpolation Photoshop throws away left over pixels then forces the remaining pixels to fill the desired physical dimensions (w x h) of the image - this always results in image degradation because you are throwing away pixel data.
With Resample UNchecked:
- Photoshop attempts to maintain the same number of pixels in the image. If your image contains 30,000 pixels, after changing the PPI value, it will still have 30,000 pixels. Photoshop will essentially ignore the PPI setting for the pixel dimensions and keep the original amount of pixels. The physical dimensions will change as PPI changes (condensing or expanding the existing number of pixels). Resample UNchecked tells Photoshop that the pixel count is important and to maintain the pixel width and height at all times.
- When you increase the PPI without resampling, Photoshop keeps the pixel dimensions of the image the same - there are still only 30,000 pixels. Photoshop then tells those 30,000 pixels to divide by the new PPI value, which will cover less space if printed. This causes physical dimensions of the image to change - more condensed pixels mean the physical size must get smaller to hold the 30,000 pixels properly. PPI is irrelevant for web images, there are still only 30,000 pixels, so the pixel dimensions do not change.
- When you decrease the PPI without resampling, Photoshop keeps the pixel dimensions of the image the same - there are still only 30,000 pixels. Photoshop then tells the 30,000 pixels to divide by the new PPI value, which will cover more space if printed. This causes physical dimensions of the image to change - less condensed pixels mean the physical size must get larger to hold the 30,000 pixels properly. PPI is irrelevant for web images, there are still only 30,000 pixels, so the pixel dimensions do not change.
In short, the Resample checkbox tells Photoshop what is important - the pixel dimensions or the original image quality (pixel count).
The reason you are seeing a size change...
- Resample is checked
- The preview is showing the pixel dimensions of the image
- You are decreasing the total number of pixels in the image.
If you viewed the physical dimensions (inches/cm/mm) you'd see that those dimension are not changing. Essentially, the size change for the pixel dimensions is a way for Photoshop to tell the user changes will ensue. You are decreasing the PPI, so there are less pixels and less pixels means the pixel dimensions must get smaller.
Pixel dimensions are not an indicator of quality. Pixel dimensions are merely the size of each pixel in a row set next to one another. Obviously 300px next to each other will create a larger image than 72px next to each other when printed.
Sheer speculation ..... Really, I think the preview size change is there when PPI changes to actually try and force users to question what's going on. If a user is working on a print-destined image, change the PPI, and they see the size change - they stop. Just like you have, and question what's taking place. I speculate it's more of a "fail safe" thing to hopefully make users review the dialog settings. After all, decreasing the PPI for any image destined for print is generally an error. For printing, after decreasing the PPI with resample checked, those fewer pixels must fill the same existing physical dimensions of the image - the printed image quality will be considerably degraded, if that's a concern. So the size change is showing the detrimental change in a sort of roundabout manner.
If you want specific pixel dimensions for web images, change the pixel width or height, don't change the PPI (PPI is irrelevant for web images anyway). Or, if you do change the PPI, merely set the pixel width and pixel height to what you want after changing the PPI. Photoshop will interpolate and reorder the pixel data to match the desired settings. This will be detrimental to printing the image. But you don't want Resample checked if you are working on print images.
When to use either....
For web images...
- Check Resample and adjust the pixel width or pixel hight to what you need. Ignore the PPI value, it doesn't matter. Or change the pixel width and pixel height after altering the PPI. Photoshop will reorder the pixel data to match the desired settings.
For print images....
- UNcheck Resample and adjust the PPI to what you need. Ignore the pixel dimensions, they don't matter. Be aware, it is not possible to arbitrarily increase the PPI of any image in order to get a print quality image. In order to maintain image quality, you want Photoshop to not add or remove pixels (interpolate). You may then need to consider other things due the physical width and height changes instigated by any PPI change.
An image destined for both ....
- Alter the original image as a print-destined image. That is, keep the high PPI and print size you need for printing. Then use
Export As..., or
Save for Web.. and enter the pixel dimensions you want for the image in the subsequent dialog window which opens. That's why those features exist. When you adjust the pixel dimensions within one of the dialog windows, Photoshop does resample the image as if Resample is checked (meaning it interpolates the pixel data), but Photoshop does not resample or alter the original image - keeping the print quality image still print quality. Essentially, Photoshop interpolates and then "saves a copy" through the
Export As... or
Save For Web.. dialog windows retaining the original image and its original quality.
I think the important missing factor in the question may be why are you changing the PPI value. For web images, it doesn't matter and you should just use
Export as... or
Save for Web.... For print, 72ppi is always unacceptable and decreasing the PPI will only degrade the image quality.
If you want the pixel dimensions to stay the same when you adjust PPI values.... untick Resample. But then... why change the PPI at all.
If the gaol is to merely "strip away" the extra pixel data at 300ppi... tick Resample, set the PPI to 72, then reset the pixel width and pixel height to what you want after altering the PPI. You'll kill the print quality of the image, but you'll get the web resolution and size you want. It's much easier just to Export or Save For Web (which will do the same thing) rather than degrading the high quality image.