So the 72 PPI rule is a myth for exporting files to the web. No matter what your resolution is, the image will appear the same on the web. If that’s the case: 1. why do my exports vary in quality/size depending on the resolution I export them at, and 2. what PPI should I be exporting files for the web?
Pixels per inch have nothing to do with the web because the web isn’t built on fixed measurements. As a result, there can be no amount of pixels in an inch because an inch doesn’t exist.
The only thing that matters are the number of pixels in the image for the space you’ve made for it. If the space you’ve allocated for a photo is, say 800 pixels wide, make the artwork 800 pixels wide. Save it at any PPI you want — the results will be the same.
How many pixels you cram into a linear inch is only relevant when you print out the file onto a physical surface where an inch means something. In print, the resolution should be around 250–300 pixels per inch to keep it from looking blurry at arm’s length. On an electronic display, where there’s no such thing as a fixed-size linear measurement, as I said, all that matters is that you allocate an adequate number of pixels for the space you’ve created.
72 PPI is good for web graphics.
So is 144ppi
Any much higher than that and you run the risk of other people stealing your imagery and using it for their own nefarious purposes. Adequate won’t stop them, but better than adequate will encourage them.
Dealing with that right now with a stock image…
People still steal at 72ppi with a watermark and blow up to A1 and A0 sizes… it happens
As is 5 ppi or 50,000 ppi or, as Smurf2 said, 144ppi.
Some things in design are based on opinions that differ from one person to the next. This subject, however, isn’t an opinion. PPI is utterly, totally, and completely irrelevant to website imagery.
I’ll restate in another way what I’ve already said. Inches, centimeters, picas, furlongs, or whatever are real-world measurements that mean absolutely nothing on a website. An 800x800 image saved at 72 ppi or 7200 ppi is exactly the same — an 800x800-pixel image.
In print, if you have a 2x2-inch space in which to position a photo, you specify in Photoshop the pixels per inch (PPI) you want and the physical dimensions. From that Photoshop calculates the number of pixels to include in the files.
For example, if your halftone frequency is 150 lines per inch (150 lpi), you might want to include 300 pixels per linear inch. From this, Photoshop figures out how many pixels are needed for the image, which in the case of this hypothetical, 2x2-inch image, would be 600x600 pixels.
However, the web isn’t a real-world environment. It’s a virtual environment in which real-world measurements of physical space don’t exist. Inches, centimeters, and other physical measurements do not exist except in relation to how they will print to a physical product, such as a piece of paper.
However, the web has no physical end product. It exists solely as a bunch of pixels arranged on a computer display. The same image might display large on one monitor, but small on another.
Because of this lack of fixed, physical dimensions, those kinds of measurements are meaningless on the web. Instead, website measurements are specified in pixels, which aren’t fixed measurements at all. Instead, they’re a reflection of the data contained within the file, which are displayed at different sizes depending on the resolution of the monitor.
The bottom line in this is that images, for computer display purposes, are measured in pixels — there is no PPI.
Because somewhere in your workflow you’re incorporating meaningless print measurements, and whatever image processing app you’re using is processing your images with print considerations in mind. If I had a better idea of how you’re creating these images, I could probably tell you want you’re doing wrong, but without that information, all I can say is that you’re preparing and/or saving them the wrong way.