Quick note on why you should always use Progressive JPEGs if larger than 10KB

Lately I’ve been doing a ton of reading on decreasing website load time, image optimization techniques, responsive loading for different devices, and every detail I can find in between. One quick takeaway is that I will always tick the “progressive” checkbox in Photoshop’s Save for Web dialog from now on when saving JPEGs larger than 10KB.

Export progressive JPEGs from Photoshop

There is no downside that I can find: progressive JPEGs tend to be smaller on average. The progressive loading experience has actually been proven to “feel” faster to a user, because they have something to look at versus watching the image paint in.

And, as Duncan Davidson and Steve Streza found out as a result of their research this evening, they look way fucking better on iPad 3s.

Baseline versus progressive JPEGs

Bonus trivia: I’ve also recently learned that you cannot shed bytes significantly if you gzip a JPEG. It’s already completely compressed.


Posted

in

by