Image basics

It's important to use image formats which can be displayed by a variety of browsers on all major platforms. Generally speaking, this means that your images should be in either GIF or JPEG format.

As a general rule, your graphics should be as small as possible (in terms of file size) in order to minimize the time your users spend waiting for pictures to download. You can use either Photoshop, Debabelizer, or various shareware programs to convert your graphics to GIF or JPEG format. You can use other formats in your pages, but some viewers will not be able to see them.

You may want to investigate palatte issues in order to optimize your graphic files. For example, the Macintosh system palatte contains 256 colors. Windows has a system palatte too, but it's color values don't exactly match. For this reason, Netscape uses a 216 color palatte which the two operating systems have in common. You may want to index your images to this 216 color palatte instead of the system palatte in order to insure that your graphics look the same on both Mac and PC machines.

More details about:

An in-line image is a graphic which loads into a page automatically. The tag used to reference an in-line image is:

<img src="/~boom/jpeg/petrodude.jpeg" alt="A nice picture." height=160 width=120 align=bottom vspace=5 hspace=5 border=0> The first part up to and including the path in quotes is all that's truly necessary. If the image you are loading is in the same directory as the page which references it you don't need to include a path. The height and width parameters speed up the display of a page by telling the browser how much space to allow for the image. The align parameter can be set to bottom, top, or middle in order to specify which part of the in-line image is aligned with any text which appears on the same line.

A bit about how the break tag works with floating images.


Building Web Sites - ITP Winter 1999 - Mike Cosaboom, Instructor
mc39@acf2.nyu.edu