Plus précisément, la nouvelle version bêta de Chrome - Chrome 38 - embarque la prise en charge de la balise <picture>, laquelle offrirait davantage de flexibilité que <img>. L'idée est d'optimiser au maximum l'affichage des images dans un design de type responsive, c'est-à-dire dont les éléments sont dynamiquement ré-ajustés en fonction de la définition de l'écran.
A l'heure actuelle pour une image donnée, il est possible de la redimensionner automatiquement via une propriété dans la feuille de style (width:100%; height:auto;), toutefois, cela signifie que la même image sera chargée sur PC, tablettes ou smartphones, or il peut être laborieux de charger une image de plusieurs méga-octects via une connexion 3G...
Chrome 38 bêta introduit alors la balise <picture>, laquelle permet d'envoyer plusieurs versions d'une même photo en fonction de la définition ou de la densité de pixels de l'appareil utilisé par l'internaute. Si ce type de procédé existent déjà via JavaScript, il sera alors standardisé au HTML.
Reste à savoir si les autres éditeurs emboîteront le pas à Google pour l'introduction de cette nouvelle balise, laquelle resterait sinon quasi-inutisable si Chrome est le seul à la gérer.
<picture>
<source media="(min-width: 45em)" srcset="grande-image-pour-pc.jpg">
<source media="(min-width: 32em)" srcset="moyenne-image-pour-tablettes.jpg">
<img src="petite-image-pour-smartphones.jpg" alt="la légende de la photo.">
</picture>
A lire également :
Post PC : est-il temps d'adopter le Responsive Web Design ?
