Not optimizing images might be the biggest mistake people make which causes their websites to load slowly.
This is because if you’re not careful they can easily make the size of your page HUGE, and the bigger your page is, the longer it takes to load.
For example, if you have 10 images on a page and they’re not optimized, they might be 2mbs each, which means you need to load 20mbs of images. However, if you optimized them to be around 200kb, then you’ll only be loading 2mbs of images, which is the same as 1 unoptimized image!
Here are some easy steps to optimizing your images:
1. Make sure you pick the right file type – if it’s less than 3 colors PNG will be smaller, any more use JPG.
2. Make sure they’re the correct dimensions. For a background image usually 1600px wide will look good on most screens. If it’s used within the content then 600-1000px wide usually works. Have a play around to see how small you can make them without losing quality!
3. Once you’ve found the right dimensions, run them through an image compressor. TinyJPG and TinyPNG are both free an easy to use.
4. If you’re adding illustrations or icons, SVG is likely the best format as they can scale to any screen size without losing quality. WordPress doesn’t let you add these by default because of security concerns, but you can use a plugin like SVG support to get around this.
You could also use a plugin like WP Rocket to display your images in next-gen formats like WebP, which have better compression so the images are smaller size without losing quality.