The image format you choose isn't just a technical detail — it directly affects your search ranking, your bounce rate, and how much bandwidth your hosting bill consumes. Google measures page speed as a ranking signal, and images are typically responsible for 50–80% of a web page's total weight. Getting the format right is one of the highest-return, lowest-effort optimisations available to any website owner.
⚡ Quick verdict for 2026
Why Image Format Directly Affects Your Google Ranking
Since 2021, Google's Core Web Vitals have been an official ranking factor. Three of the four metrics are directly impacted by images:
Largest Contentful Paint
Measures how long the largest visible image or text block takes to load. The hero image on most pages is the LCP element — its format and size are the single biggest factor in this score.
Cumulative Layout Shift
Images without declared width/height attributes cause layout shifts as they load, hurting CLS. Smaller WebP files load faster, reducing the window during which shifts can occur.
Interaction to Next Paint
Large images on the main thread delay JavaScript execution, slowing interaction responses. Smaller WebP files free up the browser to handle user interactions faster.
The Case for WebP — by the Numbers
WebP was developed by Google and released in 2010. It took years to achieve universal browser support, but by 2020 every major browser — Chrome, Firefox, Safari, Edge — had full WebP support. In 2026 there is no longer a meaningful compatibility reason to serve JPEG instead of WebP to web visitors.
What the compression difference actually looks like
| Image Type | JPEG Size | PNG Size | WebP Size | Saving vs JPEG |
|---|---|---|---|---|
| Hero photo (1920×1080) | 420 KB | 1.8 MB | 280 KB | 33% smaller |
| Product image (800×800) | 85 KB | 210 KB | 58 KB | 32% smaller |
| Blog thumbnail (400×300) | 28 KB | 65 KB | 18 KB | 36% smaller |
| Logo with transparency (200×80) | N/A | 12 KB | 7 KB | 42% smaller vs PNG |
| Screenshot (1440×900) | 180 KB | 520 KB | 110 KB | 39% smaller |
On a page with ten images, switching from JPEG to WebP typically saves 1–3 MB of total page weight. At average mobile connection speeds, that's 0.5–2 seconds of load time — more than enough to meaningfully shift your LCP score from "Needs Improvement" to "Good".
When WebP Is Not the Right Choice
WebP is the right default for most web images — but there are specific situations where JPEG or PNG remain the better choice:
Microsoft Outlook email
Outlook's rendering engine is notoriously behind the times. As of 2026, Outlook for Windows still does not render WebP images in email — they display as broken image placeholders. If any significant portion of your email list uses Outlook (common in enterprise and B2B audiences), use JPEG for email images.
Print and document workflows
Adobe InDesign, Illustrator, and most professional print workflows have incomplete or unreliable WebP support. If an image will be placed in a document destined for print, use TIFF, PNG, or JPEG instead.
Legacy CMS and platform limitations
Some older content management systems, page builders, or e-commerce platforms automatically recompress uploaded images and may not accept WebP input. Check your platform's documentation before switching your upload workflow.
When lossless is genuinely required
WebP supports lossless mode, but lossless WebP files are often larger than equivalent lossless PNG files for certain image types (particularly images with large flat colour areas). In lossless scenarios, benchmark both before committing.
Recommended Format by Platform and Use Case
🌐 Web & CMS
- Hero images WebP
- Blog photos WebP
- Product images WebP
- Logos (transparent) WebP
- Background textures WebP
- Favicons PNG
📱 App Stores
- App icon (iOS) PNG
- App icon (Android) PNG
- Screenshots PNG
- Feature graphic JPEG
- In-app images WebP
- Play Store banner JPEG
- Header images JPEG
- Product photos JPEG
- Logos PNG
- Icons & buttons PNG
- Animated content GIF
📱 Social Media
- Facebook photos JPEG
- Instagram posts JPEG
- Twitter/X images JPEG
- LinkedIn posts JPEG
- Pinterest pins JPEG
- Profile pictures PNG
What About AVIF — The Format After WebP?
AVIF (AV1 Image File Format) is the next generation after WebP. It offers genuinely impressive compression — typically 20–30% smaller than WebP at equivalent quality, with particularly strong performance on photographic content.
| Format | Compression | Browser Support | Encode Speed | Tooling |
|---|---|---|---|---|
| JPEG | Baseline | Universal | Very fast | Mature |
| PNG | Lossless | Universal | Fast | Mature |
| WebP | 25–35% better than JPEG | All modern browsers | Fast | Mature |
| AVIF | 45–55% better than JPEG | Most browsers (Chrome, Firefox, Safari 16+) | Slow | Maturing |
AVIF is genuinely exciting, but in 2026 WebP remains the practical recommendation for most websites for three reasons: encoding speed (AVIF is significantly slower to generate, which matters for user-generated content and on-the-fly resizing), tooling maturity, and the fact that the marginal compression gain over WebP doesn't justify the added complexity for most teams. Large platforms like Netflix and YouTube use AVIF for specific use cases — but WebP is the right default for everyone else.
How to Convert Your Existing Images to WebP
If your website is currently serving JPEG and PNG images, converting them to WebP is a straightforward process. Here are the main options from simplest to most scalable:
Option 1 — DenaliKit Image Resizer (browser, free)
Open the Image Resizer
Go to denalikit.com/app/image-resizer.html — no account needed, completely free.
Drop in your PNG or JPEG
Drag the image onto the drop zone. The original dimensions and file size appear immediately. Nothing is uploaded — processing is local.
Select WebP as the output format
Choose WebP from the format picker. Set quality to 85 for the best size-to-quality ratio. Optionally adjust dimensions if you also need to resize.
Download and replace
Download the WebP file. Upload it to your site and update any <img> src attributes or CSS background-image URLs to point to the new file.
Option 2 — WordPress with a plugin
Plugins like Imagify, ShortPixel, or Smush automatically convert uploaded images to WebP and serve them to supported browsers. This is the lowest-maintenance option for WordPress sites — install once and all future uploads are automatically optimised.
Option 3 — Cloudflare Image Resizing or CDN-level conversion
If your site sits behind Cloudflare, you can enable Polish (automatic WebP conversion) on any plan. The CDN converts images at the edge before serving them — no changes required to your source files. Other CDNs like Fastly and Bunny.net offer similar features.
Option 4 — Build pipeline (for developers)
If you're using a static site generator or build tool, libraries like sharp (Node.js), Pillow (Python), or cwebp (Google's command-line tool) can batch-convert entire image directories to WebP as part of your build process.
Using the HTML Picture Element for Progressive WebP Delivery
If you need to support older browsers or email clients that don't support WebP, the HTML <picture> element lets you serve WebP to browsers that support it and JPEG as a fallback for those that don't — with no JavaScript required:
<picture>
<source srcset="hero.webp" type="image/webp">
<source srcset="hero.jpg" type="image/jpeg">
<img src="hero.jpg" alt="Hero image" width="1920" height="1080">
</picture>
The browser picks the first
<source> it supports. Modern browsers get WebP; everything else gets JPEG. The <img> tag is the fallback for very old browsers and is also what screen readers and search engines use.
In 2026, this pattern is largely optional for public websites since all modern browsers support WebP. It remains useful if you're serving a significant enterprise audience where employees may be on older locked-down browsers, or if you're building an email template.
Frequently Asked Questions
Does image format affect SEO?
Yes, directly. Google's Core Web Vitals — specifically Largest Contentful Paint (LCP) — are an official ranking signal, and your hero image's format and file size is usually the single biggest factor in LCP. Google Lighthouse flags serving JPEG or PNG where WebP would be appropriate as an explicit ranking opportunity. Switching to WebP is one of the most direct technical SEO improvements available.
Is WebP better than JPEG for websites?
For web delivery, yes — WebP produces files 25–35% smaller than JPEG at equivalent visual quality, supports transparency, and has full support in all modern browsers. The only remaining exception is Outlook for email. For everything else on the web, WebP is the better choice.
Should I convert all my website images to WebP?
Yes, for new uploads going forward. For existing images, prioritise the largest files first — hero images, above-the-fold photos, and product images have the most impact on LCP. Thumbnails and small decorative images are lower priority. Use DenaliKit to convert images one at a time for free, or set up a CDN-level conversion for a bulk approach.
What about AVIF — is it better than WebP?
AVIF offers better compression than WebP — typically 20–30% smaller at equivalent quality. However, AVIF encoding is significantly slower, tooling is less mature, and browser support is still more limited than WebP. WebP remains the practical default for most websites in 2026. AVIF is worth testing on high-traffic image-heavy pages where the compression gains justify the added complexity.
How do I convert images to WebP for free?
DenaliKit's Image Resizer converts PNG and JPEG to WebP free, directly in your browser. Open the tool, drop in your image, select WebP as the output format, set your quality (85 is a good default), and download. Your image never leaves your device — nothing is uploaded to any server.
Will converting to WebP hurt image quality?
At quality 80–85, WebP is visually indistinguishable from JPEG to the human eye on a screen. The compression is more efficient — it achieves the same visual result with fewer bytes, not lower quality. Always keep your original JPEG or PNG as a master file and export to WebP as your web delivery copy.