CODEWITHSUNDEEP
html
dramasea
dramasea

Reputation: 3490

Does the load time decrease if I set image height and width

<img src="image.jpg" width="20px" height"20px">

Is the load time of the above equal to :

<img src="image.jpg">

I'm just curious about it as we know the smaller the image, the faster the load time

Upvotes: 3

Views: 4152

Answers (4)

Theolodis
Theolodis

Reputation: 5092

No, it does not make the site load faster.

What can help you to make it faster is, to resize the image. You can do that manually, with paint or similar, or by using a sript (PHP for example):

<?php
$image = 'image.jpg';
$scale = 0.5;
list($width, $height) = getimagesize($image);
$newWidth = $width * $scale;
$newHeight = $height * $scale;
$thumb = imagecreatetruecolor($newWidth, $newHeight);
$source = imagecreatefromjpeg($image);

// Resize
imagecopyresized($thumb, $source, 0, 0, 0, 0, $newWidth, $newHeight, $width, $height);
//$thumb does now contain the resized image.
?>

Upvotes: 0

Jon
Jon

Reputation: 437854

No, setting width and height attributes only affects how the browser will render the image. The source file image.jpg remains the same size and still has to be downloaded in its entirety.

Upvotes: 1

Pat Dobson
Pat Dobson

Reputation: 3299

No, it doesn't speed up page load. But, it does prevent the 'effect' of the page building itself and breaking/fixing the layout as images are loaded. Putting the image dimensions in tells the browser to reserve the place where the image is going. In this way, on page load the layout should be fixed and the images will pop into place when loaded.

Having said this, in theory, adding the 'extra' markup for width/height should actually slow the page down as your code is slightly bigger than before. It's got to be a tiny, tiny amount though in the grand scheme of things...

Upvotes: 5

RSM
RSM

Reputation: 15118

No, it may actually make it load slower because it has to make adjustments to the images requiring more work from the browser, best thing to do is make the image the exact size you want it for max speed

Upvotes: 0

Related Questions