1

I am using height and width for images in css before img tag (css in same page header) so I think there is no need to set dimensions in img tag.

But when I checked speed in different online tools, many tools are showing the message like "some images are missing height and width attributes. page can't be fully rendered until these images have been downloaded."

Am I doing wrong and should move height and width to img tags or these tools showing wrong? Anyone knows about which is best for speed?

7
  • Speed will really only apply if the image is larger than the dimensions you intend. I pre-size all images exactly how I want them to appear. Otherwise, it is mostly a user experience (UX) factor. If the tag has the height and width dimensions then that space can be allocated when the page is drawn and before the images are downloaded. Otherwise, the style has to be applied and the page can shift around while this is happening. We have all seen this.
    – closetnoc
    Aug 25, 2015 at 19:14
  • 3
    Some of these websites (Gt Metrix for example) you are using to test don't take the into consideration height and width attributes in css. So, first of all, because they say that, does not mean you are doing something wrong, secondly, @closetnoc. Aug 25, 2015 at 19:33
  • @closetnoc I agree that tools can be totally wrong because they have no brain and made by people
    – proseosoc
    Aug 25, 2015 at 20:44
  • @closetnoc nowadays broadband is so quick that this is hardly a issue. Only people with GPRS and slow arse broadband will notice those, unless your hosting sucks too. A lot of designers are now opting to use page transitions to give the impression of smooth loading, far easier imo. Aug 25, 2015 at 21:27
  • @SimonHayter I largely agree with you. On the flip-side- it takes more resources to serve a larger file. Mostly, I see that several larger requests are more of an issue on the server side. But it is not always the network, sometimes it is the client computer. I use a netbook that has been overloaded with images, javascript, huge amounts of HTML, large CSS, and so on and it munch-mangles my hard-drive for a while when all I want to do is read. BTW- I have a slow arse broadband... jus sayin... it used to be a commercial connection and may be later if Google decides to send me some traffic.
    – closetnoc
    Aug 25, 2015 at 22:24

1 Answer 1

1

The error message you are getting is simply an informative message telling you that without the width and height attributes the page load may slow down while the whole image is downloaded to the browser cache to be displayed, but if the image in question is the same size (IE: not larger than the area you are wanting to display it in) then you wont have any issues.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.