Dreamweaver: Working with Tables Tutorial

Using Tables to Design a Page Layout Tutorial
(Chapter 2)
HTML tables are an excellent solution for designing web page layout, because they are easy to modify and compatible with most browsers. You can use tables to structure the layout of content or to set the display of visual elements (such as images, rollover buttons or paragraphs of text). This tutorial focuses on using tables as a page layout element.

In the first section of the tutorial, you work in Standard view and insert a table in a page. In the latter section, you work in Layout view, where you use layout options to draw a table and table cells to design the layout.

Click here to download an Adobe Acrobat PDF file of the tutorial.

HTML Tables

When working with html tables in Dreamweaver, here are some points to keep in mind:
1. The table above has 5 rows (horizontal) and 5 columns (vertical)
2. The table itself can be left justified, centered and right justified
3. The table has a width and a height (measured in pixels)

4. Each individual square is called a "table cell"
5. Each table cell:
- has a width and a height
- the content of each cell can be left justified, centered, right justified and justified horizontally
- the content of each cell can be vertically positioned to begin at the top, middle and bottom
- each cell can be coloured
- cells can be merged together, added or deleted using the Properties Palette

Image Alignment and Image Maps Tutorial (Chapter 3)
Working with images in Macromedia Dreamweaver MX is quite easy. You can use various Dreamweaver visual tools to insert an image. This tutorial presents you with image options you can apply once an image is inserted in a page. You will learn about aligning images and text, and setting space around an image. You’ll also learn how to use a single image to link to multiple web pages.

This tutorial is designed for beginning Dreamweaver users. It covers some basic features in Dreamweaver and will help you understand how to align images, as well as how to create an image map.

Click here to download an Adobe Acrobat PDF file of the tutorial.