A great little mini case-study from Eric—if you’re exporting transparent PNGs from a graphic design tool, double-check the colour-depth settings!
I’d been saving the PNGs with no bit depth restrictions, meaning the color table was holding space for 224 colors. That’s… a lot of colors, roughly 224 of which I wasn’t actually using.
Following on from Amber’s introduction, here’s a really in-depth look at image formats, compression and optimisation techniques from Addy.
This is a really nicely put together little web book released under a Creative Commons licence.
Amber has been investigating which image formats make sense for which situations.
Choosing image format is only one step towards optimising images on the web. There are many, many other steps to consider, and so, so much to learn!
A Mac app for converting PNGs and JPEGs to WebP.
Smart thinking from Sara on providing a PNG fallback to browsers that don’t support SVG. Although, actually what I like about this solution is that it’s less about providing PNG as a fallback, and more about treating PNG as the baseline and SVG as the enhancement (an approach that the picture element is perfect for).
A very hand tip from Ben on using SVG background images with a PNG fallback for IE8 and below.
If you’re adding some noise texture to your backgrounds, this little service might be handy. I usually base-64 encode these kinds of background images: it would be nice to see that added as an option here.
Some practical advice for optimising your images on the web.
From Kornel, the genius who gave us ImageOptim, comes another Mac desktop tool for optimising PNGs, this time converting 24-bit PNG to 8-bit with full alpha channel.
A script that attempts to detect connection speed (by requesting a test file three times in a row) in order to determine whether hi-res images should be requested or not.
Here’s a great braindump from Paul following the Responsive Summit, detailing multiple ways of potentially tackling the issue of responsive images.
I'm kicking myself that I didn't know about this little Fireworks trick.
A neat new CSS effect. You don't see many of those these days.
Dmitry built an incredibly cool JavaScript pie chart. It also integrates with Flickr using Ajax to do a Flickr version of googlefight. Great stuff!