<%@LANGUAGE="VBSCRIPT" %> <% Response.CacheControl = "no-cache" %>
Assignment 01

Account Setup and Create a Basic Site

Instructions

This assignment is just a little exercise to get you back into the swing of web development. It also serves as a quick way to get everybody set up on the web server and ready for the semester.

You will create a simple HTML website to refresh yourself on HTML tags and CSS. While it is possible to host your assignments on your Purdue web space or elsewhere, you will be given space on a server dedicated to this class to make it easier to grade your assignments. You will receive a login a password for the web server and MySQL sometime in the first week of class.

Materials to turn in on the server:

  • In your Assign01 folder:
    • index.html
    • schedule.html

 
 
 
 
 
 
 
 
 

Introduction Video

<% For i=1 to 123 %> <% Next %>

Exercise Specifications

  1. Set up your account on the server to host PHP
    • Your instructor will create personal storage space for you on
      \\cgtweb2.tech.purdue.edu\356\
      where you will be able to develop, test, and store all of your assignments and projects.
    • Only you will be able to view your materials. Other students will not be able to view your materials. The instructor also has access to view your materials.
    • Keep in mind - After this semester, all files will be removed from the storage space. This means you must backup your files in another location. As good practice, you should always backup your files in another location.
       
  2. Create a batch file
    • Open Notepad
    • Copy and paste the following two lines. Change the drive letter (only if necessary), <yourFolder>, <yourPass>, and <yourLogin> to those that were assigned to you (instructor will explain):

      echo off
      net use y: \\128.210.136.242\<yourFolder> <yourPass> /user:<yourLogin> /persistent:no
       
    • Save as "ConnectDrives.bat"
       
    • If you are on campus (on the Purdue network), you can simply double click the .bat file to map your web server space. It will appear under Computer as a new drive letter. If you are off campus, you will first need to enable your VPN, then double click the .bat file.
       
    • This file may be of help to Mac users (Mac users will have to connect differently):
  3. Create a directory structure in your server storage space
    • Create folders for Assign01 through Assign14 (notice that is Assign01 and not Assign1)
    • Create folders for Project1 through Project3
    • These folders will remain in your storage space and will not change. This will keep your files organized. I know this may seem tedious, but if I do not require this, some students will simply store all their files in the root directory and overwrite them all the time. That is NOT a good practice and will not be condoned.
       
  4. Create a Generic Site in your Assign01 directory using Dreamweaver
    • Intro Page (index.html)
      • Name
      • A paragraph about yourself
      • Contact information (email address)
      • Link to your schedule page
    • Schedule Page (schedule.html)
      • Table formatted
      • Sunday through Saturday format
      • You could make your class schedule, or a TV schedule, or some other schedule
      • Link back to your Intro page
    • After saving the pages to the server space, try typing the URL to your pages, it will be as follows, except <yourFolder> will be the name of the folder that you were assigned:
      • http://cgtweb2.tech.purdue.edu/356/<yourFolder>/Assign01/index.html
         
  5. Get used to testing in multiple browsers. The browser you are using may not be what your end client is using.
    • Mozilla Firefox (Firefox has a super-friendly Web Developer add-on by Chris Pederick: http://chrispederick.com/work/web-developer/firefox/)
      • Suggested Add-ons:
        • HTML Validator (may have to google "HTML Validator" and add it from a website)
        • Status-4-evar
        • Firebug
        • HTTPFox
        • JavaScript Debugger
        • Web Developer
        • Accessibility Extension
    • Google Chrome
      • Chrome has the same Web Developer add-on by Chris Pederick, but Firefox docks it at the top where you can constantly check your compliance.
      • Firebug
         
  6. Bookmark the following site. You can use this site to test your site design in many different browsers. http://www.browsershots.org
     
  7. Research these and find out what's common today in industry. We will talk about it in class.
    • Server side programming language usage
    • Database usage ranking
    • Top 5 programming languages used in web development
    • Bureau of Labor Statistics web development
       
  8. Download this zip file that contains 4 PHP files and unzip them to your Assign01 directory.
    • We'll step through this together
    • Find the line of code with the error in each PHP. What is causing the error?
    • Hint: There are 2 syntax errors, 1 runtime error, and 1 logic error
    • PHP zip file
       

Validation & Accessibility

  • Validate your pages using (a) Dreamweaver and (b) the HTML Validator add-on for Firefox. Fix any errors before turning in.
    • Pre-rendered HTML: Use Dreamweaver built-in page validation
    • Post-rendered HTML: Firefox: View source _or_ Icon on bottom / status bar > Double click for details
    • Using only Dreamweaver is not good enough
    • Always fix the error on top first. Only fix one or two errors at a time. Many times, fixing the top error fixes errors below it.
         
  • Check for JavaScript and CSS errors using the Web Developer toolbar in Firefox.
    • Make sure there is a green check for (a) Standards Compliance Mode, (b) CSS, and (c) JavaScript
       
  • Check accessibility issues using the Accessibility Extension add-on for Firefox. Fix failures before turning in.
    • Accessibility > Reports > Accessibility Issues
    • Validate against FAE rule set
    • This will not fix all accessibility issues, but it is a very good start.
       

Grading Rubric

Generic Site 3 pts
Server Folders 2 pts
Errors Found 3 pts
Validate / Accessibility 2 pts
Total 10 pts