title: Android mobile browser images are pixelated until refresh
body: <p>I am currently working on a mobile site, on it I have a group of images marked up as so:</p>
  
  <pre><code>&lt;a href="/link/"&gt;&lt;img alt="image" src="/assets/image.jpg" /&gt; Link&lt;/a&gt;
  </code></pre>
  
  <p>When I initially visit the site from Android (multiple devices) these images load but are rendered grainy and pixelated. However, once I refresh the page on my device the images will then re-load and display crisp as intended. I have only tested this once on iPhone but it looked okay on the first load, so I believe this is Android specific.</p>
  
  <p>I tried setting these as background images via CSS instead of placing them through HTML, I also tried placing an inline style directly on the image declaring the dimensions. With both approaches the problem remained exactly the same.</p>
  
  <p>Each one is around 3kb each and there are 9 of them, the rest of the site is not very heavy and these images are really the only content on this page. I am convinced there must be a limit or constraint that Android puts in place to make pages load faster, but if that is the case is there a way to get around it?</p>
  
  <p>Unfortunately I can not post screenshots or a URL.</p>
  
  <p>Thanks in advance!</p>