Explicit changed size sample

Below, each of the images has been given an explicit size in the HTML, but the width is specified to be 1/2 of the intrinsic value.

Geometric shapes are squashed horizontally and some vertical lines in text are missing. The house image is compressed horizontally, making it look tall and narrow.

Note in the resulting images:

Shapes have been distorted because the 1:1 aspect ratio of the original image has been changed.
The reduction in width has caused columns of the image to be discarded. Thin shape outlines may vanish altogether, while diagonal lines are more jagged than in the original.
The effects are more pronounced on geometric objects and straight lines.

In the images below, both the displayed height and width have been reduced to 1/5 of the original to create thumbnails.

Borders of geometric shapes appear sporadically and text is unreadable. Although less detail is visible, the image of the house and trees appears normal.

Note in the resulting images:

There is no distortion because both height and width were changed by the same percentage.
Fine details, such as shape outlines and text, become unrecognizable.

Also recall that this technique will cause download of the entire large image, though only a fraction of that data will be used.

Below are the same images, resized using an image editor and displayed at their new intrinsic sizes. They require about 8% of the file size of the images just above.

Borders of geometric shapes appear sporadically and text is unreadable. Although less detail is visible, the image of the house and trees appears normal.

Last revised 30 Jan 2006