The W3C, facing this need of providing the correct image to the user, is working hard to finish studying them. There is an unofficial draft of this initiative, which includes the <picture>
tag and different sources inside it, in its standards, in order to make adaptation of the image easier.
Note
Without this standard, browser developers cannot prepare their browsers to render it well. Today, the frontend community is using CSS and JavaScript trying to do this same task.
This is the definition of the <picture>
tag by W3C:
"This specification provides developers with a means to declare multiple sources for an image, and, through CSS Media Queries, it gives developers control as to when those images are to be presented to a user."
They also thought of older browsers, which will show a simple image as a fallback content. The following is an example of how the tag will be used:
<picture width="500" height="500"> <source media="(min-width:45em)" srcset...