O'Reilly logo

Responsive Web Design with jQuery by Gilberto Crespo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Control of art direction for responsive images

This topic has been discussed a lot recently. Authors should provide different sources for images in different sizes, and based on their visual judgment, they will focus the main element of the image for that particular breakpoint. This is art direction.

Let me clarify it by showing this case here. When the image is displayed in larger sizes, it makes sense for the image to show the couple on the boat and the river in the background. The background helps explain where they are but, in general, it gives no relevant information. Now, look what happens when we scale the image down to fit a smaller screen. It is not art direction.

Reducing to that size, you can barely recognize the couple. Instead of simply ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required