I have read before that it is best to explicitly state the size of an image used in a page using the height and width attributes in order to have it render the fastest. My question is whether or not it is better, worse, or makes no difference if you put the height/width in a CSS stylesheet vs. having the attributes inline in the img tag.
<img src=http://www.webdeveloper.com/forum/archive/index.php/"myImg.jpg" height="10" width="10">
versus
.myImg {
width: 10px;
height: 10px;
}
<img src=http://www.webdeveloper.com/forum/archive/index.php/"myImg.jpg" class="myImg">Well if you had a lot of images all the same size then the page would Download quicker if you gave the images a class and set the dimentions like in your second example.
Some old browsers don't support CSS though, so if you were to specify the dimentions with CSS they would have to wait for the image to Download before they were the right size, which means that content would be continually shifting round on the page as more and more images are Download ed.
It seems that Mozilla completely ignores any dimentions specified if an image is not Download ed though which I find quite annoying.
Overall I think it is best to specify image dimentions with styles though (unless you are using inline styles). The width and height attributes are not depreciated though, so they must still serve a purpose.
<img src=http://www.webdeveloper.com/forum/archive/index.php/"myImg.jpg" height="10" width="10">
versus
.myImg {
width: 10px;
height: 10px;
}
<img src=http://www.webdeveloper.com/forum/archive/index.php/"myImg.jpg" class="myImg">Well if you had a lot of images all the same size then the page would Download quicker if you gave the images a class and set the dimentions like in your second example.
Some old browsers don't support CSS though, so if you were to specify the dimentions with CSS they would have to wait for the image to Download before they were the right size, which means that content would be continually shifting round on the page as more and more images are Download ed.
It seems that Mozilla completely ignores any dimentions specified if an image is not Download ed though which I find quite annoying.
Overall I think it is best to specify image dimentions with styles though (unless you are using inline styles). The width and height attributes are not depreciated though, so they must still serve a purpose.