CS2413: Web Site Development
WSD13: Final Project Initial Assignment

Objective:

• Create a template for your Global Web web site which includes screen, print, tablet, and smart-phone versions.
• Create the website homepage
• Create initial page for each of the two countries

Point Value:

• Full Credit: 30 Points
• Late Credit: 27 Points
• Due dates are listed in Assignments and Due Dates

Specifics

Be sure to read the instructions below before uploading files to Apollo.
It is not the same as uploading the Pacific Trails folders

Web Project (See p. 237-238)

• This assignment will be a modification of the information listed in Items 1-6. It will become the basis for your final project.
• Include the coding, design, and documentation principles covered in this course.
• Use the guideline set forward in the Final Project Specifications.
• Create a folder named GlobalWeb. This is where the files for your final project will be located.
• Create a web page named GWTemplate.html. (Global Web Template)
  • All work must be original. Templates from the Internet or other sources may not be used.
  • All code must be written by the user. No code may be copy/pasted or in any way borrowed from any other source. It must be original work by the student. (Think --- Copyright Laws)
• This will be a fully functional web page -- but without any real content. It will be used as a basis for all the web pages in your site.
• The template will have a header, footer, navigation, area for content, date last modified, meta tags, and any other items which will be common to all of your web pages. Perhaps you might want to think about it as being similar to one of the templates that are in Word or PowerPoint.
• The template must be designed so there is a screen, print, tablet, and smart-phone version.
• The template will have a CSS file with a name appropriate for your website (example EuropeanWeather.css, HealthCare.css). The CSS file must include code for the screen version as well as media queries for screen, print, tablet, and smart-phone
• Make a copy of GWTemplate.html and save it as index.html.
  • Add content appropriate for your website's homepage
  • Meaningful content - at least two paragraphs per page (A paragraph must have a topic sentence which is then developed usually in multiple sentences. http://owl.english.purdue.edu/owl/resource/606/01/. For our purposes a paragraph must have a minimum of three sentences.)
  • Content must be enhanced with images, media tables, outside links, charts and other items as appropriate
  • Update the navigation as needed
  • Update CSS file as needed
  • Save the file, validate, and test the four versions (screen, print, tablet, smart-phone)
• Make another copy of GWTemplate.html and save it with a name appropriate for one of the countries. (Example: EnglandWeather.html, IndiaHealthCare.html)
  • Add content appropriate for this web page.
  • Meaningful content - at least two paragraphs per page (A paragraph must have a topic sentence which is then developed usually in multiple sentences. http://owl.english.purdue.edu/owl/resource/606/01/. For our purposes a paragraph must have a minimum of three sentences.)
  • Content must be enhanced with images, media tables, outside links, charts and other items as appropriate
  • Update the navigation as needed
  • Update CSS file as needed
  • Save the file, validate, and test the four versions (screen, print, tablet, smart-phone)
• Make another copy of GWTemplate.html and save it with a name appropriate for the other country. (Example:SpainWeather.html, AustraliaHealthCare.html)
  • Add content appropriate for this web page.
  • Meaningful content - at least two paragraphs per page (A paragraph must have a topic sentence which is then developed usually in multiple sentences. http://owl.english.purdue.edu/owl/resource/606/01/. For our purposes a paragraph must have a minimum of three sentences.)
  • Content must be enhanced with images, media tables, outside links, charts and other items as appropriate
  • Update the navigation as needed
  • Update CSS file as needed
  • Save the file, validate, and test the four versions (screen, print, tablet, smart-phone)
• There will be a minimum of five (5) files - not including image, media, or other specialized folders/files.
  • GWTemplate.html
  • index.html
  • country page (with a name of your choosing)
  • country page (with a name of your choosing)
  • CSS file (with a name of your choosing)

Be sure to read the instructions below before uploading to Apollo.
It is not the same as uploading the Pacific Trails folders

Organization of Apollo

Up until now, we have been uploading entire folders: pacific02, pacific03, pacific04 and so on. This has been done because these are NOT the main focus of this course. This has resulted in there being an additional folder name in the path. Example: apollo.occc.edu/user#####/pacific02.

GlobalWeb IS the main focus of this course so its files will not be in a sub-folder on the server. The will be in the root/main folder. The entire GlobalWeb folder will not be uploaded, just the web page with its related files. The URL to your Global Website will be http://apollo.occc.edu/user#### with no folder name. When this URL is entered, the Global Website must appear with no further navigation or clicking. In summary, on your local computer the final project web files (including graphics) will be in a folder named GlobalWeb. Perhaps the following image might help with your understanding. On the Apollo server, the files/folders will be in the root directory of your student account. If you need help with this, "please" ask!

Common Requirements for All Web Pages

Assignments failing to meet any of these items will be eligible for a maximum of 50% credit.
See additional Mandatory Requirements below (Not all of these apply at this point)

1. Code must be properly indented and documented.
2. The web pages must display correctly in FireFox, Chrome, Safari, and Internet Explorer.
3. The links between the existing pages within the website must not be broken.
4. All images must contain a height, width, and alt property.
5. All images must display properly.
6. All images must be in a separate folder.
7. All form elements MUST have a
   1. name
   2. id
   3. accesskeys (not required on hidden fields)
   4. tabindex (not required on hidden fields)
   5. label (if appropriate)
8. Each web page must have
   1. meaningful and relevant meta tags specific to that page.
   2. meaningful content of at least two paragraphs
   3. JavaScript indicating the date last modified
9. JavaScript must execute without error. This will be tested using FireFox's Error Console.
10. All HTML and CSS code must be well documented, properly indented, and easy to read.
    http://css-tricks.com/examples/CleanCode/Beautiful-HTML.png
    http://coding.smashingmagazine.com/2008/05/02/improving-code-readability-with-css-styleguides/

Mandatory Requirements

Failure to adhere to and/or include the following items will prevent the assignment from being graded.
Note: If time permits, the assignment can be resubmitted during the late/resubmit period, but there will be a 10% penalty.

1. All pages must include DOCTYPE, <meta> tag, and <html> tag information.
2. The link to the web pages in the submission area of the LMS must open the pages in a new browser window.
   
3. All web pages must validate (HTML5 and CSS) without errors using the Web Developer Tool Bar in FireFox or Google Chrome.
4. All versions (screen, print, tablet, smart-phone) of the files will be evaluated.

Assignment Submission:

There are two parts to submitting the assignment: uploading the website to the Apollo server and submitting the URL within the LMS.

• Uploading to the Apollo Server
  • The contents of the GlobalWeb folder will be uploaded to the server, NOT the entire folder.
• Submitting the URL within the LMS
  • In the LMS, use the submission area located in this week's folder
  • In the text box, create a links to both websites.
  • The web pages must open in a new window.
    Need help creating the link? Check out "Submitting an URL in the LMS" which is located in the Help Files, References, and Tutorials folder (inside the LMS)
  • Submit the following URLs each of which must open in a new window:
    • http://apollo.occc.edu/user#####/GWTemplate.html - This is the template that was used for creating the other files in the site.
    • http://apollo.occc.edu/user#####/index.html
    • http://apollo.occc.edu/user#####/Country1.html -- Country1 and Country2 will be replaced by names more representative of the countries in the site - Example; IrelandIntro.htm
    • http://apollo.occc.edu/user#####/Country2.html