What is a WEBP file? Format, size and browser support
A WEBP file is an image format that can be lossy, lossless, transparent or animated. It usually beats JPG on size — here is when it wins and when it does not.
What WEBP actually is
WEBP is an image format developed for the web. It can store lossy images, lossless images, images with transparency, and simple animations inside one file format, which is why it can replace both JPG and PNG in many situations.
Its main advantage is size. At the same visual quality a WEBP file is usually smaller than the JPEG or PNG it replaces, so pages transfer less data and load sooner. The size of that gain depends almost entirely on how the file is encoded.
Lossy or lossless: choose the mode first
A lossy WEBP discards detail the eye is unlikely to notice, and it is the right mode for photographs and for screenshots that are mostly photographic. This is the mode that produces the large savings compared with JPG.
A lossless WEBP keeps every pixel exactly, so it behaves like PNG. Use it for logos, icons, screenshots of text, and any image that will be edited or re-saved, because repeated encoding will not add artefacts.
The mode matters more than the format name. A lossless WEBP of a photograph will be far larger than a lossy one, and a lossy WEBP of small text will look noticeably worse than a PNG of the same text.
Choosing a quality setting for photographs
Lossy WEBP uses a quality value rather than a simple on or off switch. Around 75 to 85 is the useful range for photographs: file size drops sharply compared with the maximum, while the difference is difficult to see at normal viewing size.
Below about 60, smoothing and block artefacts begin to appear in skies, skin, and flat backgrounds. Above about 90, the file grows quickly for improvements almost no one can see. Convert a copy and compare it at full size before committing to a value.
Transparency and animation
WEBP supports full alpha transparency, including partially transparent pixels, so soft shadows and rounded logo corners stay clean. This is the feature JPG has never had, and it is the main reason a cut-out image can stay small without becoming a large PNG.
Animated WEBP can replace simple GIF animations with better colour and a smaller file. It is worth testing, but keep the GIF when the animation has to work in very old software.
Browser support and fallbacks
Every current browser displays WEBP, including recent versions of Chrome, Edge, Firefox, Safari, and the default browsers on Android and iOS. The remaining compatibility gap is mainly old desktop software, some email clients, and a few upload forms.
When you serve images from your own site you can keep a JPG or PNG fallback and let the browser choose. When you send a file to a person or a system whose support you cannot check, convert a copy instead of guessing.
A practical WEBP workflow for a website
Start from the original master file rather than an already-compressed copy. Resize the image to the largest size it will actually be displayed at, then encode the WEBP from that resized version.
Use lossy WEBP for photographs, lossless WEBP for graphics and text, and keep the original master so a different format or size can be produced later. Measure the before and after file sizes and check the result at full size before publishing.
When WEBP is the wrong choice
WEBP is not always the answer. If a printer, a legacy application, or a specific upload form rejects the file, JPG or PNG is the safer deliverable. If the image will be edited repeatedly, a lossless master such as PNG or TIFF is easier to work with.
For very small icons an SVG often beats every raster format, because it stays sharp at any size and is usually smaller. Match the format to the destination rather than to the trend.