When the browser lays out the page, it needs to be able to flow around replaceable elements such as images. It can begin to render a page even before images are downloaded, provided that it knows the dimensions to wrap non-replaceable elements around. 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 <img> tag, or in CSS.
Current Page Speed libraries cannot detect when image dimensions are supplied through CSS. Although your site will be rendering faster, your Page Speed score will be affected. Keep this in mind when analysing your site's score.
Enter your e-mail address below and we'll send you a temporary password.
A temporary password has been e-mailed to you.