From Photoshop to Dreamweaver

Hi everyone, This is another one of my tutorials, Just for AK pro.

Firstly, you will need the website you are going to slice and make into a HTML template. I made a stupidly easy one, just as an example. This tutorial is GREAT with the extreme templates :)

Ok now we have designed our website... Now we need to transfer this into ImageReady. You can use the shortcut on the tools bar or use the shortcut, Shift + Control + M - or just load the PSD in imageready.

Ok now we should be in imageready with our new website. To start making the website, we need to slice our template. So grab the slicing tool and just mark out what buttons (EACH ON THEIR OWN) and etc we are going to want in different images. Remember to make the content box another slice.

Roll-over not needed, optional

Now, move over to your Slices tab/window (Web Content). This one just shows which bits you have sliced. First up we will make one of our buttons a ROLL OVER!

This process is simple. Right click on the layer you want to rollover, right click and do ' Add Roll over state. '

After You have made a rollover state, Click on the ' Over ' state - then All you need to do is change whatever you want it to rollover to. for example, If i wanted the yellow dot to turn blue, I'd click Over - then find which layer that dot is on, Recolour it to blue, then thats it.

Do this for all layers you want rollovers on.

If you skipped rollover buttons, continue here

Ok, now you have your new website pretty much done. All the rollovers are done and your slices are complete. Now, how are we going to make it a website? Simple.

Open the .html File in DreamWeaver or your faveourite HTML editor.

Thank you for you time.