webP - a new image format for web
What is webP?
This document discuses webP, a new image format which can reduce the image size up to 28% and 35% respectively when compared to a PNG and JPEG image.
It is pronounced as 'weppy'. It is developed by Google and open sourced under BSD License.
webP provides lossless and lossy compression for images on the web. Lossy is a data encoding method for compressing data by discarding (losing) some of it.
webP uses VP8 video codec which is used to compress keyframes in videos.
As of this writing, webP is supported by Google Chrome, Internet Explorer with Google Chrome Frame, Opera 11.10 and Android Ice Cream Sandwich.
Covert JPEG and PNG to webP
With a open source converter tool, you can convert a JPEG or PNG image to webP.
Download the converter
You can download the converter tool from http://code.google.com/speed/webp/download.html. When you arrive at this page, please select the appropriate OS. The converter tool is available for Linux, Windows and Mac OS X. We will see how can we use the tool to convert a JPEG image to webP in Windows 7.
Install and convert in Windows 7
After you downloaded the converter, unzip the file. And then run the following command from command line.
cwebp demo.jpeg -o demo.webp
Where demo.jpeg is the image before conversion, demo.webp is the image after conversion.
Our demo image demo.jpeg is of 172kb.
Let's execute the command to convert.
Now let's check the file size.
File size is reduced to 149 kb approximately, which almost 14% of the original image.
Using webP files
Following code is of an HTML page contains our webP image file.
<!DOCTYPE html> <html lang="en"> <head> <title>An example of displaying webP image file</title> </head> <body> <p><img src="dmeo.webp" /></p></p> </body> </html>
Convert tp other image formats from webP
To convert a webP image back to PNG or JPEG, run the following command
dwebp demo.webp -o demo.png
Where demo.webp is the webp image and demo.png is required image.
Test your Programming skills with w3resource's quiz.
- New Content published on w3resource:
- HTML-CSS Practical: Exercises, Practice, Solution
- Java Regular Expression: Exercises, Practice, Solution
- Scala Programming Exercises, Practice, Solution
- Python Itertools exercises
- Python Numpy exercises
- Python GeoPy Package exercises
- Python Pandas exercises
- Python nltk exercises
- Python BeautifulSoup exercises
- Form Template
- Composer - PHP Package Manager
- PHPUnit - PHP Testing
- Laravel - PHP Framework