Resizing images and performance

Question

I have an image that is around 1200 x 400 (if I remember right), and is about 50kb in size. I use the image in a header for a website, but I constrict the height of the image to 100px in order to make it fit my header.

<asp:Image ID="imgLogo" runat="server" ImageUrl="~/Images/AFact.jpg" Height="100px" />

Is this a bad practice? Does it mean that the image is being downloaded in full to the client, and then the client's browser has to waste cpu to resize it? Would I be better off to scale the image down to the height that I want it at by using Photoshop?

Answer 1

Is this a bad practice? Does it mean that the image is being downloaded in full to the client, and then the client's browser has to waste cpu to resize it? Would I be better off to scale the image down to the height that I want it at by using Photoshop?

Yes to all your questions.

Answer 2

Yes, yes, yes!

Not only you download a big file and only display a small one. The browser is really lousy in scaling images. So it will look ugly, too :)

Answer 3

Same as the others yes to your questions. You can use a tool like imagemagick to resize your images in a batch file.

Answer 4

Big YES