O'Reilly logo

HTML5 Boilerplate Web Development by Divya Manian

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Optimizing your images

Every resource you add to your page is an extra request to the server and extra network trip for the browser before it declares the page complete. Network requests are typically the slowest components of a page load. This is especially obvious on mobile devices when surfing websites on 3G or even lower connections. The smaller your files are, the faster they will reach the browser.

If you can avoid using a large image, you are better off not using them.

8-bit PNGs

If you are considering using a GIF format for your images, always use PNG. PNG formats for images are far less heavy and much smaller. Even further, 8-bit PNGs are significantly smaller in size.

If you are using PNGs, you should use PNG-8 with a full alpha channel ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required