That's very useful, but cropping/resizing the images is not the hard part. If you change the image src after the page is loaded, the first request is already underway, so you end up downloading two images, just as happens with the OP. You need to send device profiles to the server and somehow keep them up-to-date, or create images on the client - and then serve a different version to crawlers... there are plenty of proposals (image-set, srcset) to handle this in HTML5/CSS but none has become standard yet.