Rendering images with Base64 (in Img / Canvas)
Base64 Responsive photo
HTML5 code:
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAY ... ..." style="height: 75%; width: 75%" alt="Base64 Responsive photo" />
Base64 Compressed Responsive photo
HTML5 code:
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAA ... ..." style="height: 75%; width: 75%" alt="Base64 Compressed Responsive photo" />
Base64 Canvas Responsive photo
HTML5 code:
<canvas height="1024" width="1024" style="height: 75%; width: 75%" id="base64"></canvas>
<script src="js/base64.js"></script>
Base64 Responsive SVG image
HTML5 code:
<img src="data:image/svg+xml;base64,PHN2ZyAKdmVyc2lvbj0iMS ... ..." style="height: 75%; width: 75%" alt="Base64 Responsive SVG image" />
JPG Responsive photo (standard method to load images)
HTML5 code:
<img src="img/Stp87406.jpg" style="height: 75%; width: 75%" alt="JPG Responsive photo" />