Optimising Images for Web in WordPress

Large images can slow down your website. Optimising ensures they load quickly while still looking sharp.

Step 1 – Resize Images Before Uploading

Use an image editor (Photoshop, Canva, or free tools like TinyPNG) to size your images appropriately:

• Full-width banners: around 1920px wide.

• Content images: 800–1200px wide.

• Thumbnails: 300–600px wide.

Step 2 – Save in the Right Format

• JPG → best for photos.

• PNG → best for graphics with transparency.

• WebP → modern format, smaller file size, good quality.

Step 3 – Compress Images

Use an online tool (like TinyPNG, Squoosh, or ShortPixel) to compress your image without noticeable quality loss.

Step 4 – Upload to the Media Library

Go to Media → Add New in WordPress and upload the optimised image.

Step 5 – Check File Size

After uploading, check that file sizes are reasonable:

• Aim for under 200KB for content images.

• Keep banners and large images under 500KB if possible.

Additional Notes

• Divi supports responsive images, so WordPress will generate different sizes automatically.

• Use caching (e.g., WP Rocket) to improve performance further.

• Always add alt text for SEO and accessibility.