All examples By author By category About

rgdonohue

Responsive Images

This demonstrates a responsive image technique using picturefill.js, currently one of the best responsive image solutions available. Essentially it mimics an exciting web standard on the horizon, the proposed picture element, to deliver images at an appropriate size (and bandwidth!) for a given screen size. Read more about responsive image solutions from the filament group.

My demonstration here always makes use of "art direction." I've manually cropped, zoomed, and changed the focal point of each image. View this example in a new window to resize the display.