main menu
announcements
books & stuff
course calendar
description
final project
grades
homework
other resources
Online Course
cism 1213 web design i -- final project    

You must present your final project by demonstrating it in the classroom to your instructor and your classmates or you will lose partial credit for the assignment.

New Elements

1] JavaScript

In this project, we will be adding some interactive elements to your web page. Specifically, you need to incorporate the use of JavaScript or Java Applets into this project. Don't worry. You don't need to know how to program in JavaScript or Java in order to use these in your pages. There are huge libraries of Java and JavaScript code that are available to web designers like yourself. All you have to do is insert the code into your pages and perhaps moidfy it slightly in order to meet your needs.

If you haven't worked with these elements before you may want to read an article or two to get an idea of what you can do with these tools. Here is a good one from CNET.com, JavaScript for Beginners, at: http://www.builder.com/Programming/Javascript/ss01.html?tag=st.bl.7264.dir1.JavaScript_1 Tutotials 8 and 9 in your textbook offer more information on JavaScript and how it can be used.

Resources for ready-made JavaScripts:

The JavaScript Source: http://javascript.internet.com/
JavaScript.com: http://www.javascript.com/
JavaScripts.com: http://webdeveloper.earthweb.com/pagedev/webjs
Doc JavaScript: http://www.webreference.com/js/
A1 JavaScripts: http://www.a1javascripts.com/
Java Depot: http://www.sehs.lane.edu/~charles/public_html/
JavaScript Gate: http://javascriptgate.com/
The JavaScript Planet: http://www.geocities.com/SiliconValley/7116/
JavaScript Search: http://www.javascriptsearch.com/
JavaScript Library: http://hotwired.lycos.com/webmonkey/reference/javascript_code_library/

Here are some sources on the web for ready-made Java applets:

 

[2] Site Map


Additionally, you will need to include a site map to make navigating your site easier.

Here are some examples of site maps.

E'Bay's text site map
Micron's text site map
Danaan's graphical site map
SMEC graphical site map

Here's some freeware software you can use:
http://download.cnet.com/downloads/0-14482-100-4616171.html

The search engine folks also have a free site map:
http://www.freefind.com/

 

[3] Rollover Images


In this project, we will be adding some rollover images. Specifically, you can use an image editor to create two versions of a button or a navigation bar: one representing the button "at rest" and another version of the button that will be displayed with the mouse is "rolled over" the image. You can do this with JavaScript or with Flash. [It's really easy in Dreamweaver.] Here is an example of a page that uses rollovers: http://www.taylor.org/

Here is an interesting one that displays text over a graphic

http://javascript.internet.com/navigation/fading-rollover.html

Here's one that might be more practical:
http://webdeveloper.earthweb.com/pagedev/webjs/item/0,3602,12746_32021,00.html

And one more:
http://hotwired.lycos.com/webmonkey/reference/javascript_code_library/wm_img_swp/?tw=reference&category=user_interface

Here are directions for creating your own rollover navigation buttons.

[4] Other Parameters

For the final project, you need to create a web site that meets the following parameters:

This is another opportunity to be creative and explore your limits.  You will design a web site which consists of a minimum of 15 web pages, one home page plus 14 supporting pages in whatever web structure (hierarchical, linear, web/chaos, hybrid) best supports the content of your page.  This web site should NOT be a  personal web site in the nature of (Hi, I'm Barbie/Ken and these are my dogs/ cats/ cars/ clothes/ toys/ hobbies/ whatever)  It can be a web site on a topic of personal interest, a web site for a hypothetical business, or a web site for an actual business or non-profit organization.  It must include the following elements:
 

  • Minimum of 15 pages (more if you use frames in constructing the site).
  • use either an image map, or graphic images (buttons) for navigation links
  • Incorporate JavaScript or a Java Applet in a significant way, e.g., something more than a simple page counter.
  • The home page of the site must be named index.htm
  • A mailto link and/or Contact information if the page is for a business (address and phone) and business hours
  • A mention that the page was created by you in partial completion of the requirements of this Web Design class and a hyperlink to school's home page
  • Hyperlinks to external web pages that are realted to your project or topic
  • Appropriate use of Headings, fonts, color, text effects (bold, underlined, italics), background colors or images
  • Use of Cascading Style Sheets to define at least font, headings, and hyperlinks.
  • Appropriate use of graphics (at least one per page. You cann't count a graphic used as text to meet this requirement).
  • Title tags which are descriptive of the page's contents, anchor tags to aide in navigation (especially on pages over a screen in length -- Return to Top links).
  • Links to other pages in your web site and subsequently links from those pages back to the home page.
  • At least one web form which contains either
    • a mailto back to your email account when the form is submitted
    • or the use of JavaScript, PERL, or other programming language to manipulate the input from the form


Your grade will be based on the following elements:

105 points
1.
Compliance with the above listed items       Click here for points break-down
30 points
2.
Effectiveness -- does it do what it set out to do?  Is the content of high quality? Is it's meaning clear?
30 points
3.
Affectiveness -- is it aesthetically pleasing?
10 points
4.
Creativity -- Is it an original idea.
20 points
5.
Navigational Efficiency -- is it easy to get around in the page and find what I need?
5 points
6.
Successful Uploading of your project to your web site. Link on syllabus to directions.


Your project must "work" in both Internet Explorer 5.5 and Netscape Communicator 4.7 or you'll be "docked" 10 points.

Optional [extra credit] Element -- up to 30 extra points

Flash -- up to 20 extra points
Incorporate a flash show in your site and get 20 extra points.

Flash Tutorials: http://www.extremeflash.com/tutorials/

Free Flash Intros: http://www.freeflashintros.co.uk/

Search Tool -- up to 10 extra points
You may add a search tool to your web site to make it easier for users to find specific content on your pages.

Here's how to write your own search engine in PERL: http://hotwired.lycos.com/webmonkey/97/16/index2a.html

Here's a less complicated method:

http://www.freefind.com/

Uploading Your Project to the Web Server
copyright 2003 | angela peace| all rights reserved