I’ve seen a few places suggest giving all images their respective width and height measurements in the html code. However, what actually happens if you specify no dimensions? Does it affect something like your start render time?
My site is database driven and loads images that are not all the same size, so it is impossible for me to set some static values for the dimensions. However i could run each image through some php code to extract the image dimensions and use these to give the image its dimensions in the html code. But would the delay from the extra processing negate the possible benefits (whatever they may be) of actually giving the dimensions?
Hey There,
“If no dimensions are specified in the containing document, or if the dimensions specified don’t match those of the actual images, the browser will require a reflow and repaint once the images are downloaded. To prevent reflows, specify the width and height of all images, either in the HTML tag, or in CSS”
I have height and width fields in my database for each image. I usually have a thumbnail version stored as well so I have a thumb width and thumb height as well.
What I would recommend is using a script to run through your database images and then update each entry with the height and width of the image. That way when you have to actually query the image on the frontend you can set the height and width dynamically without having to do that extra processing each time.