Name:
Hour:
First, let’s recap the six steps of developing a design plan for a Web site:
Step 1—Define the purpose
Step 2—Identify the audience
Step 3—Plan the content
Step 4—Plan the structure
Step 5—Plan the Web Pages
Step 6—Plan the Navigation
Step 1—Define the Purpose
A. List the Goals and Objectives of the Website by listing a page-by-page outline of the exact topics/subjects/content you plan to cover:
Step 2—Identify the Audience
A. Identify your audience and develop a preliminary audience profile:
1. Who would be most interested in your message, and why would
they be interested?
2. Are they seeking entertainment? Answers? Interaction?
Products/Services?
1
Name:
Hour:
Step 3—Plan the Content
A. Value-Added Content: Must add value, not merely volume. Reminder:
text is the PRIMARY component of a Web site!
1. What accurate, high-quality content should you add that would
relate well to the site objectives, as well as be informative and timely?
Make sure to fill this section out in detail! Using different pages in Word, write out all of the content for each of your pages.
Write in 3 rd person objective voice. If you intend to create a table for any portion of a page, create the table, showing all
content but omitting pictures. Please attach all your content pages to this completed 6-Step Design Process.
2. Study your audience profile—what content would they want and
could they use? Any links, forms, or charts needed?
B. Photographs & Multimedia: (A combination of text, graphic images, animation, audio, or video.)
What animations, audio, video, or dynamically generated content can be added that relates to the site objectives?
Step 4—Plan the Structure How will the information be organized and linked from page to page? On a sheet of paper, draw a flowchart showing
the button names and the flow of the Web site.
2
Name:
Hour:
Step 5—Plan the Web Pages
Establish a visual connection between the home (default) page and secondary pages. For the most part, it is recommended that a white background is best for readability. Your site should be very professional; therefore, maintain the same color scheme throughout the site. Go to this site http://wellstyled.com/tools/colorscheme2/index-en.html
to checkout different color schemes.
Is there color on an existing business card, letterhead, logo, or Web site?
1.
Color Scheme : (Remember limit colors in your scheme to 3.)
Just indicate using words (light blue, dark blue, teal, etc.)
Background:
Headings:
Text color:
Color Scheme
Other:
Navigation bar:
Subheadings:
Accent color:
2. Layout—Create unity and consistency : Sketch out on a sheet of paper a layout for both a home (default) page and ONE secondary page, using the table below as a guide as to what to label.
Make sure to include all items below in your layout sketch!
1. Logo placement (if applicable)
2. Heading placement
3. Subheading placement
4. Buttons —Specific wording
5. Text placement
6. Navigation bar
7. Graphics placement
8. Bottom links (for if scrollable page)
9. Top of Page (for if scrollable page)
10. Co pyright notation and Contact info. (per customer’s request)
3
Name:
Hour:
Step 6—Plan the Navigation
A. Exactly what will your navigation design be? Please state the format of your navigational links, for example: vertical bars, horizontal placement in a button (table) bar, images separated by borders, etc.
1.
Main Navigational links
Use CSS (tables or divs) to control page layout.
Set up a “template” page complete with navigation links from which all secondary pages can be constructed.
4