Tool for Using Adaptive Images in Web Design

This drop-in solution for adaptive images in responsive web design is simply awesome:

Adaptive-Images is designed to work with existing mark-up, without a need to edit it. Because of that it will work on any site. It creates and manages its own resized images using your existing images as the source, and it will adapt to the same resolution brackets your site does with the CSS3 @media queries you use in your Responsive Design. It can do all of this because it already has the high resolution version to work on (it’s the one in the mark-up).

Adaptive-Images will also allow you to go “mobile-first”, again without changing your mark-up in any way. If there’s no cookie with the screen resolution stored in it, AI simply assumes you’re on a mobile device and delivers a mobile sized image.

COMMENT