Responsive Images and Web Standards at the Turning Point

by Mat Marquis

41 Reader Comments

Back to the Article
  1. Perhaps I am being naive, but what would be so terrible about using PHP to dynamically generate the required image size?

    @media screen and (min-width: 300px) and (max-width: 500px) {
    .box1{background: #ccc url(‘get_dynimg.php?img=pic1&size=500’) top left;}
    }

    designer can simply make images max size required & php will generate smaller as required.
    a simple few lines script can work for all & probably do it in chunks, so 500px img is fine for 300-500 screen, very little excess.

    I’m pretty sure this can be used to provide different pics depending on the screen (close up, wide angle etc) it doesn’t really require anything to be changed from normal practice other than a discrete server side script.

    Copy & paste the code below to embed this comment.