The short answer
- Photographs: JPG, or WEBP if the place you are uploading to accepts it.
- Screenshots, logos, text and anything with sharp edges: PNG.
- Anything that needs a see-through background: PNG or WEBP.
- Websites where speed matters: WEBP, with JPG as the safe fallback.
JPG
JPG is lossy. It throws away detail your eye is unlikely to miss, which is why a photograph can shrink to a tenth of its raw size. It cannot store transparency, and saving a JPG again and again slowly degrades it. Quality settings between 70 and 85 are the usual sweet spot.
PNG
PNG is lossless: every pixel is kept exactly. That makes it ideal for screenshots, diagrams and logos, and it supports full transparency. The price is size. A photograph saved as PNG is often five to ten times bigger than the same photograph as a JPG.
WEBP
WEBP can be lossy or lossless and supports transparency, so it can stand in for both of the others. At a similar visual quality it is typically a quarter to a third smaller than JPG. All current major browsers display it. Some older programs, email clients and upload forms still do not accept it, so check before replacing files you have to submit somewhere.
Converting between them
Converting does not recover quality that is already gone. A JPG saved as PNG is a bigger file that looks identical. Converting JPG to WEBP, or the reverse, adds a little more loss each time, so always work from the original. You can convert in your browser with the image converter, or use a specific pair such as PNG to JPG or JPG to WEBP.
What about GIF and AVIF?
GIF is limited to 256 colours and is only worth using for simple animation. AVIF compresses even better than WEBP but is slower to produce and less widely accepted by software outside browsers.