Homework Assignments

Homework 5

In this assignment you are to create a Webpage with the following functionality:

Coin Calculator

Create a page that prompts the user for a monetary value and outputs the minimum number of coins needed to make the specified input amount. For example, a user can enter 1.43 which corresponds to the monetary amount $1.43. Your program should then proceed to output the following:

Quarters: 5
Dimes: 1
Nickels: 1
Pennies: 3
A minimum of 10 coins are needed to make $1.43

All input should be entered using a textbox, and all output should be written to an output DIV dynamically.

April 24, 2009 - 11:59pm

Homework 4

In this assignment you are to create a registration form for our Website. Your form will consist of three (3) sections (fieldsets): personal information, account setup, and survey.

Personal Information

The personal information section of your form should contain the following inputs:

Field Name Field Type Description
First Name Textbox  
Last Name Textbox  
Street 1 Textbox  
Street 2 Textbox  
City Textbox  
State Drop Down Menu Should contain 5 states incl. CA
Zip Textbox Size = 5, max # of chars = 5
Phone (Area Code) Textbox 3 chars max
Phone (Prefix) Textbox 3 chars max
Phone (Suffix) Textbox 4 chars max
Gender Radio One button for male, one for female

Account Setup

Field Name Field Type Description
Username Textbox  
Password Password  
Confirm Password Password  
Valid Email Textbox  
Confirm Email Textbox  


Field Name Field Type Description
Ask user how they heard of the site Multi-Select Box of size 3

Options should be:

Word of Mouth

Ask the user to subscribe to weekly newsletter Checkbox  

All form elements (labels, inputs, fieldsets, etc...) should be aligned to the center of the page, and all inputs and labels should be aligned with each other with the exception of the Phone input and newsletter checkbox

Your page should use an external style sheet for all styling. The text of your page should be different from the default text, and your page should utilize a color scheme different than the default.

Optional Criteria

You can optionally include an image (Logo) for our Website. This logo should appear above your form.

You can also include a background image if it adds to the overall look and feel of your page.


1.8% - All form elements are present
0.3% - All fieldsets are present
1% - All inputs are aligned (excluding exceptions)
1% - All labels are aligned
0.2% - Font is not the default font
0.2% - Color scheme other than the default (and the scheme used in class) is used.

August 17, 2009 - 11:59pm

Homework 3

In this assignment you are to create a Webpage with the following frameset:

Top Frame
Bottom Frame

The top frame should contain your name in a font larger than all other text on your site. Below your name should be an e-mail link. Below your name and email should be four links. These links should link the user to your resume, about me, favories, and image map pages. The content of each of the four pages should display in the bottom frame. However, when the user clicks on link to your favorites page, the following should apper:

Top Frame
Left Frame Right Frame

The left frame should contain a list of links to each of your favorite categories. These categories should include favorite movies, restaurants, and Websites. The right frame should display a message instructing the user to select a category from the left frame.

When the user selects a link from the left frame, the contents of the right frame should be updated with the corresponding favorites. For example, if the use selects the favorite restaurants link from the left frame, a list of hyperlink images to your favorite restaurants should appear in the right frame.

Note that the left frame and right frame are only visible when the user views your favorites. All other pages will only contain the top frame and bottom frame.

All pages should maintain a consistent look and feel. The colors and font used on your pages should be different from the browser's defaults.

1.5% - Page layout using framesets (Top/Bottom Frame)
0.6% - Name, e-mail link, and 4 navigational links in top frame (Resume, About Me, Favorites, and Image Map)
1% - Target of nav links is bottom frame
1.5% - Favorites page contains additional frameset with links in left column and content on right
0.5% - Consistent look and feel (non-default color/font scheme used)

July 27, 2009 - 9:50AM

Homework 2

In this assignment you are to create an image map using the following image. Your image map should define three (3) regions of the following shapes: circle, rectangle, and polygon. The circle region should describe the green circle with the white letter 'N' and up arrow inscribed within (near the top of the page). The rectangle region should define the University Health Center, and the polygon should describe the engineering building. Each image area should link to an appropriate Website.


0.5% - Circle Area
1.0% - Polygon Area
0.5% - Rectangle Area

Total: 2% of overall grade

Note: Your image map page does not have to be integrated into your existing site. All that needs to be uploaded is your image map page and graphic.

July 20, 2009 - 11:30AM

Homework 1

In this homework assignment you will create a Website with the following pages:

About Me

Your About Me page should consist of a paragraph(s) describing you. The content of this page will be similar to your first lab assignment.


Your résumé page should be formatted using different sized headings, paragraphs, divisions and spans. Your page should consist of the following three (3) sections:

  • Personal Information
    • In this section include your full name, address, telephon number, and e-mail address (You do not have to use your actual information)
    • Your e-mail address should be a hyperlink.
    • Your name should be a hyperlink that links the user to your about me page.
  • Experience
    • The experience section of your page should list all employment, as well as club/organization participation.
    • Each job/position/organization should be contained in a division (Note: These will be sub-divisions of the Experience division of your page).
    • For each sub-division, you should have a heading with your title/position displayed in bold followed by your start and end dates. Your start and end dates should be in the form of MonthName, Year.
    • Below your title/position should be another heading of the same size as your title, except the font weight should be normal, not bold. This heading should be the name of your employer followed by the city and state in which you worked. If you are listing an organization/club, then list the institution in which it was a part of.
    • Below the name of your employer should be an unordered list of duties, responsibilites, and accomplishments that you had during your tenure.
  • Education
    • The format of this section will be similar to that of the experience section.
    • Each institution will be a sub-division of the Education division of your page.
    • Each sub-division should contain separate headings for your degree/diploma earned, institution name, and location/address of your institution.
    • Below the location should be an unordered list of any achievements such as a high GPA, recognition, etc.. .

You can view a sample résumé here.


Your favorites page should contain the following three (3) sub-divisions:

  • Favorite Movies
  • Favorite Websites
  • Favoirte Restaurants

Each sub-division should contain an unordered list of hyperlink images. When a user clicks on an image, they should be re-directed to a Webpage relevant to the particular list item. Each list should contain, at minimum, three (3) list items.

Each page should maintain a constant look and feel. At the very top of every page should be a division with two hyperlinks that read "Style 1" and "Style 2". When a user clicks on one of these hyperlinks the style of the entire Website should change.

Below the style links should be a heading division that contains the name of your Website. You have creative license in naming your Website.

Below your heading division should be a navigational division allowing the user to jump between the three (3) pages on your site.

Lastly, the background and foreground colors of your Website should not be the default colors. The default font should also not be used. Be creative, but make sure that the colors used compliment each other, and do not make your content hard to read.


0.2% - About Me Page
1.2% - Resumé Page (3 Sections & Correct Layout)
0.5% - Favorites Page
1.0% - Ability to Change Style Sheets
0.5% - Consistent Page Elements
0.3% - Creativity

Total: 3.7% of overall grade.

July 15, 2009 - 9:00AM

Homework 0

Throughout the quarter we will be using Notepad++ to develop our Webpages. In this assignment you are to download Notepad++ and install it on your home PC. You can download Notepad++ here. Be sure to download the file named npp.5.3.1.Installer.exe. Mac users will have to download an alternative html editor. Some suggestion are Taco HTML Edit, and Smultron.

Also, if you have not already done so, you must register on the Computer Science Network Services (CSNS) Website. Every assignment, including a portion of your midterm and final will be submitted online using this system.

This quarter we are fortunate to have access to a Web Server on which we can deploy our Webpages. To receive your username and password for the server you must send a blank e-mail to acervan5@calstatela.edu with with the subject CS120 Username & Password - LastName, FirstName CIN.

Along with your username and password will be instructions on how to login to the CS1 server. To do so you will need a FTP program. If you do not already have a FTP program you can download a free client here (PC) or here (Mac). Aside from submitting your assignments to CSNS, you will also be responsible for deploying your projects to a live Web Server.

Due June 22, 2009 - 11:59PM


CSNS All files must be submitted to CSNS prior to the due date/time.