We just updated our Joomla! extension (version 0.0.2) and Magento extension (version 0.2.3) for WebP to add fix for PNG-transparency. While Google WebP offers an exciting way to decrease the required bandwidth of your site, its support for PNGs is somewhat limited: It does not support transparent PNGs, or PNGs with an alpha layer.

About Google WebP

From the Google labs, WebP is a project to add a new image-format to browsers, that replaces PNG and JPEG. Its main goal is to make your existing images smaller, and therefor decrease the bandwidth needed by your site. Because WebP takes off upto 30% of image-sizes, a site with a lot of images could surely benefit from using WebP.

There's only one downside: WebP-support is not spread widely yet. While browser-extensions exist for other browsers, the only browser that supports WebP out of the box is Google Chrome. But for those of you paying attention to browser-watches, Google Chrome is slowly beating Internet Explorer as to who is the most popular browser.

Another great point is personal use: We use Chrome as default browser, so any site we visit ourselves frequently and which has WebP installed, becomes fast. An example is our MageBridge demo-server which uses consistently less resources since we introduced WebP to its sites.

Detection of alpha-transparency

The extensions we offer for Joomla! and Magento now include a simple PHP-based check to see if a certain PNG-image is transparent or not. This is done by checking the first part of the PNG-image. If an image is a JPEG, WebP can be used. If an image is PNG but not transparent, WebP can be used. If an image is PNG but transparent, it will be skipped.

Unfortunately, we found out that WebP has - because of this - little to offer for our own Yireo site: The Yireo site uses a great-bunch of transparent-images - some of them combined in CSS Sprites, others loaded standalone - and because of this, we only gained a 3% weight loss because of WebP. But we're sure many other sites will grealy benefit from WebP.

Posted on March 27, 2012

About the author

Author Jisse Reitsma

Jisse Reitsma is the founder of Yireo, extension developer, developer trainer and 3x Magento Master. His passion is for technology and open source. And he loves talking as well.

Sponsor Yireo

Looking for a training in-house?

Let's get to it!

We schrijven niet te commerciële dingen, we richten ons op de technologie (waar we dol op zijn) en we komen regelmatig met innovatieve oplossingen. Via onze nieuwsbrief kun je op de hoogte blijven van al deze coolness. Inschrijven kost maar een paar seconden.

Do not miss out on what we say

This will be the most interesting spam you have ever read

We schrijven niet te commerciële dingen, we richten ons op de technologie (waar we dol op zijn) en we komen regelmatig met innovatieve oplossingen. Via onze nieuwsbrief kun je op de hoogte blijven van al deze coolness. Inschrijven kost maar een paar seconden.