When a site is slow, images are the first place I look. Not because they are always the cause, but because when they are, fixing them is cheaper than anything else.
Pick the right format
JPEG and PNG still work everywhere, but WebP usually gives the same quality at a far smaller size and is supported across every modern browser. AVIF is smaller still, though slower to encode.
For logos, icons and anything made of lines and geometry, don't use an image at all — use SVG. It stays sharp at any size and is usually a few kilobytes.
Send the size you actually display
The most common mistake I find: a 4000px-wide photo shown in a 400px frame. The browser downloads all of it and then shrinks it. The visitor pays ten times over and sees nothing for it.
Declare the dimensions
Every image needs a width and a height. Without them the browser can't reserve the space, and the page jumps when the file lands — which is exactly what CLS penalises.
Lazy-load, but not everything
Images below the fold should carry loading="lazy" so they aren't fetched until needed. Never lazy-load the main image at the top: that one is usually what defines your LCP, and deferring it makes the score worse.
A quick test
Open your browser's developer tools, go to the Network tab, reload, and sort by size. If the largest few entries are images, you know where to start.