3 ms·
If you can give the browser the image size with JS, then the browser can figure it out on it's own. Rarely do we specify the width of many, many objects and th
by RobertRoberts 7y ago
If you can give the browser the image size with JS, then the browser can figure it out on it's own.
Rarely do we specify the width of many, many objects and they display just fine. (consider tables)
- labawi 7y agoBy adding an attribute I meant server side, not client-side if that's what you mean. If you defer (down)loading of images, and layout depends on unavailable size/aspect-ratio of an image, you get layout updates - same would happen if you lazy-loaded contents of tables. What is the problem you would like solved and what do you propose for the browsers to do? Ancestor post was about avoiding layout changes as new layout-critical information arrives. Judging by your sibling comment, you seem to prefer layout updates with content popping up.
- RobertRoberts 7y agoUsing the width/height value on an <img> tag feels simply archaic and more importantly doesn't add value to the site visitor. Why? 1. srcset [0]: the browser chooses the size of the image, not the server. 2. CSS/Responsive images [1] : Almost all (I am close to saying 100%) of images I have loaded on websites have their width/height adjusted by CSS. Layout updates are often unavoidable in most circumstances surrounding images, there is just no getting around it. So instead of pining over the past, we should adapt for the future. I feel like this argument is the same I had with print designers in the late 90s who made every page a full image because they couldn't handle not having full control over the layout. [0] https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/srcset https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageEl... [0b] https://cloudfour.com/thinks/responsive-images-101-part-8-css-images/ https://cloudfour.com/thinks/responsive-images-101-part-8-cs... [1] https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimed...