← Back to UltraToolkit | All Posts | Image Tools
Image Tools Eternal Aum LLCΒ· 9 min readΒ· 2025-02-05

The Complete Guide to Image Optimisation for Web Performance

Images cause over 50% of slow web pages. This guide covers compression and resizing to maximise speed without sacrificing quality.

According to HTTP Archive, images account for over 50% of the average web page's total weight. They are the single largest opportunity to improve load time, Core Web Vitals scores, and user experience β€” and they require no code changes, only smart preparation before upload.

Why Image Size Directly Affects Revenue

Google's Core Web Vitals framework includes Largest Contentful Paint (LCP), which measures how long the main content β€” usually an image β€” takes to appear. A score above 2.5 seconds is classified as "poor" and impacts search ranking. Additionally, a one-second delay in page load time reduces conversions by approximately 7% according to consistent research findings. A 3MB unoptimised hero image is one of the most common causes of failing both metrics simultaneously.

Compression vs Resizing

These are distinct operations addressing different problems. Compression reduces file size at existing dimensions by discarding pixel data the eye is least sensitive to. Resizing changes the pixel dimensions. Both are necessary before uploading any image to a website. The correct order is always: resize first to match display dimensions, then compress to optimise file size at those dimensions.

Choosing the Right Quality Setting

The quality slider in the Image Compressor ranges from 0.05 to 1.00. For web use, 0.65–0.75 typically achieves 50–70% file size reduction with no perceptible quality degradation. For hero images where detail is critical, 0.80–0.85 maintains excellent quality. For thumbnails and decorative elements, 0.50–0.60 is entirely sufficient. Always review the live preview at your chosen setting before downloading.

Practical File Size Targets

Blog post hero images: under 200KB. Product images: under 150KB. Thumbnails and listing images: under 50KB. Full-screen background images: under 400KB. Icons and logos: under 20KB β€” and ideally served as SVGs rather than raster images, which scale without quality loss. Use the Image Resizer to hit exact pixel targets, then compress the result.

Try the Free Tools

14 free, browser-based utilities. No signup, no data stored, no limits.

Explore All Tools β†’
← Back to UltraToolkit All Posts β†’