DreamWeaver MX Instructions

I. Your NETID account.

Your Oakland University Computing Account includes your email directory and your web directory in one account. If you don't have an Oakland University email account, go to: http://www.oakland.edu/uts/helpdesk/docs/html/emailaccount.html

II. Dreamweaver--set up New Site

         1. Choose Site and then Manage Sites. Click on New and then, in the DropDown Menu, click on Site.


         2. Then click on the Advanced tab if it is not already chosen.


3. Enter a name in the Site Name box. It is only for your reference. In the Local Root Folder box, specify where on your own local computer the site's files will be stored or leave the default. Click the folder icon to select the proper folder. Create a new folder from within the file-browsing dialog box.

         4. In the HTTP Address field, enter the URL that your completed Web site will use. This is optional, but filling it in means that Dreamweaver can verify links in your files that use absolute URLs.


         5. Click on the dropdown menu by Server Access: FTP

         6. If you have a NETID account, fill out the following boxes as in the fig. below. The html folder is where all webpage material is stored and has public access, so can be viewed across the internet. If your public access folder hasn't been created yet, to do so follow the instructions at: http://www2.oakland.edu/oucommunity/sftp.cfm

Click OK.


III. Create a Dreamweaver webpage

1.    Click on File and then New. Click on HTML. Save immediately, since Dreamweaver often doesn't let you continue to add elements unless you have saved first. Click File and Save As...

2.    Click on the second icon from the left (Split). This will allow you to see the HTML code in the top box and the WYSIWYG (what you see is what you get) view in the lower box

3.    Fill in the Title box for this webpage. This will show up as the bookmark name in browsers, but not on the webpage.

4.    Click on Modify and then Page Properties.

5.    With Appearance chosen, fill out the form choosing your font, size, and colors. A san sarif font is easiest to read on the backlit screen of a computer. So Ariel has been a popular choice for webpages. Dark text on a light background is also easier to read than light text on a dark background.

6.    If you'd like to use a background image, the appropriate .gif or .jpeg file should have been downloaded or created and stored on your computer in the same folders as your webpages. The image will be tiled completely over your page, so the seams should match, it shouldn't be too busy, it needs to be color compatible with the text, and the size should be no more than a couple of KB for fast download speed. Click on Browse...and search your local computer for the image. It's file title, appropriately named as a file like filename.gif, without any spaces or punctuation other than the period before gif or jpeg, should show in the window.

7.    Choose the margin size and then click Apply.

8.    Choose Links and Headings and choose those fonts.

9. Type in a heading on the new page. Choose the text and in the Properties box, format by choosing Heading 1 and click on the icon to the right for Align Center in the bottom properties box and type a heading on your webpage.

10. Create a Link: Type Oakland University on your page and then choose the text. In the link box in the bottom properties box, type http://www.oakland.edu and click on Enter or Return. This is now a live link if you preview it in a browser or upload it to the Web.

IV. Rollover buttons

1.    A rollover button is a link that looks like a button and changes appearance when your mouse moves over it. Click on Insert and then Media and then Flash Button.

2.    Fill out the box as in the fig. below. Choose any style. Type in a name or text for the button. Put in the link URLãthe page you are linking to. The target is the type of window in which all linked documents should open.

      -blank loads the linked document in a new, unnamed browser window.

      -parent loads the linked document into the parent frameset or window of the frame that contains the link.

      -self loads the linked document in the same frame or window as the link. This target is the default, so you usually don't have to specify it.

      -top loads the linked document in the full browser window, thereby removing all frames.

Then click OK.

3.    Save  and click on File and then Preview in Browser.

V. Rollover text

1.    This is very much the same as a rollover button, except that rollover text allows you to create text that changes color when you roll over it with the mouse. Click on Insert and then Media and then Flash Text.

2.     Fill out the box as in the fig. below. Choose any style. Type in a name or text for the button. Put in the link URLãthe page you are linking to. Then click OK.

3.    Save  and click on File and then Preview in Browser.

VI. Uploading Files

1.    Once you have saved your files, you will need to upload them from your local computer to a remote server or the network so other people can see them on the Web.

2.    Your folder with the Dreamweaver and image files within it should appear on the right under the Files palette.

3. Click on the Expand/Collapse button on the far right to see both your local files you're created in Dreamweaver on your local computer and the remote site or directory on an Oakland University server.

4.    Select the folder or files you want to upload.

5.    Click on the icon of two disconnected plugs (Put File button) at the top of the window to connect to the remote directory server.

6.    Click the blue arrow which points upward to upload the files.

7.    A box appears about Dependent Files. If you want to upload all images and other relevant dependent files, click yes. If those types of files already exist in your remote directory, and you're simply making a small change to the webpage, click no.

Download File--Click the Connects to remote host button to display your remote directory. Then select the desired file(s) and click the green downward-pointing arrow  Get File button.

Delete Files--Choosing the File and click the Delete key.

VII. The Web Address of the Published Site

If your main Web page file is called index.html your Web page address is:


where account is your campus email account login (for example, ~cheal).

The Web page address for any page other than index.html is http://www.csun.edu/~account/filename.html

  Where account/filename is your campus email account login and then the name of the file you created and put in your public_html directory (for example, ~hcarh001/myfile.html

  Most webpages need the file type, .html, after them. Your main page should be named, index.html.