Using Dreamweaver MX

Slide 1 Standard toolbars and menus Time indicator: gives an approximation of download time of the page Properties panel

Slide 2 Use the Insert, Table menu to insert a base table for the page layout. Cell spacing adjusts the width of the space between the cells. Select the width of the table: if this is not entered, the table will adjust according to the items in the cells and the window size of the browser. Note, it is better to use % rather than pixels, then the table will alter its width to suit the browser window. Cell padding adjusts the space between the edge of the cell and the text. Select the required numbers of Rows and Columns.

Slide 3 The base table you have chosen is indicated by dotted lines. This example has 2 rows and 3 columns. Each cell is used to contain an object: text, image, menu, etc.

Slide 4 Add further text as required in relevant cells. Don’t format the text at this stage. 1. Enter main title. 2. Highlight the text. 4. Centre the text if you wish. 3. Use the drop down menu to format it as Heading 1.

Slide 5 Pressing Return at the end of a line produces a new paragraph. To move down one line, hold the Shift key down and press Return.

Slide 6 1.Enter text for hyperlinks. 2.Highlight required text. 3.Use Insert, Hyperlink menu or use the Properties panel 1.Enter the url for the link 2.Decide upon the target for the link

Slide 7 NOTE: Web servers differ in the way they handle file names. To be safe always use: lower case letters and numbers only and no spaces. Always specify.htm as the file name extension. Enter a Page Title. To save the file, use the File, Save menu. Make sure you save the file in the correct location.

Slide 8 Note: Make sure that any images you want to use are saved in an assets folder which could be in the same folder as the web page. To insert images, use the Insert, Image menu and browse to the required image.

Slide 9 Use a right click on the image to call up image properties. Always describe the image used.

Slide 10 Click on the edge of a table to call up Table Properties. Change table properties as required.

Slide 11 Click on any cell inside a table to call up Cell Properties. Change cell properties as required.

Slide 12 Style Sheets

Slide Click on Attach Style Sheet.2. Click on Browse 3. Select body – css file. 4. Press OK To add an existing style sheet

Slide 14 body.css will change your page defaults so it will look like this

Slide 15 Style sheet one Style sheet two Style sheet threeStyle sheet four

Slide 16 To create your own style sheet 1. Click on New CSS style2. Redefine HTML Tag3. Select body

Slide Select font colour2. Select default font size1. Select default font4. Select background colour