The web is becoming increasingly image rich. Between high-resolution mobile screens, Pinterest-style design, and big background graphics, the average image payload has more than doubled in the last three years. While visually appealing, these images carry a substantial performance cost, and — if not optimized correctly — can make a web experience slow and painful, no matter how beautiful it is.
In this tutorial we’ll discuss ways that let you provide the eye-pleasing experience you want without sacrificing your site’s performance.You’ll learn about the three primary aspects of image optimization:
- Image compression: how to best encode your images, delivering the same picture with the fewest bytes
- Image loading: once your files are as small as they can be, we’ll cover the best ways to make them show up quickly in the browser
- Operationalizing image optimization: different tools and techniques for integrating image optimization on your site
Talk given at Velocity Conf EU 2015: http://velocityconf.com/devops-web-performance-eu-2015/public/schedule/detail/45013