The Photoshop documents (.psd) that come with your template package consist of large number of layers that are embedded into a design giving the look of a single image. This design is cut up into individual .jpg or .gif ../images which are put back together again using HTML coding to create your web pages. Using slices creates individual, flattened (no layers) ../images for your web pages without altering the original .psd file and all its editable layers. Photoshop's Slice tools and Save for Web capability facilitate this process immensely.
The following characteristics can help you identify and differentiate between slices: (see Fig. 1 below)
Define the boundary of the slice. Solid lines indicate that the slice is a user slice (one created by the designer); dotted lines indicate that the slice is an auto slice. Auto slices automatically fill in around user slices as you work.
Differentiate user slices from auto slices. By default, user slices slices are blue, while auto slices are gray.
Slices are numbered from left to right and top to bottom, beginning in the upper left corner of the image. If you change the arrangement or total number of slices, slice numbers are updated automatically to reflect the new order.
The slice tool in Photoshop's toolbar has two options.
Holding your mouse down on its icon in the toolbar will give you the flyout list of the two choices.
The Slice tool allows you to create new slices, the Slice Select tool allows you to select an existing slice to modify it.
With the Slice Select tool, right-click on a user slice (blue) to get these options:
Right-clicking on an auto slice (gray) gives you these:
You may resize an existing user slice by clicking on its number with the Slice Select tool and dragging the small boxes in its boundary, two of which are circled in Fig.4:
Adding a new slice can sometimes be done simply by choosing the Promote to User Slice option (Fig. 3) - if an auto slice happens to fit the area where you want your new user slice.
You may also draw a new slice onto the document using the Slice tool: Click and drag to cover the area you wish to become a slice. (Fig. 5). Let go of the mouse and the new slice boundaries will appear, as well as its surrounding auto slices. (Fig. 6)
To delete a slice, click on its number with the Slice Selection tool and hit Delete on your keyboard.