• Image processing
    • Recovery Mode

    There are a couple more features of the WebP format. The compression settings are not exactly the same as those in JPEG. Don't expect 50% JPEG quality to match 50% WebP quality. In the case of WebP, the quality drops quite rapidly, so it is better to start with the highest values ​​and gradually decrease them. Another plus in favor of WebP is the ability to add an alpha channel mask, just like PNG. Unlike competing formats, you can compress a WebP image to one-tenth the size of the image in PNG format. This is really where WebP stands out.

    One example from life: PNG file 880Kb size (24-bit image with alpha channel) was compressed to 41Kb - 95% compression! Although this is not a common situation, the possibilities of WebP are clearly visible.


    The difference is in the quality of textures. (Full version)

    To further reduce the file size, we can not include metadata by unchecking the “Save Metadata” checkbox in the image editor’s save window. For even better results, you can select “lossy alpha channel”.

    Quality settings for the alpha channel are applied to the image itself. For example, 50% quality images will have 50% alpha quality. In our testing, we expected distortion at the edge of the mask, but there were also noticeable changes to the entire image. Of course, this is an option to further reduce the size, but then you need to be very careful about image quality.

    Also, pay attention to the unwanted banding in the alpha channel.

    The difference is in the quality of the alpha channel. (Full version)

    We were very happy when we discovered the WebP Plugin for Photoshop. With it you can easily adjust the quality of WebP images. True, the plugin interface leaves much to be desired. At this time, you cannot view the image to evaluate quality parameters.

    WebP Plugin for Photoshop.

    As a workaround, you can compare the files in Google Chrome. Opening the Save dialog box is also awkward in Photoshop. For this we have appointed hotkey to avoid using the dialog box all the time. Despite the inconvenience, it is still worth it.

    With excellent compression performance, good quality and alpha channel, WebP looks like a good contender for current image formats.

    Despite promising testing results, there is no clear leader among all formats. While WebP performs impressively among other formats, JPEG and 8-bit PNG are sometimes still superior to WebP in size and/or quality. Therefore, we advise you to do your own testing before you transfer all your images to WebP, because it may not fully meet your requirements.

    Implementation

    Having determined that WebP could be an effective tool for us, we turned to our developers to implement this format. WebP is fully supported by Chrome, Opera, Opera Mini, Android browser and Chrome for Android. Firefox, Internet Explorer and Safari do not have full support, although Firefox has its own history with WebP. Luckily, there are several ways to display WebP in these browsers.

    We found 3 ways to support this format. It was important for us to understand that we were using the best tool regarding page size, keeping in mind that Speed ​​Index is a key metric and taking into account any necessary Javascript polyfills.

    We conducted 4 tests to determine which format suits us best. The first one used JPEG as a reference, and the other 3 used the approaches described below. We used a JPEG image and a WebP image of the same quality (269Kb JPEG and 52Kb WebP).

    In the second test, we enabled WebPJS, a 67Kb polyfill created by Dominik Homberger. It provides WebP support in all modern browsers, even in IE6 and higher. The polyfill is convenient because you don’t need to change the img tag in your code, you just need to change the extension of the images from .jpg and .png to .webp.

    The next approach was to use Picturefill, a polyfill that allows you to use a tag even when it is not fully supported. With it, you can use WebP to serve and, if the format is not supported by the browser, serve JPEG, PNG or another format.

    The last test was to use the .htaccess file on the server to implement WebP. This variant was developed by Vincent Orbach.

    Using it, the code in .htaccess looks to see if there is a WebP version of each image on the page. If the browser supports WebP and a WebP image is available, it is served rather than a JPEG or PNG. This is convenient and does not require changing the web page layout.

    After reviewing the results, we concluded that the WebP polyfill (from the second test) is the most lightweight solution that works in all browsers, but we were not satisfied with the Speed ​​Index metric when using this method. The WebP polyfill renders images worse than the JPEG benchmark and worse than other non-iOS implementations. We tend to use this implementation due to better browser support.

    It was also noticed that on iOS devices the files took up 100KB more than on other devices. We found that in iOS5.1 in both IE 8 and IE9, the WebP image was loaded 3 times. Although an additional 2 times is not good, it still took up less space than the JPEG equivalent. We haven't tested this in new iOS versions, perhaps it has already been fixed there.

    A look into the future

    Our team decided to implement the method used in Test 3, using a tag to serve WebP images to browsers that support them and serve JPEGs or PNGs to those that don't know anything about WebP.

    We believe this The best way progressive enhancement and it supports rendering images in a browser-supported format.

    Initially we used the polyfill method, but felt that the result would not be ideal.
    WebP won't completely replace JPEG or PNG just yet, but it will be a very cool tool to have in your arsenal.

    From the translator: The authors used iOS 5.1 because at the time of testing, the WebPageTest.org site supported only this version of the system. IE8 and IE9 to see how WebP will work in such older browsers + these browsers are still important to their customers. There are now plenty of online versions of converters.

    Google's new WEBP image format is pretty cool: its unique systems compressions can render images at approximately two-thirds the size of the same image in JPEG format or PNG.

    But despite six years of development, and significant popularity in Google products, it is still not supported by some of the most common tools for creating and viewing images. Windows' default photo viewer, for example, cannot open this format. Also Word and many others cannot be used to insert into a document. You can, of course, convert with one of these, but there is an easier way.

    How to save a WEBP image in a more general format?

    Open Chrome browser, Yandex or Opera on any platform are the only two major browsers that support displaying WEBP images. Go to a site that uses WEBP images, all images at play.google.com are in an economical format.

    Click right click mouse or long press one of the images and click the “Open image in new tab” button, you will get a WEBP image with its URL at the top of that tab. This link is directly to the image object, which you can edit and change the file format at the same time. It's almost a miracle what a browser can do.

    Click on the URL bar, delete the last three characters in the address ( "-rw"), and then press Enter. The same image will be displayed again, but this time it is displayed in its original format, usually JPEG or PNG.

    Right-click or long-press the image and then select the "Save Image As" option. Which will save it in its original format - just like any other file.

    New tab method

    Just open the image in a new tab and when saving, change its extension from .webp on .png or .jpg— I’ll show you using Avito as an example.

    Using a Chrome extension

    Add a button to context menu save as PNG or Jpeg with one click we save the pictures. Save image as Type An excellent extension for the browser, it simply works, with naming some files there can be a problem with “abracadabra”, but this is the lesser of the evils.

    Formats in the field of storage and transmission of digital images. The goal of WebP was to improve the speed of browser viewing of images, offering the same quality as achieved in JPEG and PNG, but at the same time the file formats are smaller in size. WebP images can be offered with either lossy or lossless compression algorithms. But they are still incompatible with some browsers and image viewers. Often analysts describe this format as "unfinished" i.e. format that needs improvement.

    JPG is one of the most popular image formats in use today. Its main advantage is the ability to store images good quality in files small size. This is possible due to the type of compression used. The mechanism of this type of compression prioritizes some parts of the image over others, preserving high-quality areas of the image that are most visible to the human eye.

    How to convert WEBP to JPG?

    The easiest way is to download good program conversions, for example Photo Converter. It works quickly and efficiently, allowing you to convert any number of WEBP files at once. You will be able to quickly appreciate that Photo Converter can save a lot of time that you will spend when working manually.

    Download and install Photo Converter

    The photo converter is easy to download, install and use - you don't need to be a computer expert to understand how it works.

    Add WEBP files to Photo Converter

    Launch Photo Converter and load the .webp files you want to convert to .jpg

    You can select WEBP files through the menu Files → Add files or simply transfer them to the Photo Converter window.


    Select a location to save the received JPG files


    Select JPG as the save format

    To select JPG as the saving format, click on the icon JPG at the bottom of the screen, or the button + to add the ability to write to this format.


    Now just press the button Start and the conversion will begin instantly, and JPG files will be saved to the specified location with the necessary parameters and effects.

    Try the free demo

    Video instruction

    By converting a file to another file extension, you can use other programs to service it. But we should not forget that the WEBP file, when converted to JPG, may differ slightly from the original, for example in the placement of data. The most vital information should be saved, but if you are interested in the file being identical after converting from WEBP to JPG, you should act judiciously and select the appropriate application from the list below. This doesn't guarantee that the conversion will be 100% as expected, but it can still help a lot. If, nevertheless, the effect of converting the WEBP file to JPG did not meet your expectations, you can try to find on the Internet another version of your file in the WEBP format, previously correctly converted by someone else into a JPG file. If this does not work for you, use the information presented in the next section.

    Programs for converting WEBP to JPG:

    What other possibilities are there?

    Unfortunately, if after performing the two previously described actions (trying to find your WEBP files converted by someone else, and trying to convert it yourself into JPG format) there is still a problem with the file, there are few solutions left. You can try again to search and install an application that can open the WEBP file in its original format (without converting to JPG file. This decision will be difficult to implement, but will undoubtedly bring the best result.