Oversized images are the most common cause of a slow page. The fix is simple: serve images close to the size they are displayed, at a sensible compression level.

Match the display size

Find how wide the image appears in your layout, then double it for high-density (Retina) screens. A photo shown at 600 px wide should be exported at about 1200 px. Anything beyond that is wasted bytes. Use the Image Resizer with the aspect-ratio lock on.

Pick target file sizes

  • Thumbnails: under 30 KB
  • In-content photos: 60–150 KB
  • Full-width hero images: under 250 KB where possible

Then compress

After resizing, run the file through the Image Compressor and choose WebP or JPEG at around 75–80 quality. For a whole folder, the Bulk Image Resizer applies one width to every file.

Keep proportions

Never change width and height independently unless you mean to crop. Stretched images look unprofessional. If you need an exact shape, crop with the Image Cropper instead of squashing.

Share this article: Twitter LinkedIn Email

Looking for a tool to try out what you just read? Browse the full tools catalog.