Using Help | Contents | Index Back 292
Adobe Illustrator Help Preparing Graphics for the Web
Using Help | Contents | Index Back 292
Preparing Graphics for the Web
About Web graphics
When designing graphics for the Web, you must consider different issues than when
designing graphics for print. Here are some things to keep in mind:
Color Color is often a key aspect of artwork. However, the colors you see on your artboard
aren’t necessarily the colors that will appear in a Web browser. You can prevent dithering
and other color problems by taking a few precautionary steps when creating Web
graphics. First, always work in RGB color mode. Second, try to use Web-safe colors.
(See “
Using the Color palette” on page 158 and “Loading colors from other color systems”
on page 166.)
File size Creating small graphics files is essential to distributing images on the Web. With
smaller files, Web servers can store and transmit images more efficiently, and viewers can
download images more quickly. You can view the size and the estimated download time
for a Web graphic in the Save for Web dialog box. (See “
Using the Save for Web dialog box”
on page 305.)
File format The format in which you save a Web graphic determines the size and display
characteristics of the file. In general, Web graphics formats fall into two categories: bitmap
and vector. The bitmap formats—GIF, JPEG, and PNG—describe artwork as a series of
colored dots called pixels. Each pixel in a bitmap image has a fixed size and is therefore
resolution-dependent, meaning that dimensions of the image depend of the resolution of
the monitor on which it is viewed. The vector formats—SVG and SWF—describe artwork
mathematically, as a set of geometric objects. Because of this, vector graphics are
resolution-independent and can be scaled up or down in a Web browser.
Each Web file format has its own characteristics and uses. JPEG preserves the broad range
and subtle variations in brightness and hue found in photographs and other continuous-
tone images. GIF and PNG-8 efficiently compress solid areas of color while preserving
sharp detail, such as that in line art, logos, or illustrations with type. SVG and SWF maintain
high-quality, vector artwork and produce smaller file sizes than bitmap formats. Both of
these formats are ideal for creating animation frames and sophisticated Web effects.
Wo r king in pixel preview mode
When you save artwork in a bitmap format—such as JPEG, GIF, or PNG—Illustrator
rasterizes the artwork at 72 pixels per inch. You can preview how objects will appear when
rasterized using pixel preview mode. This is especially helpful when you want to control
the precise placement, size, and anti-aliasing of objects in a rasterized graphic.
To Next Page
Loading...