Step 2) Slicing it up~

Once the layout's finished, it's time to slice it into pieces. :D

Take the slice tool and divide your layout up into nice little boxes. They don't have to match up perfectly (since I find it hard to do in Photoshop anyway.) Just make sure you have a slice for each content box and link.

---

Step 3) Fix your slices. By the time I was done, my poor aim gave me around 40-some slices :| I don't know about you, but I definitely do not want a website with a table that have 40-some cells.

So now, go into Adobe ImageReady. (Seriously, I've had this program for the longest time, but I didn't know what it did till lately.)

Zoom in, or whatever you need to do, and fix your slices. :D They snap nicely in ImageReady for me. Use the slice select tool to get rid of any extra slice you don't need. (On the right, slice 30 is a mistake, so I just dragged slice 28 over and eliminated it.)

After I was done fixing it, I ended up with a neat 26 slices. (Okay, that's still a lot more than I normally average, but I guess it's just because the Costrasa site layout is kinda funny looking. >_>;)

Note that every link in the navbar and all the content boxes have their own slice, as mentioned earlier.

>> Next: Coding in ImageReady

<< Previous: Designing the Layout