- From: Mateus Souza <mateussouzaweb@gmail.com>
- Date: Thu, 21 Nov 2013 11:07:08 -0200
- To: whatwg@lists.whatwg.org
Hi guys, I been watching the responsive images episodes and that make me create an opinion and proposal about that. I dont know if someone else said the same thing, but worth a try. Today, we have obsessive concerns with img src attribute, to make an image responsive and forgotten all other attributes, which need be responsive too. The picture element says: <picture width="500" height="500"> <source media="(min-width: 45em)" src="large.jpg"> <source media="(min-width: 18em)" src="med.jpg"> ... But the responsive thing is to make a image responsive. Large.jpg and med.jpg do not have the same width and height for example. This is not semantic. In Art Direction requirements [1], all image variation do not have the same alt attribute necessarily. I can describe the images in multiple ways... My proposal is to add one more attribute to images, an only that. We all know the media attribute in stylesheets, and i think that is the best sintax. Would look something like: <img src="large.jpg" media="screen and (min-width: 800px)"... <img src="small.jpg" media="screen and (max-width: 300px)"... This would cause a duplication of the img tag. but thinking about it, we really have two images and thus the code is more semantic. I have created one repository to explain the proposal in more details [2]. If you guys are interested, please visit the link, fork and optimize. In short terms, we need make the showing and loading of existent images responsive, not just change the src attribute. What you think about that? [1] - http://usecases.responsiveimages.org/#art-direction [2] - https://github.com/mateus007/responsive-images Mateus Souza
Received on Thursday, 21 November 2013 13:08:07 UTC