Resizing images
I'll clean up this page in the near future! This page is meant to supplement in-class activities.
Internet connections are getting faster, but they'll never be fast enough. You should do everything you can to make your page load faster, and that means making all elements of your page, including images, audio, and video, as small in bytes as possible.
This page will show you how to resize an image using GIMP. By resize, we mean that you will actually edit the picture to the desired size in the web page, and also cut the resolution down to 72dpi.
But first, some motivation. Below are two links to web pages that are identical in all respects except one, the size of the images linked to. In the first link, the image has been edited down to a sleek 67,600 bytes.
The image used in the second link has not been edited. Its dimensions have been defined in the web page, making it 'fit' the page, but the image has not been physically edited. (We'll go over this in class.) So, the image in the second page is a whopping 4.9 megabytes, or 4,900,000 bytes. That's over seventy (70!) times bigger than the image used in the first page.
The interesting thing is that the images in both pages appear about the same.
Page with edited image: (Click on this one first. If you look at the second one first, it will slow down your browser!)
nottoobig.shtml
Page with the ridiculous image:
waytoobig.shtml
Resizing using GIMP
Simply follow the screenshots.
