Dear Friend,

Hello & welcome back to Firewire, your friendly guide to the exciting world of web-design & web-solutions!

In the previous Newsletter we had covered how to create mouse over effect after slicing & optimizing the layout using Adobe Image Ready. In this Newsletter we will be covering How to create a Web Page using Layers.

A layer is a container that can hold text, images, tables, other layers and various types of multimedia. It gives more control and flexibility to make the page dynamic. For Example you can make Picture Gallery, Products Catalogue, Portfolios etc.

To make the tutorial practical & easy to understand we have created Products Catalogue as an example in Photoshop & Converted into HTML format. Click here to download the layout.

After downloading the layout follow the steps given below:

1. Open the Layout in Photoshop. Keep separate Guides for each Image, Slice the whole Layout and Save the images in jpeg, gif or png format.

2. After saving the Images in jpeg, gif or png format, then open Macromedia Dreamweaver.

Click the Insert Table Button on the Common Category of the Objects Panel, or Choose Insert > Table.

If the Objects Panel is not visible, Choose Window>Objects.

The Insert Table dialog box appears.

In the dialog box, type the values and click OK to create the table. With the help of tables place the images accordingly to the layout.