Yoav's blog thing

Mastodon   RSS   Twitter   GitHub  

How Big Is Art-Direction?

For a while now, the art-direction use-case have been treated by browser vendors as resolution-switching's imaginary friend.

When talking to people who work for browser vendors about that use-case, I've heard phrases like "that's a really obscure use-case" and "No one is really doing art-direction".

This got me wondering — how big is that use-case? How many Web developers & designers are willing to go the extra mile, optimize their images (from a UI perspective), and adapt them so that they'd be a perfect fit to the layout they're in?

# Methodology

With the lack of solid data on the subject, I had to go get some :)

Arguably, one of the easiest ways for Web developers to implement art-direction today is to use picturefill — the framework that polyfills the picture element's syntax. So all I had to do is find sites using picturefill and see which ones use the framework for art-direction rather than simple resolution-switching.

I've used the WebDevData scripts to get a hold of Alexa's top 50K websites' HTML. Then I grepped through those HTML files to find pages that contain "data-picture" (the data attribute used by picturefill), downloaded the images and (manually) went through the results to find which sites art-direct their images. Not very scalable, but it works for a small amount of sites.

# Results

The results showed that 24% (7 out of 29) of the sites that use picturefill, use it to implement art-direction. While a larger sample would be better, this is a strong indication that the art-direction use-case is an important use-case for responsive images.

# Update

Embedding the Gist with the results:

alistapart.com
animoto.com
behance.net
cato.org
ceskatelevize.cz
creativemarket.com
dribbble.com
evernote.com
extra.cz
flavorwire.com
globalnews.ca
ing.dk
leapmotion.com
lintas.me
lorealparisusa.com
mccormick.com
microsoft.com
mindbodyonline.com
patientslikeme.com
pocket-lint.com
sky.com
supercell.net
theclymb.com
wcupa.edu
webstaurantstore.com
weforum.org
wmich.edu
worldwildlife.org
yinxiang.com
worldwildlife.org
theclymb.com
supercell.net
pocket-lint.com
mindbodyonline.com
lorealparisusa.com
leapmotion.com

1 comment

← Home