Web Site Design & Implementation IGME-230
Week # Week of Topics Assignments Links
01 08/26
  • Intro to Course
  • Hypertext Markup Language (HTML)
  • HTML Tags
  • HTML Validation

In Class

  • first_page.html

Links

Downloads

02 09/02
  • More HTML - links, lists, semantic tags
  • Optimizing and displaying images
    • GIF, JPEG, PNG
  • FTP - putting web pages online
  • No Class Monday 9/2

Readings Due

  • HTML and CSS - Introduction
  • HTML and CSS - Ch. 1 - Structure
  • HTML and CSS - Ch. 2 - Text
  • HTML and CSS - Ch. 3 - Lists
  • HTML and CSS - Ch. 4 - Links
  • HTML and CSS - Ch. 5 - Images

Downloads

03 09/09
  • More CSS
    • Cascading Style Sheets (CSS)
      • Basic properties: color,font,...
      • Basic Selectors: type, class, id
    • External Style Sheets
    • CSS Rollovers
    • Web Fonts
  • HTML Tables

Readings Due

  • HTML and CSS - Ch. 6 - Tables
  • HTML and CSS - Ch. 8 - Extra Markup
  • HTML and CSS - Ch. 10 - CSS
  • HTML and CSS - Ch. 11 - Color
  • HTML and CSS - Ch. 12 - Text

HW Due

  • Class Web Page (end of week 3)

Links

04 09/16
  • Web Design
    • CSS Layouts - single-column, multi-column, multi-column with footer, fluid, ...
    • CSS Media Queries
    • More CSS
      • Box Model - padding, margins, floating
      • CSS Color
    • Basic Page Design

Readings Due

  • HTML and CSS - Ch. 13 - Boxes
  • HTML and CSS - Ch. 14 - Lists, Tables & Forms
  • HTML and CSS - Ch. 15 - Layout

Links

05 09/23
  • More CSS
    • Responsive Design
    • HTML5 Semantic Tags
    • Typography

HW Due

  • Project 1 (end of week 5)

Readings Due

  • HTML and CSS - Ch. 16 - Images
  • HTML and CSS - Ch. 17 - HTML5 Layout
  • HTML and CSS - Ch. 18 - Process & Design

Links

06 09/30
  • Web Portfolios
  • Site Design Concepts
  • Site Organization & Navigation
  • JavaScript - First Look

Links for Vis Design Lecture

Links for Navigation Lecture

Links for JavaScript

07 10/07
  • Intro to JavaScript
  • How to:
    • Know if the page loaded
    • Select elements on the page
    • Modify the text of elements on the page
    • Add click events to elements on the page
  • Event handlers
  • JS Functions
  • document.querySelector()
  • element.innerHTML

Readings Due

  • JavaScript & jQuery - Introduction
  • JavaScript & jQuery - Ch. 1 - Introducing Programming
  • JavaScript & jQuery - Ch. 2 - The Grammar of JavaScript

Midterm Exam - 2nd class meeting of week

Exercises

  • Movies Page
  • Simple Calc
  • Harry Potter Calc

Links for JavaScript

08 10/14
  • More JavaScript
    • document.querySelectorAll()
    • JS Arrays
    • for loops
    • element.setAttribute()
    • event.preventDefault()
    • event.target
  • Columbus Day - No Class Monday 10/14
  • Tuesday 10/15 follows Monday Schedule

Readings Due

  • JavaScript & jQuery - Ch. 3 - Adding Logic and Control

Exercises

  • Bad Image Gallery
  • Better Image Gallery

Links for JavaScript

09 10/21
  • More JavaScript
  • Next-Prev Image Gallery
  • Controlling Video

Links for JavaScript

10 10/28
  • Working with Object
  • Creating elements dynamically
  • Downloading Data From the Internet using jQuery

ICE

Links for JavaScript

11 11/04
  • Working With Web Services
  • Last.fm API
  • Form Project 3 Groups

Last.fm Links

Handy Project 3 Links

Wikipedia Links

12 11/11
  • SSH and basic UNIX
  • UNIX Paths and Permissions
  • Last Day to drop class - Friday 11/15

Unix Links

13 11/18
  • .htaccess files

HTML5 Links

jQuery Links

jQuery fadeIn/fadeOut

jQuery show/hide

14 11/25 Thanksgiving - No class 11/27-11/29
15 12/02 Work on Project 4
htaccess review
Fancy Box Review

Read

jQuery Book - Ch. 4-7
Example Source Code

jQuery show/hide

Fancybox

http://fancybox.net
16 12/09 Final Exam is on Last Day of Class - no makeups will be given
Final Exams 12/13, 12/16-12/19