(1) (2) (3)
One of the major improvements in Photoshop 6/Image
Ready 3 is the power to quickly slice up complex images, export
the slices in either .gif, .jpg or .png formats and place them
within a saved HTML document.
I first created an image for slicing in Photoshop.
It's a header image w/buttons for my imaginary African Safari
company I've dreamed of starting after I either win the lottery
or invent a longer lasting light bulb. Unfortunately, since the
longer lasting light bulb has been created I'm down to the lottery.
By the way, adventuresunlimited.com is already taken and the
image I created has nothing to do with their Web site.
Step 1
Start Image Ready 3.0 and open the image to be sliced. My first step is to
drag guidelines to lay out how I want to slice up my image. Make sure the
'Snap to Guidelines' and 'Snap to Slices' is set. You'll find it in the 'View'
drop down menu. The image below is my final slice plan. It is a little busy.
|
|
|
Use 'Guidelines' to plan your image slicing.
|
Step 2
Select the 'Slice' tool 
.
Now drag a 'slice box around the 'Adventures Unlimited' type. It should snap
to the guidelines. To adjust the 'slice box' put the cursor over the 'Slice'
tool until the sub-menu appears. Select the 'Slice Select' tool 
.
You can now adjust the dimensions of the 'slice box.' Continue slicing the
image until every portion of the image has a slice. As you can see each slice
is numbered. 'adventures_orig.jpg' has 12 slices.
Tip: You can create slices in white or empty
areas. Create them as you would any slice and select 'No Image'
in the 'Type' drop down menu in the Slice Window. In the image
below slices 05, 07, 09, 11 and 12 are 'No Image' slices.
 |
|
Sliced Image
|
(1) (2) (3)
