WebP is a method of lossy and lossless compression that can be used on a large variety of photographic, translucent and graphical images found on the web. The degree of lossy compression is adjustable so a user can choose the trade-off between file size and image quality. WebP typically achieves an average of 30% more compression than JPEG and JPEG 2000, without loss of image quality.
Will Woodgate/Stacks4Stacks has just released the WebPStack that makes it easy to add WebP images as resources or warehoused images in Stacks. Within the stack settings, you can provide an image ALT attribute, an optional tooltip title and an optional link. Then for older web browsers that do not currently support WebP, you can specify a traditional JPG, PNG or GIF image to use instead.
It's a well-known fact that images speak louder than words, so here's a comparison:
Test One: The image on the left is a compressed .jpg (ImageOptim) it weighs 385 kB. I took this compressed image and ran it through the WebPonise app which reduced it by a further 87.5% (default app settings) resulting in an image weighing 48 kB. After examining the image closely, I'm unable to detect any artefacts or a loss in quality.
Test Two: This 'jpg was dowloaded from Pixabay. After running it through ImageOptim it was reduced by 5.9% and weighed 193 kB (left). The WebPonise app (default app settings) reduced the same downloaded image by 41.5%. Result: 120 kB. Once again, I'm unable to discern any artefacts (although there's plenty of scope for them in the sky) and no difference in the image quality.
Did you notice the 'for older web browsers that do not currently support WebP' part? It's a fact that not all web browsers support WebP images. Safari, sadly, is one of those browsers and there's as yet no way to preview a WebP image on the Mac. Will's WebPStack ensures that your warehoused .jpeg is displayed on older browsers and will load the much lighter image for browsers that already support the WebP format.
And I know you're going to ask, so here's a list of the browsers that currently support the WebP format:WebP lossy support
Links to the developers ® All trademarks cited on this page are the property of their respective owners.
Do you have a question regarding RapidWeaver?
Would you like help with your new project?
Would you like us to build your new RapidWeaver website?
Don’t miss a post!
Sign up for our monthly newsletter.
A monthly digest of all the latest updates from our RapidWeaver blog, keeping you up to date with the hottest new stacks and themes.
265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.
We do not harvest or sell personal information.
© rjh web design 2010—16