title: How to deliver different Responsive Images?
body: <p>On this website: </p>
  
  <ul>
  <li><p>.php</p></li>
  <li><p>.jquery</p></li>
  <li><p>.yii based</p></li>
  </ul>
  
  <p>We need to have two or more different infographic pictures, depending on the viewport width. </p>
  
  <ul>
  <li><p><em>The client is picky about w3c validation</em></p></li>
  <li><p><em>picturefill solution doesn't validate</em></p></li>
  <li><p><em>different images and not only different image version, should be served</em></p></li>
  <li><p><em>for a lot of reasons</em> background images are not a solution*</p></li>
  <li><p><em>IE8 and up support</em></p></li>
  </ul>
  
  <p>I can use either a server or client side version, no problem. </p>
  
  <p><strong>Reasons:</strong></p>
  
  <ol>
  <li><p>Background image technique does work, but those infographics are NOT background.</p></li>
  <li><p>They should arrive server side.</p></li>
  <li><p>Obviously, they need to adapt. (and background size... well...)</p></li>
  <li><p>Even worst, we do have responsive tooltips image maps associated with those infographics.</p></li>
  </ol>