Create a webpage using Dreamweaver

create an index.html or homepage

1-Create a new folder on the desktop for your site; name the folder mysite.

The contents of this folder will be uploaded onto the web.

2-Launch Dreamweaver.

First create a new page named index.html that will function as the "table of contents" for your website. Select File / New to create a new page; save the page in your mysite folder as index. html. All the branches and files will link in some way back to this page. Your website will not be visible if this file is not uploaded to the web.

3-When you edit your pages you create a series of branches. Consequently, your links to graphics, pages, and folders can be broken or altered if you edit your pages outside of a contextual framework. In other words, you will use Dreamweaver’s sitemap to simplify the process of building a website, of creating branches. The sitemap provides an overview of the files used in the entire site and facilitates the linking of pages.

4-As you create your site, try to follow the 8.3 naming convention used in the PC environment.

(8 characters for the filename. 3 characters for the file extension, i.e. myimage.jpg).

Use lower case and shorter filenames to avoid confusion and don’t use symbols, spaces, or punctuation in the filename.

ADDING A TABLE

The Insert pulldown menu contains commands for inserting graphics or tables. Select Insert/Table. Insert a table with one column and 20 rows. Set the border to zero.

You can use the Property Inspector–Window / Properties to alter parameters for the table or the graphic. Highlight the table along its outside border and select Center from the Align menu in the Property Inspector.

You can also use the Modify pulldown menu. Locate the command for Modify/Alignment/Center to center the table on your webpage. Select Modify / Table to add columns or rows to your table as needed.

Once you have your table in place, you can then insert text links into the table cells.

Click on the folder icon to select the Local Root Folder. Select the mysite folder that resides on your desktop.

Local Root Folder : mysite or UTD_site

Enter your web address with your UTD user ID

HTTP Address:   http: //www.utdallas.edu/~yourUserID/index.html/

to upload files using the PUT command in the Dreamweaver site window.

3-Select site map layout in the site definition dialogue box--see list at the left of the dialogue box.

Locate your new file named index.html to set your homepage.

Home Page: UTDsite : index.html

4-In the site definition dialogue box select Web Server Info or REMOTE Info

Server Access: FTP

FTP host: ssh yourUserID@apache.utdallas.edu

host directory: public_html/

login: yourUserID

password: .......

Leave the password area blank when working on a shared computer.

5-To change these settings or to inspect them, select Site / Define. Choose mysite from the menu and click on the Edit button. Select Done.

6-To create a site map select Site / Create Site Cache or Recreate Site Cache.

To toggle between the site map and the site files select Window / Site Map or Window Site files.

To update the site map select the Refresh command under the Site/ Site Files View or Site / Site Map View / Layout.

PREPARING YOUR GRAPHIC USING PHOTOSHOP

In Photoshop flatten your file; select Save for Web.

Select appropriate jpeg or gif compression settings to balance quality and filesize. Reduce the image size by clicking on the Image Size tab. Change the pixel dimensions so the image is under 400 - 600 pixels in length or width. Select Apply to reduce the image size. Select Save, and save the image to the mysite folder.

1-Open the Site Files Window. Open your index.html or another page. Open the Property Inspector.

Highlight a word on your homepage, index.html, while keeping the Site Files Window and the Property Inspector open.

Here are several methods to create links:

B.Hold down the SHIFT KEY while simultaneously clicking on the highlighted text.

Keep holding down on the mouse. DRAG the mouse to the open site files window and release the mouse over the webpage you want to select. That’s it. You’ve made your link.

C. You can also create a link by highlighting a graphic or text element. Then click on the small circle, point-to-file icon, near the Link entry box inside the Property Inspector. Drag the line to the appropriate page.

2-When you hold down the CONTROL key, you will gain access to a contextual menu allowing you to edit your link.

3-The Properties Inspector will allow you to review the link from text or graphic elements to your selected pages.

4-Select Site/ Recreate Site Cache. Here you can see the links as redefined in the site map.

Select File / Preview in Browser / Safari or Internet Explorer to view page. You can also use the hotkey F12.

Select View/Code to view source.

Select View/Code to view source if you prefer to edit the html directly. Select View/Design to return to design.

USING DREAMWEAVER: