Slice A Web Page; Convert Auto And Layer-Based Slices To User Slices; View Slices And Slice Options - Adobe Photoshop CS6 User Manual

Slice a web page

You can use the slice tool to draw slice lines directly on an image, or design your graphic using layers, and then create slices based on the layers.
Create a slice with the Slice tool
1. Select the Slice tool . (Press the C key to cycle through tools grouped with the Crop too.)
Any existing slices automatically appear in the document window.
2. Choose a style setting in the options bar:
Normal Determines slice proportions as you drag.
Fixed Aspect Ratio Sets a height-to-width ratio. Enter whole numbers or decimals for the aspect ratio. For example, to create a slice twice
as wide as it is high, enter 2 for the width and 1 for the height.
Fixed Size Specifies the slice's height and width. Enter pixel values in whole numbers.
3. Drag over the area where you want to create a slice. Shift-drag to constrain the slice to a square. Alt-drag (Windows) or Option-drag
(Mac OS) to draw from the center. Use View > Snap To to align a new slice to a guide or another slice in the image. See Move, resize, and
snap user slices.
Create slices from guides
1. Add guides to an image.
2. Select the Slice tool, and click Slices From Guides in the options bar.
When you create slices from guides, any existing slices are deleted.
Create a slice from a layer
A layer-based slice encompasses all the pixel data in the layer. If you move the layer or edit the layer's content, the slice area automatically
adjusts to include the new pixels.
A layer-based slice is updated when the source layer is modified.
Layer-based slices are less flexible than user slices; however, you can convert ("promote") a layer-based slice to a user slice. See Convert auto
and layer-based slices to user slices.
1. Select a layer in the Layers panel.
2. Choose Layer > New Layer-based Slice.
Don't use a layer-based slice when you plan to move the layer over a large area of the image during an animation, because the slice
dimension may exceed a useful size.

Convert auto and layer-based slices to user slices

A layer-based slice is tied to the pixel content of a layer, so the only way to move, combine, divide, resize, and align it is to edit the layer—unless
you convert it to a user slice.
All auto slices in an image are linked and share the same optimization settings. If you want to set different optimization settings for an auto slice,
you need to promote it to a user slice.
1. Using the Slice Select tool
2. Click Promote in the options bar.
You can promote an auto slice in the Save For Web & Devices dialog box by unlinking it. See
Devices dialog box

View slices and slice options

You can view slices in Photoshop and the Save For Web & Devices dialog box. The following characteristics can help you identify and differentiate
, select one or more slices to convert.
Work with slices in the Save For Web &
To the top
To the top