For most WordPress images, start with WebP. Use PNG when you need transparency or true lossless output, keep JPEG when compatibility or an existing photo library matters, and evaluate AVIF when your WordPress version, server image library, CDN and audience support it. No format wins for every image. Compare the delivered file at an acceptable visual quality, then verify what WordPress actually generates and what visitors receive.
Quick format decision
| Format | Best fit | Important WordPress check |
|---|---|---|
| WebP | General photographs, illustrations and site images where modern compression and broad browser support are wanted. Supports lossy and lossless compression, transparency and animation. | WordPress has documented support since 5.8. Confirm whether your configuration creates WebP sub-sizes or serves converted files. |
| JPEG/JPG | Photographic originals, existing media libraries and compatibility fallbacks. | WordPress can create WebP versions from JPEG uploads while retaining the original JPEG, but your active configuration determines what is delivered. |
| PNG | Logos, interface artwork and other graphics that require transparency or lossless output. | Compare the resulting size and confirm that conversion preserves transparency and sharp edges. |
| AVIF | Sites seeking modern compression and willing to validate the complete server and delivery chain. | WordPress 6.5 support depends on the server’s Imagick or LibGD capability. Test uploads, thumbnails, caching and fallbacks before making it your only format. |
| GIF | Existing animated assets or workflows that specifically require GIF compatibility. | Compare playback and size with animated WebP; the right choice depends on the asset and audience. |
These are starting points, not a universal ranking. A small transparent logo can be larger as WebP than as PNG, while a photographic JPEG may shrink substantially when encoded as WebP or AVIF. Judge the actual file that reaches the browser.
What WebP changes in WordPress
WordPress documentation says WebP images are around 30% smaller on average than equivalent JPEG or PNG files. That is an average, not a promise for any individual image, encoder setting or quality level. WordPress Core separately described roughly a 30% reduction against JPEG at the same visual quality for its WebP comparisons.
WebP support is documented from WordPress 5.8 onward, and modern browsers support the format. WebP can represent photographic images, transparency and animation, so one extension can cover many ordinary website jobs. You still need to inspect your media workflow: uploading a WebP file does not automatically prove that every thumbnail, responsive size or CDN object is WebP.
The Tool Desk
Outbyte PC Repair FREEClear out junk files and repair common Windows errorsFree Scan →Outbyte Driver Updater FREEFix the driver behind crashes, sound loss and screen glitchesFind Drivers →#1 Best Overall
Originals and generated sizes are different decisions
WordPress normally creates sub-sizes in the original image format unless the site changes that behavior. Its Core WebP workflow can create WebP versions of a JPEG and its sub-sizes while keeping the original JPEG. Those descriptions are not contradictory: the result depends on the WordPress release, image editor, filters and optimization setup deployed on your site.
If a developer changes the image_editor_output_format filter, generated output can use a different format. Treat that as a site-level configuration change and test existing and newly uploaded media separately.
When JPEG is still the sensible choice
JPEG remains useful as a photographic source, an established-library format and a fallback for delivery paths that do not use WebP or AVIF. Keeping the original can also simplify reprocessing when you later change quality or output rules. Do not convert a JPEG merely because a newer extension exists: compare the visual result, dimensions and delivered bytes.
Use a fallback deliberately
If your front end uses content negotiation or a <picture> element, retain a JPEG or PNG alternative when part of your audience or infrastructure may not decode the preferred file. Verify the response in the browser’s network panel and through the CDN, rather than assuming the source extension tells you what visitors received.
When PNG is the better answer
Choose PNG when transparency, crisp flat-color edges or lossless pixels are essential and the resulting size is acceptable. Interface graphics, logos and screenshots with text can show artifacts when aggressively compressed, so compare at the display size that matters.
WordPress lists PNG and WebP among supported types, but support for a MIME type does not guarantee that a particular host can decode, resize, convert, cache or serve it correctly. After any conversion, inspect transparent areas, fine text and one-pixel lines.
Should you use AVIF on WordPress?
AVIF is worth evaluating when storage or delivered size is important, but it is conditional rather than automatic. WordPress 6.5 added AVIF support only when the server’s image-processing library supports it; WordPress specifically names Imagick and LibGD. A host can therefore run the same WordPress version as another site and still produce a different result.
A safe AVIF rollout
- Check the deployed WordPress version. Do not infer capability from a local development site or a plugin’s marketing label.
- Verify the server image library. Confirm that the active Imagick or LibGD build can decode and encode AVIF, not merely that WordPress lists AVIF as a MIME type.
- Upload representative files. Test a photograph, a transparent graphic and a large image that creates several responsive sizes.
- Inspect every generated size. Confirm that thumbnails are created, URLs are valid and no size silently falls back to another format.
- Test delivery and fallback. Check the actual response from the public page, CDN and cache after purging old objects.
- Review visual quality. Look for banding, ringing, halos, text damage and missing transparency at the sizes visitors use.
The current WordPress client-side media-processing documentation describes browser-based handling for JPEG, PNG, GIF, WebP and AVIF, with the full pipeline limited to supported Chromium-based browsers and server-side fallback where browser processing is unavailable. Because that path depends on the deployed release and browser, confirm what your own editor actually does before documenting it as the site’s standard.
Animation: GIF or animated WebP?
Keep GIF when an existing workflow or compatibility requirement depends on it. WebP also supports animation, so an animated WebP may be a more efficient alternative for a suitable audience. Compare playback, dimensions, transparency and delivered size for the specific animation; do not assume that changing the extension preserves animation or improves it.
How to choose by image job
Photographs
Export a WebP candidate and, if your stack supports it, an AVIF candidate from the same source. Compare them with the JPEG at the same displayed dimensions and an acceptable visual quality. Keep the original source so you can re-encode later.
Logos and interface graphics
Start with PNG when transparency or exact pixels matter. Test WebP lossless as an alternative, checking transparent edges and text. If the graphic has no transparency and is photographic rather than flat artwork, a lossy format may be smaller.
Screenshots and diagrams
Preserve small text and sharp lines first. PNG may be appropriate for lossless output; WebP can work when a careful visual comparison shows no unacceptable artifacts. Use the format that keeps labels readable at the actual size.
Animated media
Compare GIF with animated WebP for the required browser and playback behavior. If the animation is decorative, also consider whether a shorter or smaller asset solves more of the performance problem than changing formats.
Verify what WordPress really serves
- Open a representative public page and inspect the image request in browser developer tools.
- Record the response’s content type, URL, dimensions and transfer size. Check both the first load and a cached reload.
- Test responsive breakpoints so a mobile visitor is not receiving the desktop original.
- Inspect the media library and generated files after uploading a new image. Compare the original with each sub-size.
- Review pages after conversion for missing images, stale CDN objects, broken transparent backgrounds and unexpected quality changes.
WordPress’s MIME list includes JPG/JPEG, GIF, PNG, WebP and AVIF. That list establishes recognized types, not guaranteed codec support on every host. A successful upload is therefore only the beginning of the check.
Common problems and fixes
“The upload works, but no WebP or AVIF thumbnails appear”
The active image editor or output configuration may still be generating sub-sizes in the original format, or the server library may lack the required codec. Check the WordPress version, image editor, server library and any image_editor_output_format customization. Reprocess a test image only after correcting the configuration.
“AVIF uploads fail or produce blank thumbnails”
WordPress 6.5 AVIF support depends on Imagick or LibGD support. Ask the host which library and codec are active, then test a small and a large file. Until the complete path works, retain WebP or the original format as a fallback.
Do these 3 things before closing this tab:
1Scan for outdated or missing drivers - takes under a minute2Clear out junk files and repair common Windows errors3Fix the driver behind crashes, sound loss and screen glitches“The page still downloads JPEG after I uploaded WebP”
WordPress may be preserving the original and generating sizes in the configured output format. A theme, CDN, cache or HTML markup may also still point to JPEG. Inspect the actual network response and clear relevant caches before changing files again.
“Transparent areas turn white or look jagged”
The conversion path may not preserve the required alpha channel or the chosen lossy quality may damage edges. Compare PNG with WebP lossless and inspect the image against both light and dark backgrounds.
“The new format is larger”
Compression depends on image content, dimensions, encoder and quality. Keep the smaller file that meets the visual requirement; do not enforce a format solely by extension.
“Some visitors see a broken image”
Check the public response, CDN transformation and fallback markup for the affected browser. Serve an alternate format where the intended audience or delivery chain does not reliably support the preferred one.
Free tools Windows power users keep installed
One-click scans. No signup required.
Best Value
Or skip the browser setup
When you need to verify how a page looks after changing image formats, ScreenshotNeo can capture the public result through one request. It accepts the cookie or consent banner before capture and removes more than 60 known consent platforms, newsletter popups and chat widgets; each step can be disabled. Bot checks, blank pages, timeouts, failed loads and cache hits are not billed, and the response reports the page verdict and billing status in X-Page-Verdict and X-Billed headers.
Use the ScreenshotNeo API documentation for all options, including full-page capture, a CSS-selected element, dark mode, device presets, retina scale, custom CSS or JavaScript, waits, blocked resources and signed links.
cURL
curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webpPython
import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)Node.js
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);ScreenshotNeo also provides an MCP server with take_screenshot, get_page_info and capture_pdf tools for Claude, Cursor and other MCP clients. The free plan includes 1,000 screenshots per month with no card; paid plans start at $5 for 3,000. Sign up for the free plan.
Cost, performance and maintenance considerations
- Measure delivered bytes, not just originals. A conversion that leaves responsive sizes or CDN objects unchanged may provide no visitor benefit.
- Keep a recoverable source. Retaining the original lets you regenerate sizes when quality settings or formats change.
- Watch cache behavior. After changing output rules, purge or version old objects so tests are not reading stale files.
- Use representative samples. Include photos, transparent graphics, text-heavy screenshots and animations; one easy image cannot validate a whole library.
- Recheck after upgrades. WordPress, image libraries, themes, optimization plugins and CDNs can alter generation or delivery behavior.
A practical recommendation
Set WebP as the first format to evaluate for ordinary raster images, but keep PNG for transparency or lossless requirements and JPEG for existing photographic sources or fallback delivery. Add AVIF only after your WordPress 6.5-or-later environment and server image library pass upload, thumbnail, cache and browser tests. The best format is the one your site can generate reliably, deliver to the intended audience and render at an acceptable quality and size.
Recommended Free Tools
Frequently Asked Questions
Does renaming a .jpg file to .webp convert it?
No. The image must be decoded and re-encoded by WordPress, an image editor or another conversion process; changing the filename alone does not change the codec.
Can one WordPress site use several image formats?
Yes. A site can retain originals and deliver different formats for different image jobs or browser capabilities, provided the generation, markup, cache and fallback rules are tested together.
Is AVIF automatically better than WebP?
No. AVIF can be useful where the complete server and delivery chain supports it, but actual size, visual quality, processing support and fallback behavior determine whether it is better for a particular asset.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
