Introduction

This project will give you a chance to practice editing in Dreamweaver and allow you to collect and reflect on your work in this class. You will also use the page to collect and organize links to useful Web sites. This will be graded again at the end of the semester, so you will need to keep it up to date with each project and assignment. Before you begin, browse some examples (note that these are finished, end-of-semester portfolios).

NOTE:  Everything on this page and all of your class work will be live on the Internet on our college server. This content will be available to anybody who types in your URL.  Though we've taken steps to make it difficult, your site might get into a search engine index. Contact me if this is a problem for you.

What to Do

  1. Launch Dreamweaver and open your defined site for the studentweb site [local_root]. (If you are on campus, you will have to import your site definition.) Create a new file named 212portfolio.html in the local_root folder (not within a subfolder).
  2. Give your page a title. The title should be something like "John Doe’s CIS 212 Class Work" (with your name, of course).
  3. Start your page with your name and an image of you.  All images should include Alt text.
  4. Use Modify -> Page Properties to set font face, background color, and link attributes.
  5. Create headings for Assignments, Textbook Lessons, and Links.
  6. Add links to your class work.  This will be an ongoing process – not all links can be made now. Class work so far :
    ASSIGNMENTS
    • Hand Coded HTML page
    • Week 3 practice
    • Week 4 practice
    TEXTBOOK CHAPTERS
    • Chapter 1 (link to MM_DWCS5.5>Chapter01 folder with your completed work)
    • Chapter 4 (link to MM_DWCS5.5>Chapter04 folder with your completed work)
    • Chapter 5 (link to MM_DWCS5.5>Chapter05 folder with your completed work)
  7. For each assignment, add a sentence or two to reflect on what you learned from this assignment.
  8. In a bulleted list, link to a few favorite Web development Web sites. This should also grow throughout the semester. By the end, you should have at least 10 links.
  9. Add a "footer" to the bottom of the page.  (Footer is just stuff at the bottom of a page -  there isn't a "footer" in Dreamweaver or HTML.)  The footer includes the revision date, contact information, institutional affiliation, and the page or site URL.  This helps establish your credibility and provides a way for visitors to contact you. If they print your page, the URL is there in case they want to look at it later.  Here's an example:

    Revised September 13, 2003
    by Albus Dumbledore, albus@hogwarts.com
    for CIS 212, Cuyamaca College
    studentweb.gcccd.net/albusdumbledore

    Hints:
    • Dreamweaver can automatically display the last date the document was revised.  Just select Insert -> Date from the menu and check the box that says to update the date every time you edit it.
    • Use a line break (shift + enter) instead of a new paragraph (enter) in between lines on your contact information.
    • Use a small, sans-serif font for the footer.

  10. Work with your page design to make it attractive and user friendly. To me, this means
    • Simple, harmonious color scheme. Make sure the text color contrasts with the background color (light on dark or dark on light).
    • Simple background -- don't use a busy backgound image, for example.
    • Easy-to-read font face like Verdana.
    • Content CHUNKED by using heading format (h1-h6)

  11. Upload and test your work on the studentweb server. If the file is named and properly uploaded, images will display and links will work. Use this URL (with your username) to test:
              http://studentweb.gcccd.net/username/212portfolio.html

Submitting work

Grading - 50 points

Your URL MUST be http://studentweb.gcccd.net/username/212portfolio.html

Points Requirements
5 URL is correct
20

includes  required elements:

  • title (should show up in title bar)
  • name & image (with alt label)
  • links to class work
  • sentence for each assignment (what you learned in the assignment)
  • links to favorite Web development Web sites and other sites (bulleted list)
  • footer
5 grammar and spelling are correct (sure Shift+F7 to check spelling)
10 Page design is usable and attractive. Page properties have been set using Modify -> Page Properties.
10 Information is well organized into chunks using headings