What is WebP and Why is Every Website Using It?

WebP Is Everywhere — And There Is a Good Reason for That

Open the developer tools in your browser right now and inspect the images on almost any major website. Amazon, Google, YouTube, Wikipedia, Shopify stores, news publishers — a significant portion of the images you see every day are not JPEGs or PNGs. They are WebP files. If you have ever right-clicked an image and seen .webp in the filename, or noticed a format you did not recognize, you have already encountered WebP without knowing it.

This quiet takeover did not happen by accident. WebP solved a real problem: JPEG was designed in 1992, PNG in 1996, and neither format was built for the modern web's obsession with mobile performance, bandwidth costs, and Core Web Vitals scores. WebP was engineered from the ground up to compress images more efficiently than both, and it has succeeded spectacularly. Today it is the default output format for Google's own image optimization tools, recommended by PageSpeed Insights, and supported by every major browser.

Whether you are a web developer trying to improve your page speed scores, a designer working with images, or simply a curious person who wants to understand the files they encounter online, this guide covers everything you need to know about WebP — what it is, how it works, and how to use it effectively.

At a Glance

If you want the short version before reading the full breakdown:

• WebP is an image format created by Google in 2010 that supports lossy compression, lossless compression, transparency, and animation — all in one format.
• It is smaller than JPEG and PNG — typically 25–35% smaller than JPEG at equivalent quality, and 15–25% smaller than PNG.
• Browser support is near-universal — Chrome, Firefox, Safari (14+), Edge, and Opera all support WebP, covering over 95% of global web traffic.
• It can replace JPEG, PNG, and even GIF — a single format for photographs, graphics with transparency, and animations.
• To use it, convert your existing images with our image converter and serve WebP with a JPEG or PNG fallback using the <picture> element.

A Brief History of WebP

The Problem Google Was Trying to Solve

By 2008, Google had a very specific problem. The web was getting heavier — images were getting larger, mobile internet was exploding, and the dominant image formats (JPEG and PNG) had not fundamentally changed since the 1990s. As the company behind both the world's dominant search engine and the Chrome browser, Google had a direct financial and technical interest in making the web faster.

Slow pages meant worse user experience on Google Search, fewer clicks, higher bounce rates, and more pressure on Google's own infrastructure. Google began investing heavily in web performance research, which ultimately produced a range of technologies — SPDY (the precursor to HTTP/2), Brotli compression, AMP, and WebP.

VP8 and the Birth of WebP

In 2010, Google acquired On2 Technologies, a video codec company that had developed a highly efficient video compression format called VP8. Video compression and image compression share fundamental technical principles, and Google's engineers recognized that the VP8 video codec's intra-frame compression technology could be repurposed for still images.

The result was WebP, announced by Google in September 2010. The format used the same predictive coding and discrete cosine transform techniques that VP8 used to compress individual video frames, adapted for use as a standalone image format. Early benchmarks showed WebP files were 39% smaller than JPEG files at equivalent quality — a remarkable result for a first release.

Adoption Was Slow, Then Sudden

Chrome added WebP support in 2011, but the format spent years in a frustrating middle ground. Because Safari and Firefox did not yet support it, web developers could not safely serve WebP to all users, and widespread adoption stalled. Opera added support in 2013, Firefox in 2019. The critical turning point came in September 2020, when Safari 14 added WebP support. That single update brought WebP coverage above 90% of global web traffic almost overnight, and the adoption curve turned sharply upward.

Today, WebP is no longer an emerging or experimental format. It is a mature, universally supported standard that belongs at the center of any modern web image strategy. For everything related to WebP conversion, the WebP converter hub provides tools to convert to and from WebP in seconds.

How WebP Compression Works

Understanding why WebP produces smaller files requires a brief look under the hood. WebP is not magic — it applies a set of well-understood compression techniques that are simply more sophisticated than what JPEG and PNG use.

Lossy Compression: Predictive Coding and DCT

WebP's lossy mode (used when replacing JPEG) is built on the same core technology as the VP8 video codec. The encoder divides an image into 4×4 and 16×16 pixel blocks, then uses predictive coding to encode each block. Instead of storing the raw pixel values for every block, the encoder looks at neighboring blocks that have already been encoded and predicts what the next block should look like. It then stores only the difference between the prediction and the actual pixel values. Accurate predictions produce small differences, and small differences compress extremely efficiently.

This approach is supplemented by discrete cosine transform (DCT), the same mathematical technique used by JPEG. DCT converts the pixel difference data from the spatial domain into the frequency domain, where it is easier to identify and discard information that the human visual system is least sensitive to. High-frequency detail (fine texture, subtle noise) is compressed more aggressively than low-frequency information (broad shapes, gradual color transitions) because people are less likely to notice its loss. The result is smaller files at any given quality level compared to JPEG's older, less efficient implementation of the same basic approach.

Lossless Compression: Replacing PNG

WebP's lossless mode is a completely different algorithm designed to compete with PNG. It uses a combination of techniques including color space transformation (representing colors in a way that is more compressible), color indexing (building a palette for images with few unique colors), back-reference coding (referencing previously encoded areas when identical or similar regions appear again), and Huffman entropy coding (the same statistical encoding used by many lossless compressors). The combined result is lossless images that are 15–25% smaller than equivalent PNG files on average, with better results on images that have large repeated areas or limited color palettes.

Alpha Transparency

One of WebP's significant advantages over JPEG is its support for alpha channel transparency, which JPEG cannot do at all. WebP encodes the alpha channel separately from the RGB color data, using lossless compression for the alpha channel even when the RGB data uses lossy compression. This means you can have a high-quality, partially transparent image — useful for product photos with transparent backgrounds, overlays, logos — at a file size far smaller than the equivalent PNG.

Animation

WebP also supports animation, storing multiple frames sequentially much like GIF does, but with far better compression. Because WebP animation can use either lossy or lossless compression for each frame, and because it can encode only the portions of each frame that change from the previous one (delta encoding), animated WebP files are typically 64% smaller than equivalent animated GIFs. This makes WebP a superior replacement for GIF in almost every web context.

WebP Feature Comparison: How It Stacks Up Against Other Formats

| Feature | JPEG | PNG | WebP | GIF | AVIF | |---|---|---|---|---|---| | Compression | Lossy only | Lossless only | Lossy + Lossless | Lossless (256 colors) | Lossy + Lossless | | Typical size vs. JPEG | Baseline | 3–10x larger | 25–35% smaller | 3–20x larger | 40–50% smaller | | Transparency (alpha) | No | Yes | Yes | 1-bit only | Yes | | Animation | No | No (APNG: limited) | Yes | Yes | Yes | | Color depth | 8-bit per channel | Up to 16-bit | 8-bit per channel | 8-bit (256 colors) | Up to 12-bit per channel | | HDR / wide color | Limited | No | No | No | Yes | | Lossless option | No | Always | Yes | Always | Yes | | Re-save quality loss | Yes | No | No (lossless) | No | No (lossless) | | Progressive loading | Yes | Yes (interlaced) | No | Yes (interlaced) | No | | Browser support | 100% | 100% | 96%+ | 100% | 90%+ | | Created | 1992 | 1996 | 2010 | 1987 | 2019 | | Best use case | Legacy photos | Pixel-perfect graphics | Most web images | Animated memes | Future-proof delivery |

The pattern is clear: WebP matches or exceeds JPEG and PNG in every practical dimension except two — progressive loading (which WebP lacks) and HDR color support (which AVIF handles but WebP does not). For the vast majority of web images, these omissions are irrelevant. WebP's combination of small file size, transparency support, and animation makes it the most versatile format available at near-universal browser coverage.

Browser Support: Where WebP Works Today

WebP is now supported in every major modern browser. The table below shows the version at which each browser added WebP support, along with its current global usage share to give you a sense of how much of your audience is covered.

| Browser | WebP Support Since | Global Usage Share (2026) | |---|---|---| | Google Chrome | Version 23 (November 2012) | ~65% | | Safari (iOS + macOS) | Version 14 (September 2020) | ~19% | | Microsoft Edge | Version 18 (2018, Chromium-based from v79) | ~4% | | Firefox | Version 65 (January 2019) | ~3% | | Samsung Internet | Version 4 (2016) | ~3% | | Opera | Version 12.1 (2013) | ~2% | | UC Browser | Supported | ~1% | | Internet Explorer | Never | Less than 0.5% | | Total covered | | >96.5% |

The lone holdout in the table — Internet Explorer — has been end-of-life since June 2022 and accounts for a negligible fraction of web traffic. Unless your analytics show a meaningful IE audience (which would be genuinely unusual in 2026), you can treat WebP as universally supported and still provide a JPEG fallback as a simple safety net rather than a primary concern.

Why Websites Are Switching to WebP

File Size Savings Are Substantial and Immediate

The most straightforward reason websites adopt WebP is bandwidth reduction. Every kilobyte of image data you eliminate is a kilobyte that does not have to travel over the network. On a page with ten images, switching from JPEG to WebP might save 500KB to 1.5MB of total transfer — a reduction that is immediately visible in load time measurements, particularly on mobile connections.

For large websites serving millions of page views per month, the cumulative bandwidth savings translate into real money. Hosting, CDN bandwidth, and data transfer costs all decrease proportionally. A site serving 100TB of images per month at quality-equivalent WebP instead of JPEG might save 25–35TB of transfer — and the associated costs.

Core Web Vitals and Search Rankings

Google's Core Web Vitals — particularly Largest Contentful Paint (LCP) — directly reward faster image loading. Your LCP element is often the hero image, a featured product photo, or a prominent illustration, and its load time is measured from the moment the browser begins navigation. Serving that image as WebP instead of JPEG means fewer bytes transferred, faster decoding, and a better LCP score.

Google's PageSpeed Insights actively flags JPEG and PNG images as candidates for WebP conversion under the "Serve images in next-gen formats" audit. Fixing this audit improves your PageSpeed score, reduces your LCP, and removes a negative signal from Google's technical quality assessment of your site. For a deeper look at how image format choices affect your rankings, see our guide on the best image format for web SEO.

Mobile Users and Data Costs

Mobile web traffic now exceeds desktop traffic globally. Mobile connections — even on 4G and 5G — are more variable and more sensitive to data volume than wired connections, and many users in price-sensitive markets pay per megabyte of data. Serving 30% smaller images to mobile users is not just a performance optimization; it is a genuine user experience improvement that affects real people's data bills and perceived page quality.

Google's mobile-first indexing means your site is primarily assessed on its mobile performance. Optimizing your images for mobile through WebP adoption directly addresses the metric Google weights most heavily.

Developer and Tooling Ecosystem

The tooling ecosystem around WebP has matured to the point where there is no technical friction in adopting it. Cloudinary, Imgix, Cloudflare Images, and most major CDNs serve WebP automatically based on browser capability. Next.js and Nuxt both convert images to WebP by default through their built-in image optimization. WordPress generates WebP versions of uploaded images since version 5.8. Sharp, the most popular Node.js image processing library, has excellent WebP support. You no longer need to manually convert or manage multiple format variants in most modern stacks.

How to Create WebP Images

Online Converters

The fastest way to get WebP images without installing any software is an online converter. Our image converter supports JPEG, PNG, GIF, BMP, and TIFF inputs and converts them to WebP (or any other format) in your browser. You can upload multiple files at once, choose quality settings, and download the results immediately. No account required, no software to install.

For specific workflows, dedicated converters are often more convenient:

• To convert JPEG photos to WebP: use the jpg-to-webp converter for fast batch conversion.
• To convert WebP back to PNG for editing: use the webp-to-png converter.
• To convert WebP to JPEG for legacy compatibility: use the webp-to-jpg converter.

Command-Line Tools

If you work with images programmatically or need to process large batches of files, command-line tools offer more control and automation. Google provides cwebp (for encoding WebP) and dwebp (for decoding) as free open-source utilities:

# Convert a JPEG to WebP at quality 80
cwebp -q 80 input.jpg -o output.webp

# Convert WebP to PNG
dwebp input.webp -o output.png

# Lossless WebP conversion
cwebp -lossless input.png -o output.webp

You can install cwebp via Homebrew on macOS (brew install webp), via most Linux package managers (apt install webp), or by downloading binaries from Google's developer site.

Sharp (Node.js)

For programmatic image processing in JavaScript or TypeScript, Sharp is the standard library. It wraps libvips and provides extremely fast WebP encoding:

const sharp = require('sharp');

// Convert JPEG to WebP
await sharp('input.jpg')
  .webp({ quality: 80 })
  .toFile('output.webp');

// Lossless WebP
await sharp('input.png')
  .webp({ lossless: true })
  .toFile('output.webp');

Sharp is used under the hood by Next.js, Gatsby, and many other frameworks for their image optimization pipelines.

Squoosh

Google's Squoosh (squoosh.app) is a browser-based image compression tool with an excellent side-by-side comparison view. You drag in an image, select WebP as the output format, adjust quality with a slider, and see both the original and compressed version simultaneously. It is the best tool for visually calibrating your quality settings before committing to a conversion workflow, because you can see exactly what quality loss occurs at each setting.

How to Convert Between WebP and Other Formats

WebP conversion is a two-way street. You need to convert existing images to WebP for web delivery, but you also sometimes need to convert WebP files back to other formats — for clients who request JPEG or PNG, for editing in applications that do not yet support WebP, or for social media uploads where JPEG is safer.

Our complete conversion tools cover every direction:

• JPG to WebP — Convert your existing photo library to WebP for smaller, faster web delivery: jpg-to-webp
• WebP to PNG — Convert WebP to lossless PNG for editing or when transparency needs to be preserved in a universally-supported format: webp-to-png
• WebP to JPG — Convert WebP to JPEG for legacy compatibility, social media upload, or clients who need a standard format: webp-to-jpg
• All formats — Convert any image format to any other through our central image converter

For a detailed walkthrough of the conversion process including tips on preserving transparency and choosing quality settings, see our guide on how to convert WebP to PNG/JPG. And if you are working with images on Apple devices, you may also want to read about what is HEIC format — Apple's proprietary image format that requires its own conversion workflow for web use.

For a comprehensive strategy on optimizing all of your site's images — not just format selection but also sizing, compression, lazy loading, and CDN configuration — our complete guide on how to optimize images for your website covers every step in detail.

Using WebP in HTML: The Right Way to Implement It

The <picture> Element with Format Fallbacks

The <picture> element is the correct, standards-based way to serve WebP to browsers that support it while providing fallbacks for those that do not. The browser reads the <source> elements from top to bottom and uses the first format it supports:

<picture>
  <source srcset="/images/hero.avif" type="image/avif">
  <source srcset="/images/hero.webp" type="image/webp">
  <img
    src="/images/hero.jpg"
    alt="Descriptive text about the image"
    width="1200"
    height="630"
    loading="eager"
  >
</picture>

In this example, AVIF-capable browsers (Chrome, Firefox, Safari 16+) get the smallest possible file. WebP-capable browsers (the vast majority of everyone else) get the next best option. Older browsers and any browser that does not recognize the <source> elements fall back to the reliable JPEG. The <img> tag is also what screen readers use for accessibility and what search engine crawlers use for image indexing, so always make it descriptive.

Always include the width and height attributes on the <img> tag matching the intrinsic dimensions of your image. Modern browsers use these values to calculate aspect ratio and reserve the correct amount of space before the image loads, preventing Cumulative Layout Shift — one of Google's Core Web Vitals.

Responsive WebP with srcset

Serving the right image size to each device is as important as serving the right format. A 2400px image sent to a mobile user who can only display 400px of width wastes 97% of the pixels transferred. Combine <picture> for format negotiation with srcset for size negotiation:

<picture>
  <source
    type="image/webp"
    srcset="
      /images/hero-400.webp 400w,
      /images/hero-800.webp 800w,
      /images/hero-1200.webp 1200w,
      /images/hero-1600.webp 1600w
    "
    sizes="(max-width: 600px) 100vw, (max-width: 1200px) 80vw, 1200px"
  >
  <img
    src="/images/hero-1200.jpg"
    srcset="
      /images/hero-400.jpg 400w,
      /images/hero-800.jpg 800w,
      /images/hero-1200.jpg 1200w
    "
    sizes="(max-width: 600px) 100vw, (max-width: 1200px) 80vw, 1200px"
    alt="Descriptive text"
    width="1200"
    height="630"
    loading="lazy"
  >
</picture>

The sizes attribute tells the browser what rendered size the image will appear at given viewport widths. The browser uses this to select the most efficient source from srcset. Combining format optimization (WebP) with size optimization (responsive srcset) can reduce image data transfer by 60-80% compared to serving a single large JPEG to all devices.

Lazy Loading

Use loading="lazy" on all images that are not immediately visible when the page loads. This defers their loading until the user scrolls toward them, reducing initial page load time and data usage for visitors who do not scroll far:

<img src="/images/article-photo.webp" alt="Descriptive text" width="800" height="500" loading="lazy">

One critical exception: do not lazy-load your LCP image (usually the hero or first visible image). Lazy loading delays the browser's discovery and loading of the image, which directly hurts your LCP score. Use loading="eager" or simply omit the attribute for above-fold images.

CSS Background Images

For background images in CSS, you cannot use the <picture> element directly. The recommended approach is to use the image-set() CSS function, which allows you to specify WebP with a JPEG fallback:

.hero {
  background-image: image-set(
    url('/images/hero.avif') type('image/avif'),
    url('/images/hero.webp') type('image/webp'),
    url('/images/hero.jpg') type('image/jpeg')
  );
}

Browser support for image-set() with type hints is growing but not yet universal. For maximum compatibility, you can also use JavaScript-based feature detection or serve CSS class variants based on a WebP capability check performed at page load.

Frequently Asked Questions

What does WebP stand for?

WebP does not officially stand for anything in particular — the name is simply a combination of "Web" and "P" for "picture." Google introduced the name when announcing the format in 2010. The format's technical underpinnings come from the VP8 video codec developed by On2 Technologies, which Google acquired that same year. Some sources suggest the "P" is an informal reference to the VP8 lineage, but Google has never formally defined the acronym.

Is WebP the same as JPEG 2000?

No, WebP and JPEG 2000 are entirely different formats with different technical foundations and very different adoption trajectories. JPEG 2000 was developed by the JPEG committee and introduced in 2000 as a successor to JPEG, using wavelet transforms instead of DCT for compression. Despite better compression than JPEG, JPEG 2000 never achieved mainstream browser support — Safari supported it for years but Chrome and Firefox never did. WebP, by contrast, now has near-universal browser support. JPEG 2000 should be considered a failed standard; WebP is the practical JPEG successor that actually made it.

Can Google see and index WebP images?

Yes, Google's crawlers fully support WebP and can index WebP images for Google Image Search. From a search engine indexing perspective, WebP is treated identically to JPEG or PNG. What matters for image SEO is not the format but the content surrounding the image: descriptive alt attributes, meaningful filenames (e.g., red-running-shoes.webp rather than IMG_4521.webp), structured data markup where applicable, and inclusion of important images in your XML sitemap. Use WebP for performance; use good alt text and filenames for image SEO.

Does converting to WebP lose quality compared to the original?

It depends on which mode you use. WebP lossless mode is completely lossless — every pixel is preserved exactly, with no quality loss whatsoever. WebP lossy mode, like JPEG, does permanently discard some image data, though it does so more efficiently than JPEG. If you convert a JPEG to WebP in lossy mode, you will experience some additional quality loss on top of what was already lost when the original JPEG was encoded. For the best results, always convert from the original uncompressed source (RAW, TIFF, or PNG) rather than from an existing JPEG. If you only have a JPEG source, use WebP quality settings of 80-85 to keep quality high while still gaining meaningful file size savings.

How do I open a WebP file on my computer?

WebP files are natively supported in the most common contexts where you encounter them. Modern web browsers — Chrome, Firefox, Safari, Edge — can open WebP files directly. On Windows 10 and 11, Photos app opens WebP natively. On macOS, Preview can open WebP files. On both platforms, double-clicking a .webp file will typically open it in your default image viewer. If your image editing software does not support WebP (older versions of Photoshop, for example), you can use our webp-to-png converter to convert to a universally-supported format before editing.

Is WebP lossless or lossy?

WebP is both — you choose which mode to use based on your needs. Lossy WebP is used when replacing JPEG: it achieves smaller file sizes by permanently discarding image data that the human eye is unlikely to notice, similar to how JPEG works but more efficiently. Lossless WebP is used when replacing PNG: it achieves smaller file sizes while preserving every pixel exactly, similar to how PNG works but with better compression ratios. You can also use a hybrid mode called "near-lossless" that applies minimal lossy adjustments to achieve better compression while keeping quality imperceptibly close to lossless.

Will WebP be replaced by AVIF soon?

AVIF is the likely long-term successor to WebP — it achieves 40-50% smaller files than JPEG at equivalent quality and supports HDR, wide color gamuts, and other advanced features. Browser support for AVIF has improved significantly (Chrome, Firefox, and Safari 16+ all support it), and adoption is growing. However, WebP is not going anywhere soon. Encoding and decoding AVIF requires more computational resources than WebP, and WebP's simpler codec makes it faster to process for real-time or high-volume conversion scenarios. The realistic near-term future is AVIF as the primary format where supported, with WebP as the fallback, gradually replacing today's WebP primary / JPEG fallback pattern. WebP will remain relevant for years.

Conclusion: WebP Is Not Optional Anymore

WebP started as Google's ambitious attempt to replace aging image formats with something purpose-built for the modern web. After a decade of gradual adoption, it has achieved exactly what it set out to do. It is smaller than JPEG, smaller than PNG, more capable than both, and now supported by every browser your visitors are likely to use.

The performance case for WebP is unambiguous. Pages that serve WebP images load faster, score better on Core Web Vitals, and provide a measurably better experience on mobile connections. Google's own tools — PageSpeed Insights, Lighthouse, and Search Console — all actively flag the absence of WebP as a performance problem. Adopting WebP is not a nice-to-have optimization for performance enthusiasts; it is table stakes for any website that cares about user experience and search rankings.

Implementation is straightforward with the <picture> element and proper fallbacks. You do not need to choose between WebP and compatibility — you can serve WebP to the 96%+ of users whose browsers support it while automatically serving JPEG to the rest. Tools and frameworks from Next.js to WordPress handle this automatically.

The path forward is clear: start by converting your most important images — hero images, above-fold content, high-traffic product or blog post photos — using the image converter, then work through the rest of your image library. For individual format-specific conversions, use the dedicated tools for jpg-to-webp, webp-to-png, and webp-to-jpg. Implement the <picture> element pattern, set your width and height attributes, and apply loading="lazy" to below-fold images.

WebP is not the last word in image compression — AVIF is pushing the boundaries further, and formats we cannot yet name will follow. But for right now, in 2026, WebP is the format that belongs on your website. Every day you continue serving unoptimized JPEG and PNG files is a day you are loading your pages with unnecessary weight and leaving your search rankings and user experience on the table. The tools are free, the format is universal, and the gains are real. There is no good reason to wait.