GEOG 261 Spring 2004 Creating a WebPage Tutorial Create a master page to model all other pages after.

Start the program and save right away. (I recommend saving with the name master.htm or template.htm) 1) Insert a table (From the menu bar: Insert-Table) Use pixels instead of % of window and keep the size between 600-700 pixels. If you want the table outline to be visible to the viewer, enter a number > 0 in the Border box. To modify the table after it has been created, go: Table Table Properties (You can also right click and select Table Properties or Table Cell properties.) In Dreamweaver, the Properties box will always be visible by selecting Window-Properties or right clicking and selecting properties.

The Properties Inspector allows you to adjust the Tables size, color, alignment, font, etc. I recommend arranging your table similar to the one in the picture.

Properties Inspector

Create the Navigation Bar Along the left side of the table is a convenient place to display your links to other pages. (You can also place it along the top or bottom, but you MUST have a navigation bar on all pages.) Type the name of your link and then highlight it. In Dreamweaver, you can type the links address in the Properties Inspector. In Composer click the Link icon or go Insert Link Make the URL relative to page location.

If the link is to a site outside of yours, use the full address. (i.e. http://www.macalester.edu).

ORGANIZE!! Place your home page immediately in the main folder. It can be easier to avoid simple mistakes if you only use one folder. If you use subfolders, save images for that page within that folder. (you dont have to, but it can help avoid source mistakes)

Insert Images All images displayed on the page MUST be saved within the folder. Insert an image by Insert Image The image source should be relative to the document.

The image source should look like And should NOT look like DO NOT use spaces in the names of images or pages. Use an __ underscore instead. Add Contact Information To make a link a contact (email) link, select the text you want, and in the link address put: mailto:name@macalester.edu Wrapping Up Fully design the layout of one page and use it as a template for all your pages (you may want to save two copies of your master page just in case you accidentally save over it). Now you might have something that looks similar to this: It doesnt have to look like this, but Its a simple base layout to help you get started.

Checklist: _____ Name your main folder with your first initial and last name (or network username) _____ Name your home page index.htm _____ Make sure all image sources and links between pages are relative! You need to be able to move your folder and still have everything work. _____ Turn in your webpage in the course folder (DO NOT put it in the Dropbox because I do not have access to it) Programs to use: Dreamweaver Netscape Composer Microsoft Frontpage Librarys Imaging Annex Lab has Dreamweaver on its computers and the Geography Department has three computers, all with Dreamweaver on them. Netscape Composer is a part of Netscape 6 and above and found on numerous computers on campus.

Need Help?: jspencer@macalester.edu Office Hours: Monday and Wednesday 1-5:00 pm in Carnegie 104 (Geography Dept) If these times do not work for you, feel free to email me and well work something out.