#F5F5F5

PHOTOGRAPHY

WebP files.

Google created the WebP file format to make online images less bulky. With significantly reduced photo and graphic sizes, websites load faster and give users a better experience. Learn more about how the WebP file format works.

Explore Creative Cloud

WebP marquee image

https://main--cc--adobecom.hlx.page/cc-shared/fragments/seo-articles/get-started-notification-blade

What is a WebP file?

Google launched the WebP format as part of its mission to make loading times faster across the Internet. WebP allows websites to display high-quality images — but with much smaller file sizes than traditional formats such as PNG and JPEG.

You can choose to save WebP files with either lossless or lossy compression. This means you can either compress images without losing data or with losing only some non-essential information. Google’s developers have suggested that lossless WebP images can be up to 26% smaller than PNGs.

You can quickly tell whether a file is a WebP image by looking out for the .WEBP extension.

History of the WebP file.

The WebP format is relatively new, dating back to 2010. On2 Technologies — a company acquired by Google — created the original concept.

Each WebP file consists of VP8 or VP8L image data. Over the years, the format has evolved to keep pace with shifting consumer habits and emerging digital trends. Google added support for animation and transparency in 2011 and the format is now compatible with web browsers beyond just Google products.

Google Chrome natively supports WebP and other web browsers like Firefox, Edge and Opera. However, it also encourages web developers and designers to first convert PNG and JPEG files to WebP to speed up page loading times.

How to use WebP files.

WebP files were designed entirely with the Internet in mind. Their main uses include:

Reducing website image sizes.

WebP aims to balance quality and practicality when it comes to website images. With the help of predictive coding, WebP files compress photos and graphics without reducing the quality of their appearance. Smaller image sizes also ease the strain on user broadband connections and make websites faster to navigate, improving page experience.

Supporting online animations.

While GIFs have long been the dominant format for memes and other basic online animations, WebP files offer an alternative. According to Google, an animated WebP can be significantly smaller than a GIF, requiring fewer bytes.

Discover more raster file types

Pros and cons of WebP files.

It’s worth looking at the WebP advantages and disadvantages before you get started with this file format.

Advantages of WebP files.

  • Faster-loading webpages offer a better user experience and even boost a website’s ranking in search engines. In contrast, websites with slow-loading images might encourage users to look elsewhere when shopping for products and services.
  • The WebP format is highly compatible with various web browsers, including Google Chrome, Microsoft Edge and Mozilla Firefox.
  • WebP might free up storage space for businesses by compressing their website images into more manageable sizes.

Disadvantages of WebP files.

  • The WebP file format is designed mainly with the Internet in mind, so it might not be helpful if you use images off-line.
  • Some older browsers, like Internet Explorer, may not be as effective in supporting WebP images, despite the format’s broad compatibility.
  • Even a small amount of compression can reduce the quality of an image, which is worth keeping in mind if you work with professional photographers and high-quality images.
section-metadata
background

#F5F5F5

How to open a WebP file.

WebP images are generally quicker to view in browsers rather than built-in photo applications.

First, make sure you have a compatible browser before you try to open a WebP file. Once set up, simply open the folder where you’ve saved your WebP file and double-click it. The image will then automatically open in your default browser.

You also have the option to convert existing files such as PNGs and JPEGs to the WebP format. You can find a range of converter tools online.

How to create and edit a WebP file.

You may require a plugin to create and edit WebP files using Adobe Photoshop. Once you’ve installed a trusted plugin that’s compatible with your device, follow these steps:

  • Create or edit an image using Photoshop, then click Save As.
  • Save the file as a WebP using the Format menu.
  • Choose the name and location for your new WebP file and click Save.
  • A settings panel will appear, giving you the option to edit your file further.

WebP files: frequently asked questions.

What’s the difference between WebP and JPEG files?

Both file types compress images to make them easier to share and store. However, a WebP file is generally much smaller than a traditional JPEG. Google’s developers suggest that a WebP image with lossy compression could be 25% to 34% smaller than a comparable JPEG file.

Does WebP work on all browsers?

After years of development and evolution, most web browsers support the WebP format. But some browsers, like Internet Explorer, may still struggle to support a WebP file, so it’s always worth checking Google’s latest compatibility list.

Is WebP an open-source file format?

WebP is an open-source model, which means anyone can work on the format and make improvements to it. Google’s developers have actively encouraged users to offer their input since its launch in 2010.

Does a WebP image have a maximum size?

The maximum size of WebP images is 16,383 x 16,383 pixels. This may be a factor to consider before you add WebP images to a website or elsewhere.

Are WebP images raster or vector files?

WebP images are a type of raster file. Raster is one of the two main categories of image files — the other being vector. The main difference between the two is that raster files consist of individual pixels whereas vector graphics consist of mathematical equations and paths. Find out more in our raster vs. vector comparison guide.

https://main--cc--adobecom.hlx.page/cc-shared/fragments/seo-articles/do-more-photoshop-color-blade

https://main--cc--adobecom.hlx.page/cc-shared/fragments/discovery-hub/products-photoshop-segment-blade