Operation Manual

389

USING ILLUSTRATOR

Web graphics

Last updated 11/8/2011

For more information, see “Drawing pixel-aligned paths for web workflows” on page 61.

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 by choosing View

> Pixel Preview. This is especially

helpful when you want to control the precise placement, size, and anti-aliasing of objects in a rasterized graphic.

To understand how Illustrator divides objects into pixels, open a file that contains vector objects, choose View > Pixel

Preview, and magnify the artwork so that you can see its individual pixels. The placement of pixels is determined by

the pixel grid that divides the artboard into 1-point (1/72 inch) increments. You can view the pixel grid if you zoom in

to 600% view. If you move, add, or transform an object, the object snaps to the pixel grid. As a result, any anti-aliasing

along the “snapped” edges of the object (usually the left and top edges) disappears. Now deselect the View

> Snap To

Pixel command, and move the object. This time, you’ll be able to position the object between the grid lines. Notice how

this affects the anti-aliasing of the object. As you can see, making very minor adjustments can affect how the object is

rasterized.

Pixel Preview off (top) compared to on (bottom)

Important: The pixel grid is sensitive to the ruler origin (0,0). Moving the origin of the ruler will change how Illustrator

rasterizes artwork.