IV. INSERTING AND USING TABLES

IV. INSERTING AND USING TABLES
A. WHY USE TABLES
Tables help you divide the space on your page. They are similar to tables in Word or
Excel but can be used in much more flexible ways. Tables give you the option of making
your page a fixed size or making it fit to the user's window the best it can. Tables also
guarantee that the location of your text and images does not change when seen on screen with different resolutions or in different Web browsers.
B. HOW TO INSERT A TABLE
To insert a table, follow these steps:
1. In the main menu, click Insert > Table. (See Fig. 3)
2. Insert the amount of Table Rows and Columns
3. Set Table width to between 600 and 800 pixels.
4. Set Border thickness. To have a visible border type in 1 or higher, to have no
border type in 0.
5. Cell padding adds room inside of a cell. Enter 0 for no space or a number to
Increase the space.
6. Cell spacing adds space between cells. Enter 0 for no space or a number to
Increase the space.
7. Click OK.
C. PROPERTIES OF TABLES
Properties of a Table Itself
If you click on one of the table borders, you can view your table properties in the
Properties window.In the top section of this window (Fig.4) you can:
• name your table;
• change the number of rows and columns in the table;
• change the width and height of the table,
• Change the Cell Pad: this is the number of pixels that come between the border
of cells and the content of cells.
• Change the Cell Space: this is the number of pixels that come between the
borders of each cell.
• Change the alignment: this is the position of the table on the left or right edge, or
in the center of the page.
• Change the border: this is the number of pixels that make up the thickness of cell
borders.
In the bottom section of this window (Fig. 4 above) you can:
• Clear and convert table widths and heights.
• Change the background color of the whole table.
• Insert a background image for the whole table.
• Change the border color.

III. DESIGN AND LAYOUT

III. DESIGN AND LAYOUT
Even if you are creating only a simple Web site, you should begin by sketching out the
layout of your site. Decide where you want titles, images, navigation buttons, and text to
appear on the screen. Most web sites have the same design characteristics on every page. For example, Web site titles are usually in the top left or top center, while navigation buttons usually appear vertically on the left or horizontally below the title. In addition to sketching out a layout for each page, you should determine how many pages you will need for the Web site. Thorough planning is essential to good web design.
In order to get your text, navigation buttons, and images to appear where you want them
on the Web page; you need to use tables to format content of each page. Everything on
each page of your Web site should fit within one large table.
Using your layout sketches, you can determine what your table needs to look like.
Fig. 1 shows a simple layout sketch.
Fig. 2 shows the same layout, with table borders drawn in.

II. CREATING A WEBPAGE

II. CREATING A WEBPAGE
To create a Web page, follow these guidelines:
1. Choose a page to be the homepage of your Web site. This will be the first page that
users encounter when they visit your site. Save this file to your local root folder as
home.html. Naming the homepage home.html tells the Web browser that this is the first
page it should open when someone visits your site.
2. To add a new page go to File > New and choose a basic HTML page. Save this page
by clicking File > Save As. Name the first page home.html
3. After your homepage is created, you can use this page as a template layout for all the other pages in your site. Simply hit Save As and name the file whatever you wish, but be sure to keep the name simple, for example CV.html, resume.html, pictures. etc. Remember not to use capital letters or spaces when naming files; this will make it easier for web browsers to find your files.
4. To save the pages of your site simply click File > Save for each page. Make sure your
homepage is named home.html, and save all of your files in the folder you chose when
you defined your site, i.e. in your local root folder.
NOTE: This process will save your files to your local site. You can transfer each file
separately to the remote site or transfer the entire site once you have finished working
on it.
III

GETTING S TARTED 2

4. Make sure that all your pages and images are saved in your root folder, or they
will not appear the next time your website is opened.
5. Now you are ready to launch Dreamweaver CS3. Click the Dreamweaver CS3 icon from Start > Programs > Macromedia Dreamweaver CS3. Or use the Adobe Dreamweaver CS3 Icon on your desktop.
N.B: The most important step you need to take every time you launch Dreamweaver CS3 is to define your Local Info. The "local root folder" is the name for the folder where you are storing all of your website’s contents.

GETTING S TARTED

GETTING S TARTED
First, you need to decide what you want to put on your website: images, files, videos,
PDF documents, PowerPoint presentations, etc. To create and maintain an organized
website, you need to establish a hierarchy of folders that contain all of the components
that make up your site. This folder is called your Local root folder. It is important
because this is where Dreamweaver looks for all your files.
To create a root folder, follow these steps:
1. Create a new folder on your desktop or personal partition. On the desktop, right-click and choose New Folder.
2. Give the folder a brief, but descriptive name. Do not use capital letters, spaces, or
special characters when naming folders and files for your website. All of your pages will
be saved within this folder.
3. Open the folder, and create another new folder inside. Name this folder images. Put
all of your images, buttons, movie files, etc. inside the images folder.