Packt Publishing has recently released their introduction to retina displays as part of their Instant line, entitled Website Optimization for Retina Displays How-to, by Kyle J. Larson.

The book provides a quick overview of many of the different ways of serving higher density images to retina displays. Kyle starts with the basics using <img> tags and CSS, working through media queries and using fonts for icons, all the way onto Javascript and server-side methods for swapping in higher density images. Over 10 different techniques are shown, each with a description and sample code to demonstrate it. If your client just started complaining their site is blurry on their new Retina MacBook Pro, or you’re just looking to keep up with recent trends, this book is a good, quick place to start understanding your options.

Back in April of 2012, Jim shared his thoughts on dealing with retina displays in his own post, Server Side Retina Graphics.

The more I use my new iPad, the more I notice non-retina graphics. We’re spoiled by the many native apps with retina graphics, that when we browse the web, it feels like a second class citizen. It doesn’t have to. This problem isn’t going away, either. I bet we’ll start seeing retina displays in MacBooks pretty soon, and maybe even glorious 27″ retina cinema displays, too. But, even with just the iPhone 4, 4S and new iPad, we’ve got a lot of devices receiving subpar content.  Let’s fix that.

Read on →