Comprehensive Web Design
Fall 2002 - Spring 2003
https://ehollywood.net/dhima/handouts/class8.htm

Class 8 Handout

Dreamweaver Lesson 2. Website structure. Defining a site and creating a sitemap. Basic webpage creation: inserting images, adding text, assigning page properties. Understanding paths. Chapters 3 and 4 of the class book.

1. Review of homework -
We will discuss what we are planning to do for our mid-term website project.

2. Defining a site/site management -
(We will follow the exercises in the book)
1.The local root directory and remote site:
a) This is main directory/folder where you are going to keep all your HTML and image files that make up your website. It should contain subfolders with your images or secondary sections of your website.
b) You should keep all your files in your "local root directory" or you will have problems while using Dreamweaver.
c) The remote site is where you will be uploading the files from your local root directory. The breakdown/architecture of your remote site will mirror your local site with the exception of Photoshop Psds (or backup/older files).
2. Relative and Absolute Links
3. File and Folder Management
4. Understanding Path Structure
5. Creating a Site Map
6. Creating a Site from scratch. - We will call it "project". This will be where our mid-term project will go. Let's assign the remote site to be your personal directory online and create also a "project" folder.

3. Let's start development of our Midterm Project Websites -
1) Write an outline in Dreamweaver that describes the content and site structure of your project website. (The outline should like my class handouts using numbers( 1) for sections and letters (a) for subsections. This will eventually become your "flowchart". Call it "outline.htm".
2) Sketch a rough homepage on paper that shows the title, menubar with buttons, and some content. Where will your menubar be (on the right side, top, bottom)?
3) In Photoshop let's create "placeholder" artwork of approximate sizes and shape of what you think these elements will actually be and call them appropriate file names (ie. "menubar.gif") and save them in an "images" folder.

HOMEWORK ASSIGNMENT:
1) Create a webpage that includes these elements with placeholder text for the copy.
2) Call it "index.htm" and save it in your local "project" folder.
3) Experiment with different colors and choose three websafe colors(not including black/white) that you would like to work with (like we did for Wayne's Site). Create a "swatch" with them and their hexidecimal equivalent and save it as "project_colors.psd" in a "psd" folder in your "images" folder. (note: You can change these colors later once you have a better understanding of the "look and feel" of your website.
4) Put your "outline.htm" and "index.htm" file on the web in your project folder and email me the URL so I can make comments.