Course
Assignments
   
  Activity due date
Week 1

Accessibility exercise: (6 pts)

Post the answers you found for the exercises and your experience on the "Week 1" discussion board on D2L.

Sept 1

 

Week 2

What do you think: (5 pts)

 

Post your opinion about the video on the "Week 2" discussion board on D2L.

 

Sept 8
week 3 Create a simple homepage with a simple CSS: (10 pts)
  • Create a simple webpage using proper doctype and syntax.
  • The page must include a picture of yourself, your name, and your preferred e-mail address (the one you check most often, and would like me to use).
  • Using the HTML/XHTML Validator (W3C) make sure the page passes the validator.
  • Using the CSS Validator (W3C) make sure the CSS passes the validator.
  • Place the simple webpage in your public_html/csci323 directory with the name index.html from which you will link subsequent assignments.
    (That means the url to the index.html page will be http://csci323.cs.edinboro.edu/~your-user-name/csci323/)

Sept 15

 

 

 

 

personal
website Project assignment
Personal WebSite Project : Rubric

Purpose: To design, develop, and publish a website using recommended design practices. Your website will contain a home page and at least three content pages. You are required to create an external style sheet (.css file) that configures text, color, and page layout. (No font tags, embedded CSS, or inline CSS may be used.) Your website should incorporate a mobile view as well as the desktop view.

You must publish your project to the Internet.

Required components for the website include:

  • Appropriate meta tags
  • One page utilizing tables effectively to display tabular information
  • One e-mail hyperlink
  • Integration of external hyperlinks
  • Consistent banner logo area
  • Consistent main navigation
  • Association with external style sheet (.css file)
  • Integration of web technologies:
    • database component - At least one multiple field table must be created. 
    • posting form - At least one form with multiple fields that post or update data in the database.  form validation should be employed.
    • query form - At least one form with multiple fields that retrieves data from a database table based on some input.  
    • CGI scripts - Server-side scripts that use form data to update and retrieve data from the database .  
    • dHTML component - At least one component should be incorporated that makes the webpage dynamic (roll-over, hover, ...). 
    • Server-side authentication - Create a username "student" with password "edinboro", so that I can log into the password-protected section.  
    • Other technolgoies - Flash, Fireworks created graphics etc (BONUS)

Chrome, Safari, Firefox and Internet Explorer must render each page. Web site design and implementation should consider mobile devices. You should use a mobile simulator to check page rendering.

Your website project will be evaluated on the following criteria:

  • Meets the requirements as outlined on the rubric
  • Including all required web page elements
  • Following recommended web site design practices
  • Visual appeal of the site to the target audience
  • Appropriate inclusion of mobile device rendering
  • Accomplishment of project's objectives

Use the following as the coverpage for your personal website: Personal Website Coverpage

Personal Website topic: You may choose a case study from the back of the chapter in the Web Dev textbook (starting in chapter 2) or a case study of your own.  Complete the hands-on activites from each chapter as we move through the textbook. 

FINAL DUE DATE:
NOV 25, 2013

 

 

 

 

 

 

 

 

 

 

 

 

 

team
website project Assignment
Team WebSite Project :

Purpose: To design, develop, and publish a website for a real world client using recommended design practices. Your team is required to create an external style sheet (.css file) that configures text, color, and page layout. (No font tags, embedded CSS, or inline CSS may be used.)  Your website should incorporate the functionality requested by the client and should incorporate a mobile view as well as the desktop view.

Chrome, Safari, Firefox and Internet Explorer must render each page. Web site design and implementation should consider mobile devices. You should use a mobile simulator to check page rendering.

Your web site project will be evaluated on the following criteria:

  • Meets the requirements as outlined on the rubrics
  • Meets the requirements as outlined by the client
  • Follows recommended web site design practices
  • Visual appeal of the site to the target audience
  • Appropriate inclusion of mobile device rendering
  • Accomplishment of project's objectives

There are four deliverables: Design Document, Website, Portfolio and Presentation. Each member of the team plays a different role: FearlessLeader, DesignGuru, DatabaseDoctor,TextMaster, and PixelMeister. You will need to discuss these roles with your fellow team members and each choose a role.  Your grade across all milestones will be determined by your percent of team contribution in the role you are assigned.  Team member contribution will be evaluated by the team members at the end of the semester using the evaluation form

Team Evaluation link - due 12/9/2013

fearless leader

FearlessLeader: The FearlessLeader serves as the team leader. The role of the FearlessLeader includes working with the team to divide up tasks, leading discussions, reminding team members about due dates, communicating with client, posting the “Meeting Notes”on the discussion board , etc. The FearlessLeader is ultimately responsible for all of the group's deliverables.

design guru

DesignGuru: The DesignGuru verifies that design principles such as alignment, contrast, proximity, and repetition are utilized in the design of a usable and accessible page layout (see Chapter 7 Design & Usability resources).   The DesignGuru contributes to all the design-related components – especially the page layout format for the Page Layout. The DesignGuru will generate the Presentation (with help from other team members).

text master

TextMaster: The TextMaster focuses on writing for the Web-- the use of text and the written word on web pages -- including writing compelling headings, brief paragraphs, and brief catching lists (see Chapter 7 Writing for the Web resources). The TextMaster will generate the written Design Document (with help from other team members) and provide assistance with the text for the Page Layout.

database doctor DatabaseDoctor: The DatabaseDoctor designs the database back-end, normalizes the tables, and sets up the structure for safe database connection.  The Database Doctor will generate the database documents for the Design Document (with help from other team members).
pixel meister

PixelMeister: The PixelMeister focuses on the use of color and graphics on a Website (see Chapter 4 resources). The PixelMeister has responsibility for the selection and justification of the color scheme chosen. The PixelMeister will generate the Page Layout in the Design Documnt (with help from other team members).

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Dec 9 - Team Eval

teams  
Team A: Ring Fantasies

clients: Ring FireFly Fantasies

Joshua Genis - Text Master
Travis Mink - Pixel Meister
Devesh Shukla - Design Guru
Andre Torres - Database Doc
Jenna Wagner - Fearless leader

 

 

Team B:

clients: Edinboro Methodist Church

Brandon Clements - Database Doc
Jesse Decker - Design Gurur
Julie Kirwin - Pixel Meister
Andrew Napierkowski - Text Master
David Staff - Fearless Leaders

 

 

Team C:

clients: Professor Zimmer's website
current: http://users.edinboro.edu/zimmer

Johua Huson - Fearless Leader
Jason Klins - Database Doc
Matt Olson - Design Guru
Andrew Rawson - Pixel Meister
Kris Wick - Text Master

 

 

 

 

 

Skills form

 

 

 

 

 

 

 

 

 

 

 

 

Week 4

Team Project Milestone #1: Rubric

Team Project Intro: Using a Word processor submit a one-page double spaced document answering the following questions

  • What are the team member role assignments?
  • When and where will your team meet to work on the project?
  • What is the purpose of the website?
  • Who is your intended audience?
  • What opportunity, problem, or issue is your site addressing?
  • What type of content would be included in your site?
  • What content should be available on a mobile device?
  • List at least two related or similar sites found on the Web.

 

Sept 27
week 5

Team Project Milestone #2: Rubric

Design Document (part 1): Using a Word processor submit the following

Section 1 - Site Goals

  • Describe the goal(s) of your website

Section 2 - User Experience

  • Define the audience
  • List Scenarios
  • Competitive analysis of similar websites

Section 3 - Site Content (incorporate mobile page information)

  • List the working title of each web page
  • List the sources of content (facts, text, graphics, sounds, video, dynamic data) included on each page
  • List the functional requirements (forms and transactions) needed on each page where applicable

Example Completed Design Documents: #1 #2 #3

 

Oct 2

 

 

 

 

 

 

 

 

 

 

 

week 6

Team Project Milestone #3: Rubric

Site Map: Use a software tool to draw a flowchart (storyboard) of your website that shows the hierarchy of pages and relationships between the pages

Mobile Site Map: Use a software tool to draw a flowchart (storyboard) of your web site that shows the hierarchy of pages and relationships between the pages.

 

Oct 9
week 7

Team Project Milestone #4: Rubric

Wireframe: Use a computer application to create a wireframe for a sample page on your web site that clearly shows the logo, navigation, content, and footer areas. Use a graphics application to create a wireframe and save as a .gif or .jpg file.

Mobile Wireframe: Use a computer application to create a wireframe for a sample page for a mobile device on your web site that clearly shows the logo, navigation, content, and footer areas. Use a graphics application to create a wireframe and save as a .gif or .jpg file.

Color Scheme: Indicate your color scheme for the site.

 

Oct 16

week 8

Personal WebSite Project : Rubric

Your website should contain a home page and links to at least three content pages. You should have an external style sheet (.css file) that configures text, color, and page layout for both desktop and mobile (No font tags, embedded CSS, or inline CSS may be used.) Your website should incorporate a mobile view as well as the desktop view.  So that I may display your mobile view make sure that the approriate settings are in place.  If using the link tag it should contain the following:

<link href="stylesheet.css" rel="stylesheet"
media="only screen and (max-width: 480px)">

You must publish your current project to the Internet and make sure there is a link to the index from your homepage.

those following along with the textbook case study, complete your work through chapter 7.

 

Team Project Milestone #5: Rubric

Design Document : Using a Word processor complete the design document. Provide a link to your design document (draft) from your webpage, post a copy on D2L in the dropbox "Design Document - draft", and print & staple a copy for me to markup.

 

 

Oct 18

 

 

 

 

 

 

 

 

Oct 23

week 9

Team Project Milestone #6: Rubric

Implementation: Three of the webpages should be implemented. Provide a link to your web site from your team homepage.

Annotated CSS: Provide a separate webpage with an annotation of your CSS. Provide a link to this webpage from your team homepage.

Meeting: Individual meetings to discuss your website will be conducted this week. Be prepared to present your website and discuss your design decisions.

Copy: Copy your current website to another directory and create another link from your team homepage to the new and improved "final" Website. Leave the other directory of pages untouched and the link to milestone # 6 in place for comparison purposes.  Continue working on the copied website, making improvements and adding the technologies required.

 

Oct 30
week 10

Student Critic : Prepare an informal presentation of your team website for critic.

 

 

week 11

Team Project Milestone #7: Rubric

Design Document : Using a Word processor update the design document to include your improvements and your database. Provide a link to your design document (final) from your webpage, post a copy on D2L in the dropbox "Design Document - final", and print & staple a copy for me to markup (if there are no errors, this can be the copy included in your portfolio).

Nov 15
Week 12

Personal WebSite Project : Rubric
      - See full description of assignment above.

Use the following as the coverpage for your personal website: Personal Website Coverpage

Nov 25
week 13

Team Project Milestone #8: Rubric
    webpage index for Milestone #8: rubric8.htm

Implementation: All of the webpages should be implemented. Provide a link to your "final" web site from your team homepage. Leave the link to the original website created for milestone #6 for comparison purposes.

Annotated webpage(s): Provide separate webpage(s) with annotation of your final website identifying the technologies required. Provide a link to this from your homepage. There should be inclusion of the following in the indicated order below:

  • database component - At least one multiple field table must be created.  An annotated table(s) description should be provided.  If there are several tables then create a separate linked webpage with this information. MAKE IT READABLE!
  • posting form - At least one form with multiple fields that post or update data in the database.  A link & description to this form should be provided.
  • query form - At least one form with multiple fields that retrieves data from a database table based on some input.  This should verify the posted data from the posting form was successful.  A link and description to this form should be provided.
  • form validation - client side or server side form validation of your forms should be provided.  A description of the validation performed on each form should be incorporated in the form description.  If server side validation is used then a link to a webpage with the annotated script should be provided.
  • CGI scripts - Server-side scripts that use form data to update and/or retrieve data from the database .   A webpage with annotated script should be provided.
  • dHTML component - At least one component should be incorporated that makes the webpage dynamic (roll-over, hover, ...).  A description and link should be provided to demonstrate the dynamic component.
  • Server-side authentication - Create a username "student" with password "edinboro", so that I can log into the password-protected section.   A link and description should be provided to demonstrate this authentication.

I can only grade those things that are fully visible.  It is up to you to make sure I can see your teams server-side scripts, database, etc. through annotation.  Test your website and annotation pages completely.  I will not troubleshoot broken links etc.

 

Dec 6

week 14
&
finals week

Team Project Milestone #9: Rubric

Presentation: Prepare a presentation on your team website.   Include discussion of design decisions and demonstration of website transaction, security, and validation abilities.

 

 

Project Milestone #10: Rubric

Portfolio: Create a binder with the following sections and contents

Cover Page

Team member Names & roles
Website Title

URL to Website homepage
URL to your admin homepage
Linux password
MySQL password

Any other authentication pair needed for your website

Design Document Updated/corrected/complete design document
Implementation Identify/discuss design decisions (colors, images, etc)
Identify/discuss site limitations
Identify/discuss site dependencies
Identify/discuss areas of improvement/growth
Identify/discuss security problems and solutions
Identify/discuss site hosting options
Identify/discuss maintenance procedures
Identify/discuss search optimization related to your site
Site printouts

Annotated CSS
     followed by print out of CSS
Screen shot of webpages,
     each followed by the HTML and other supporting files
Print out of Database files

Bibliography Site all sources: printed, online, and human

 


Dec 11 12:30-2:30

 

 

 


Dec 6

Web page
updated
November 3, 2013