Part I
Slicing images to create a website.
Slicing is the technique of cutting an image into many smaller images and placing them into a table so they appear as one single image on a website.  By following the steps below you can accomplish this easily.
 
Step 1
1. Design your navigaton bars and buttons using Photoshop. Your design should look something like the one at the top of this page.
2. Your page should have 15 buttons and a web safe background. You will need to write down a code for the color. For example the color of this background is fad46d.

Step 2
1. Click on the icon at the bottom of the toolbar. This opens the current file in Adobe Image Ready.
2. Use the selection tool to select the area you want to slice then go to SELECTION > CREATE SLICE FROM SELECTION.
3. When you are done, pull down the file menu and go to save optimized. Save the files in a folder inside your root folder.
 
Step 3
1. Open Dreamweaver , pull down the site menu and go to your site. Open the index.html file.
2. Pull down the modify menu and go to page properties.
3. Change the background color to the same web safe color as your design.Step 4 Creating the roll over1.
It is now possible to select individual parts of your design in dreamweaver. Select the first button and hit "delete" on the keyboard.
2.
Go back to the desktop and find the correct image for the button you just deleted. It will be in your web folder.
3. Open the image up into photoshop
4. Pull down the image menu. Go to mode and choose RGB.
5. Modify the image to create the roll over image.
6. When you are done, pull down the file menu, and go to save for web.
7. Save the file in your web images folder. Name it rollover1
8. Go back to dreamweaver.
9. Click in the empty space you made when you deleted the button.
10. Click on the insert rollover image button in the tool bar.
11. Browse to the orginal image and then the rollover image.
12. Test your work in the preview in browser.