|
Full Website Layout - Slicing your image for exportation |
|
Sunday, 01 January 2006 |
|
Full Website Layout Photoshop - Slicing your image for exportation This tutorial is the second part of a 3 parter. This will guide you through how to slice your template in Photoshop ready for exportation to HTML.
| 1. | Open your document again, if you haven't already. |
| 2. | Select the slice tool  |
| 3. | Now you can cut up your template. We have 3 main areas to cut first. We have the header and navigation, the main content area and the footer. See here for example |
| 4. | Now that we have the 3 main sections set out, we can put more detailed slices in, especially on our navigation bar. View example here |
| 5. | Once you have finished slicing go to File » Save for Web |
| 6. | On the left select the save settings you want. I am using JPEG with quality set to 80 and blur set to 0.
I have this set as a Preset. You can download the PSD file here |
Go To Part 1 | Go To Part 3 |