Introduction to Web Design with HTML5 and CSS 3

Introduction to Web Design with

HTML5 and CSS 3

Weekly Schedule

Week 1

Monday

Intro to class and

Pretest

Tuesday

How the Internet

Works

Wednesday

HTML Basics

Thursday

HTML Text Elements

Friday

HTML Link and Image

Elements

Week 2

Monday

HTML Image and Link

Elements

Formatting Elements

Assignment 1

Tuesday

Practice Pages Resume or About Me

Page

Wednesday

Practice Pages - Table

of Contents Page

Thursday

Practice Pages - News

or Product Catalog

Page

Friday

Quiz 1

Assignment 2

Codecademy Online

Practice

Week 3

Monday

Tuesday

Tag Drills and Find My HTML Tables

Errors

Wednesday

HTML 5 Elements

Thursday

HTML 5 Elements

Friday

Tag Drills and Find My

Errors

Week 4

Monday

Codecademy Online

Practice

Tuesday

HTML Block VS Inline

Wednesday

CSS Basics and Inline

Styling

Thursday

Friday

CSS Basics and Internal CSS Basics and External

Styling

Styling

Week 5

Monday

CSS Classes and IDs

Tuesday

CSS Box Model

Wednesday

Quiz 2

CSS Colors and

Backgrounds

Thursday

CSS Exercises on

W3Schools

Assignment 3

Friday

CSS Practice Day

Week 6

Monday

CSS Font Properties

Tuesday

CSS Lists and Links

Wednesday

Thursday

CSS Centering Methods CSS Exercises on

W3Schools

Assignment 4

Copyright ?

Friday

Comments and CSS

Practice Pages

Introduction to Web Design with

HTML5 and CSS 3

Weekly Schedule

Week 7

Monday

CSS Floats and

Columns

Tuesday

CSS Floats and

Columns

Wednesday

Dessert Oasis

Practice Page

Thursday

Dessert Oasis

Practice Page

Friday

Science Club Practice

Page

Thursday

Study Day

Friday

CSS Test

Thursday

Final Project

Introduction and

Research

Friday

Final Project

Wireframe and Style

Guide

Thursday

Final Project

Page Structure and

Begin Coding

Friday

Final Project

Coding

Thursday

Final Project

Coding

First Draft

Screenshots

Friday

Final Project

Coding

Thursday

Final Project

Coding

Friday

Final Project

Website Files Due

Post Test

Week 8

Monday

Science Club Practice

Page

Tuesday

Pet Palace Practice

Page

Wednesday

Pet Palace Practice

Page

Assignment 5

Week 9

Monday

CSS Effects

Tuesday

Image Editing

Wednesday

Image Editing

Assignment 6

Week 10

Monday

Final Project

Research,

Wireframe and Style

Guide

Tuesday

Final Project

Collection

Wednesday

Final Project

Setup File and Page

Structure

Week 11

Monday

Final Project

Coding

Tuesday

Final Project

Coding

Wednesday

Final Project

Coding

Week 12

Monday

Final Project

Coding

Tuesday

Final Project

Coding

Wednesday

Final Project

Peer Review and

Revisions

Copyright ?

Week 1 Day 1 - Introduction:

Go over class rules and procedures. Include any ¡°get to know you¡± or introductory activities.

Students take the Pretest found in the Tests and Quizzes folder. Pretest is not counted in final

grade. At the end of the term students take the test again for credit. This shows knowledge

gained throughout the term.

Week 1 Day 2 - How the Internet Works:

Go to

1. Under Computer Science Principles, watch video called "What is the internet?"

2. Under How the internet works, watch video called "THE INTERNET: Wires, Cables, &

Wifi"

3. Under How the internet works, watch video called "THE INTERNET: IP Addresses and

DNS"

4. Under How the internet works, watch video called "THE INTERNET: Packets, Routing

and Reliability"

5. Under How the internet works, watch video called "THE INTERNET: HTTP and HTML"

Vocabulary to know:

? HTML

? URL

? Bits and bytes

? 3 ways to connect to the internet

? 3 types of browsers

? DNS

Week 1 Day 3 - HTML Basics:

View Unit 1-1 HTML Basics PowerPoint in the Presentations folder and follow instructions to

create 2 new HTML files.

Things to Know:

? Required tags

? 3 S's: Spelling, Spacing, and Syntax

Week 1 Day 4 - Text Elements:

View Unit 1-2 HTML Text Elements PowerPoint in the Presentations folder and follow

instructions to add headings, paragraphs, and a list to your page.

Things to Know:

? Paragraph tag

? Headings tags

? Unordered List tags

? Ordered List tags

? 3 S's: Spelling, Spacing, and Syntax

Week 1 Day 5 - Links and Images:

View Unit 1-3 HTML Image and Link Elements PowerPoint in the Presentations folder and

follow instructions to add links and images to your page.

Things to Know:

? Anchor tag

o External links

o Internal links

o Bookmark links

? Image tag

? Attributes

? 3 S's: Spelling, Spacing, and Syntax

Assignment 1: Submit Completed Index page (Week 2 Day 1)

Your page should include all of the required tags, a title, all 6 headings, 2 paragraphs, an

unordered list, an ordered list, 2 images, an example of all 3 types of links, bolded text,

emphasized text, a horizontal rule and a line break.

Sample page is provided in the Sample Pages source files folder called index.html.

 ................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download