Best Practices for Web Images

Images can greatly improve the quality and value of a web page. But sometimes, web page designers, like beginning artists, sometimes don't know when to stop.

In the same way that bad graphics sometimes spoil good printed materials if improperly used, photos and diagrams need to be used carefully and judiciously so that they do not impair a web page's usability and accessibility.

The following formats should be used for images:

• PNG (Portable Network Graphics) - suitable for all image types
• JPEG (Joint Photographic Experts Group) - suitable for photographs and other images with many colours and tones
• GIF (Graphics Interchange Format) - suitable for diagrams and line drawings

Insert images either as the first item in a paragraph or within the cells of a table. This allows the text to align itself properly with the paragraph to be viewed.

For best effect, images should be aligned to the right margin when used in paragraphs by setting alignment to right.

Ensure that every image is associated with alternative text by setting alt to a simple description of the image's content (roll over example above for ALT text).

Images should be as small as possible whilst not adversely affecting their quality and value.

Moving images should be avoided as they cause accessibility problems in low-bandwidth situations, increase download times, and distract the reader's eye from the text.

Best Practices for Images for Print

Preparing Images for Print

• TIF or TIFF (Tagged Image File format) - The most common and portable format for saving bitmap scans.
• EPS (Encapsulated PostScript) - used for saving vector-based art (line art such as logos) or raster (bitmaps which can't be scaled or edited) options. If your image has type and you choose to save it as an eps (so your type will stay sharp) you should first convert the type to outlines so anyone who doesn't own the typeface will still be able to print it correctly.
• SCITEX: used by Scitex imaging systems. You can open these files in Photoshop.

• JPEG (Joint Photographic Experts Group) - JPG files should be converted to TIFs as soon as they’re opened if you plan to use them in printed documents. Saving files in the compressed JPG format means you’re compressing them every time you save them. Saving as a TIF file helps avoid this loss in quality.

Before you use a JPG file, check the image size to ensure it hasn't been compressed to the point where "artifacting", image corruption, is an issue. Also check to see whether the image is CMYK or RGB. If you're printing in 4-color and it's RGB, convert it and make the necessary adjustments BEFORE it goes to the printer so there will be no surprises.

• BMP (Windows bitmap) - Quality will probably suffer if you reduce or enlarge the image.
• PICT: Macs use this as a default for images. Used for video or multimedia, images are not print quality.
• GIF (Graphics Interchange Format) - Acceptable if you're preparing line art or images for the web. It is not a good choice for print because it only uses up to 256 colors.

Check with the professional who is printing your document. Different printing presses can use different line screens.

Any image to be printed by a professional printing service or even a laser printer at the local copier service should be scanned or reproduced at a high resolution, generally above 300 dpi (dots per inch). Most web images are between 72 and 96 dpi.