Skip to main content Jump to list of all articles

The WebP Manual

 The WebP Manual

PDF, ePUB, Kindle

$ 14.90

About the book

Performance matters now more than ever. What we send over the wire, how we send it, and how much of it we send matters. Because users matter. Web performance is a vast subject with many nooks and crannies, and all deserve their due attention.

Of serious concern, however, is the role of media in performance, specifically images. Images are powerful. Engaging visuals evoke visceral feelings. They can provide key information and context to articles, or merely add humorous asides. They do anything for us that plain text just can’t by itself. But when there’s too much imagery, it can be frustrating for users on slow connections, or run afoul of data plan allowances. In the latter scenario, that can cost users real money. This sort of inadvertent trespass can carry real consequences.

In this ebook, you’ll learn all about WebP: what it’s capable of, how it performs, how to convert images to the format in a variety of ways, and most importantly, how to use it.

Written by Jeremy Wagner. Cover Design by Ricardo Gimenes.

What’s In The Book

This guide will encourage you to experiment and see what’s possible with WebP:

  • WebP Basics
    WebP images usually use less disk space when compared to other formats at reasonably comparable visual similarity. Depending on your site’s audience and the browsers they use, this is an opportunity to deliver less data-intensive user experiences for a significant segment of your audience.
  • Performance
    We’ll cover how both lossy and lossless WebP compare to JPEGs and PNGs exported by a number of image encoders.
  • Converting Images To WebP
    This can be done in a myriad of ways, from something as simple as exporting from your preferred design program, by using Cloudinary and similar services, and even in Node.js-based build systems. Here, we’ll cover all avenues.
  • Using WebP Images
    Because WebP isn’t supported in all browsers just yet, you’ll need to learn how to use it that sites and applications gracefully fall back to established formats when WebP support is lacking. Here, we’ll discuss the many ways you can use WebP responsibly, starting by detecting browser support in the Accept request header.

About The Author

Jeremy Wagner is a developer, author, and speaker from Minnesota. He’s also the author of the book Web Performance in Action, a web developer’s guide for creating fast websites. You can find him on Twitter @malchata or on the web at jeremywagner.me.

Table of Contents

  • Foreword
  • WebP BasicsDepending on your site’s audience and the browsers they use, using WebP images is an opportunity to deliver less data-intensive user experiences for a significant segment of your audience.
  • PerformanceWe’ll cover how both lossy and lossless WebP compare to JPEGs and PNGs exported by a number of image encoders.
  • Converting Images To WebP This can be done in a myriad of ways, from something as simple as exporting from your preferred design program, by using Cloudinary and similar services, and even in Node.js-based build systems. Here, we’ll cover all avenues.
  • Using WebP ImagesBecause WebP isn’t supported in all browsers, you’ll need to learn how to use it that sites and applications gracefully fall back to established formats when WebP support is lacking.
  • In ClosingWebP does offer potential benefits to a large portion of internet users. In my experience, WebP has substantially improved loading performance for many of my clients, and continues to be a tool I reach for when I want to make pages as lean as possible.
  • Appendix

Technical Details

  • Formats: PDF, ePub, Kindle (DRM-free)
  • Pages: 84
  • Language: English
  • Released: July 2018
  • Publisher: Smashing Media AG
  • ISBN (PDF): 978-3-945749-70-8