How to optimize images in WordPress
The short answer
WordPress handles responsive image sizes and loading attributes, but it does not replace a proper image workflow. Resize and compress images before upload, use WebP where suitable, exclude the hero image from lazy loading, and use a plugin for bulk conversion or an existing media library.
What you need
- WordPress administrator access
- A recent backup of the media library
- An image editor or optimisation tool
- A staging site for changes to a busy website
The fast route
Get Perfect Images Pro
Let Perfect Images Pro do it
Bulk optimization, WebP, lazy loading, and Retina support for image-heavy sites that need both speed and visual quality.
Sources
- developer.wordpress.org /reference/functions/wp_get_loading_optimization_attributes/…
Questions
- Does WordPress optimise images automatically?
- WordPress automatically creates several image sizes and can add responsive image markup, so browsers can select a more suitable file. That is not the same as compressing every existing attachment or converting your whole library to WebP. You still need to resize and export new images sensibly, and a plugin or external workflow is normally required for bulk processing.
- Should every WordPress image use WebP?
- No. WebP is useful for many photographs and graphics, but it is not a reason to ignore dimensions, compression or compatibility. Keep the original source files separately, confirm that your delivery method provides a fallback where needed, and check logos, transparent graphics, galleries and page-builder images after conversion.
- Should I lazy-load the hero image?
- Usually no. The hero or featured image is often visible immediately and may be the page's Largest Contentful Paint element, so lazy loading it can delay the main visual. Keep lazy loading for images below the initial viewport, then inspect the rendered HTML because themes and optimisation plugins can apply conflicting loading settings.
- Why are my images still slow after compression?
- Compression alone may not fix the problem. The page may still request a full-size original, load too many gallery images, lazy-load the hero, use oversized CSS background images, or run several optimisation systems at once. Inspect the actual image URL and file size in the browser, then check whether the displayed dimensions, responsive markup and loading priority match the layout.