Students will be able to identify course requirements

Students will be able to set up Dreamweaver in code view

Students will be able to hand code an HTML file which includes text and images

Students will be able to set up and view local web folders

Students will be able to upload html and image files to their AI web account using FTP functions

Review Course Syllabus and fill out review form

Syllabus

Review Form

Web Review 1: What is HTML?

Download and open the Exercise 1 Form

• Save the file as "FirstnameLastname_ex1.doc"
• Answer Questions 1 - 3 after reading through this Introduction to HTML at W3Schools.com.
• Use the W3Schools list of tags to help you define the tags listed in question 4
• For the last question, take a quick look at this information on HTML5.
• When you finish, print out your document and keep it with you for discussion.

Hand-Coding a basic web page

Mozilla Thimble

Lecture Files

Directory structures, web servers and FTP

Directories and Folders

Accessing the AI Server

Dreamweaver FTP

Students will use attributes and values in HTML selectors

Students will handcode web pages with header, paragraph, image, list, and link selectors

Students will handcode absolute and relative links in HTML pages

Students will format web page text using HTML tags such as bold, strong, italic, small, big, etc.

Student will use CSS to format HTML text

Review

Students will use CSS class and ids to format HTML

Students will use box-model properties width, height, margin and padding

Students will use div and span tags

Students will use CSS for link pseudo-properties

Homework

Turn in Homework 2

Turn in Quiz 2

Lecture

Review Week 2 - text and image formatting, CSS

CSS Classes and IDs

CSS Box Model

CSS Link States

Lab

Work on Homework 3

Quiz 3

Students will use CSS float and clear properties for web page layout

Students will create web page forms using hand-coded HTML5

Students will be able to set form element properties using hand-coded HTML5

Students will create organized layout of forms using CSS

Homework and Review

Complete Quiz 3

Homework Exercise 3

Download Lecture 4

Transferring files with FTP

Link to UnderstoodIt

Using Dreamweaver FTP functions

Divs, Floats and Clears

Divs

Floats and Clears

HTML Forms

HTML Forms Reference

HTML Forms Construction

Form elements and attributes

CSS Form Styling

Email Form

Lab

Midterm Preparation Review

Midterm Practice Files

Homework 4

Students will take midterm exam

Students will create table structures with HTML

Students will format table elements with CSS

Homework

Midterm Review Questions

Midterm Exam

Written Exam

Midterm Exam

Lecture

HTML Tables

Download Lecture 5 Files

Final Project

Review Final Project

Review Design Brief Assignment

Students will use CSS display, background and box properties to create web page layout

Students will use CSS floats and clears to organize web page layout

Students will use CSS background properties to place images and colors

Lecture: CSS Display & Background Properties

Review web image formatting

CSS Display Property

CSS Backgrounds

Lab

Layout Exercise

Review Flowchart Assignment

Project Mockups V1

Individual Design Brief Review

CSS Positioning

CSS Positioning - Relative, Fixed and Absolute Positioning

Z-index positioning

Students will create web page with HTML5 semantic markup

Students will use CSS3 properties to add text and box effects

Students will identify and use fixed, absolute and relative positioning properties

Assignments

Flowchart Assignment

Project Mockups V1

Lecture:HTML5 Semantic Markup

Lecture Files

HTML5 Semantic Elements

New CSS3 Properties

CSS3 Properties:border-radius and box-shadow

CSS3 Effects Generator

CSS Positioning

CSS Position Property

Lab

Work on Mockups V2

Individual Flowchart and Mockups Revivew

Students will implement Javascript framework into HTML code

Students will use CSS selectors to define parent-child formatting

Students will continue work on final project

Lightbox

Lightbox - Javascript Framework

CSS3 Inheritance

CSS first-child and last-child Pseudo Elements

Nesting CSS Selectors

Lab

Begin work on final project

Students will add audio elements to web pages

Students will add video elements to web pages

Students will complete work on final project

Homework

Quiz 5

Lecture

HTML5 Audio Tags and Formats

HTML5 Video Tags and Formats

The State of HTML5 Video

• Firefogg video converter plug-in for Firefox
• Online Video File Converter (for webm and others)

Lab

Continue work on final project

Students will continue work on final project

Students will understand requirements for final exam

Lab

Work on final project

Final Exam practice files

Review for final exam

Students will complete and submit final project

Students will take final exam

Homework

Turn in final project

Final Exam

Take final exam

Lab

Complete final project

Read Chapter 1 in textbook

Complete Quiz 1

Homework Exercise 1

Read chapter 4 textbook

Complete Quiz 2

Homework Exercise 2

Read chapter 2 in textbook

Complete Quiz 3

Homework Exercise 3

Homework Exercise 4

Study for Midterm Exam

Midterm Practice Files

Read pages chapter 3

Homework Exercise 5

Review Final Project

Final Project Design Brief

Flowchart Assignment

Project Mockups V1

Read Chapter 5

Complete Quiz 4

Project Mockups V2 (additions and improvements to V1)

Read chapter 7

Complete Quiz 5

Work on final project

Work on final project

Complete final project

Prepare for final exam

Final Exam Practice Files

Dreamweaver Set Up Video

Firefogg video converter plug-in for Firefox

Online Video File Converter (for webm and others)