Student Resources

* Still Available: In the Classroom Files, Fall 2014

* Still Available: In the Classroom Files, Spring 2014
* Course Units: Using Standard District Template

• Personal Site
Rubrics
Personal Site All Pages- Rubric (Submit at exam block)
Content Peer Editing Feedback Form (Submit at exam block)
Guardian Rubric (submit at exam block)

---

Finding your home page (depending on your class):
* This Web address will only work if your home page is saved as index.html
1. www.natickhighwebdesign.com/web4spring2015/firstnamelastname
2. www.natickhighwebdesign.com/web5spring2015/firstnamelastname

3. www.natickhighwebdesign.com/web6spring2015/firstnamelastname

• Class Survey

Submit Class Survery before Leaving!

Week Outline and Class Objectives

• File Structure
Setting up FTP
Connecting to FTP

• Personal Site
Personal Site Home Page- Rubric (due June 5th)
Personal Site, Rubric used for page 3 (due June 10th)
Personal Site All Pages- Rubric (due during Final Exam Block, Teacher will Print)
Content Peer Editing Feedback Form (due during Final Exam Block, Teacher will Print)
Guardian Rubric (due duringFinal Exam Block)

---

Finding your home page (depending on your class):
* This Web address will only work if your home page is saved as index.html
1. www.natickhighwebdesign.com/web4spring2015/firstnamelastname
2. www.natickhighwebdesign.com/web5spring2015/firstnamelastname

3. www.natickhighwebdesign.com/web6spring2015/firstnamelastname

Dreamweaver
Dreamweaver Handbook (to be updated)
Adobe TV- Dreamweaver

- Dreamweaver Video Tutorial #1 by Mrs. Cullen
- Dreamweaver Video Tutorial #2 by Mrs. Cullen
- Dreamweaver Video Tutorial #3 by Mrs. Cullen
- Dreamweaver Video Tutorial #4 by Mrs. Cullen
----

Mrscullen.com, Recreate

Homework #1: Content and Images for All Pages!

No Exit Slip or Blog (focus on final project)

Week Outline and Class Objectives

Dreamweaver
Dreamweaver Handbook (to be updated)
Adobe TV- Dreamweaver

- Dreamweaver Video Tutorial #1 by Mrs. Cullen
- Dreamweaver Video Tutorial #2 by Mrs. Cullen
- Dreamweaver Video Tutorial #3 by Mrs. Cullen
- Dreamweaver Video Tutorial #4 by Mrs. Cullen
----

Mrscullen.com, Recreate

---
File Structure
Setting up FTP
Connecting to FTP

Project Management

Project Management, Critique Session

Homework #1: Personal Site, Content Page #1

Submit bi-weekly exit slip, 3:2:1 - last one!

Week Outline and Class Objectives

Web4, HTML & CSS Study Guide

Web5, HTML & CSS Study Guide

Web6, HTML & CSS Study Guide

HTML & CSS Combination

Page Re-Create
HTML & CSS Tag You Are It!

---

CSS Defaults
Reset CSS

Skeleton for start of HTML and CSS page

Dreamweaver
Dreamweaver Handbook (to be updated)
Adobe TV- Dreamweaver

- Dreamweaver Video Tutorial #1 by Mrs. Cullen
- Dreamweaver Video Tutorial #2 by Mrs. Cullen
- Dreamweaver Video Tutorial #3 by Mrs. Cullen
- Dreamweaver Video Tutorial #4 by Mrs. Cullen
----
File Structure
Setting up FTP
Connecting to FTP

Project Management

Project Management, Site Map & Wireframe

Homework #1: Project Management Example, complete with resource site, color combination, site map and home page wireframe
* Required Pages in Site Map: Home, Design and Three Pages of your Choice

Helpful Resources

Color Combos for color combo

Adobe Kuler for color combos

---

Site Resources
themeforest.net - attractive

Word Press Templates - attractive
themeforest.net/item/mobile/full_screen_preview/7057821 - responsive site

www.webpagesthatsuck.com - not so attractive

Submit bi-weekly blog

Week Outline and Class Objectives

HTML
HTML Handbook
Codecademy, Introduction to HTML chapter assignment
Introduction to HTML worksheet (use w3schools.com as a reference)

CSS

CSS Video Intro
Introduction to CSS
CSS Worksheet (use www.w3schools.com as a reference)

Codecademy, Introduction to CSS chapter assignment

Combination

Page Re-Create
HTML & CSS Tag You Are It!

---

CSS Defaults
Reset CSS

Skeleton for start of HTML and CSS page

Videos to Inspire
Mitch Resnick, Let’s Teach Kids to Code & Reflection
What Most Schools Don't Teach, Inspiration in Coding

Homework #1: Study for HTML & CSS Unit Exam

Homework #2: Project Management, Step #1 completed in a Google Doc

Submit bi-weekly exit slip, 3:2:1

Week Outline and Class Objectives

CLICK HERE FOR WHAT TO DO WHILE I AM OUT, May 6th & 7th
Also Submit Blog Entry and Help Each Other Out!

HTML
HTML Handbook
Codecademy, Introduction to HTML chapter assignment
Introduction to HTML worksheet (use w3schools.com as a reference)

CSS

CSS Video Intro
Introduction to CSS
CSS Worksheet (use www.w3schools.com as a reference)

Codecademy, Introduction to CSS chapter assignment

Combination

Page Re-Create
HTML & CSS Tag You Are It!

---

CSS Defaults
Reset CSS

Skeleton for start of HTML and CSS page

Videos to Inspire
Mitch Resnick, Let’s Teach Kids to Code & Reflection
What Most Schools Don't Teach, Inspiration in Coding

Homework #1: Complete any assignments which were not finished in class/Study for Exam

Submit bi-weekly blog

Week Outline and Class Objectives

HTML
HTML Handbook
Codecademy, Introduction to HTML chapter assignment
Introduction to HTML worksheet (use w3schools.com as a reference)

CSS

CSS Video Intro
Introduction to CSS
CSS Worksheet (use www.w3schools.com as a reference)

Combination

Page Re-Create

---

CSS Defaults
Reset CSS

Skeleton for start of HTML and CSS page

Videos to Inspire
Mitch Resnick, Let’s Teach Kids to Code & Reflection
What Most Schools Don't Teach, Inspiration in Coding

Homework #1: Complete any assignments which were not finished in class

Submit bi-weekly exit slip, 3:2:1

Week Outline and Class Objectives

• Intro. HTML
Videos to Inspire
Mitch Resnick, Let’s Teach Kids to Code
What Most Schools Don't Teach, Inspiration in Coding & Reflection

Resources
HTML Handbook
Notepad Lesson with Mrs. Cullen (in the Classroom)

Assignments
Codecademy, Introduction to HTML chapter assignment
Introduction to HTML worksheet (use w3schools.com as a reference)

Homework #1: Complete any assignments which were not finished in class

Submit bi-weekly blog

Week Outline and Class Objectives

• Intro. HTML
Videos to Inspire
Mitch Resnick, Let’s Teach Kids to Code
What Most Schools Don't Teach, Inspiration in Coding

Resources
HTML Handbook
Notepad Lesson with Mrs. Cullen (in the Classroom)

Assignments

File Structure, Pre-Assessment for Web4

File Structure, Pre-Assessment for Web5

File Structure, Pre-Assessment for Web6

---
Codecademy, Introduction to HTML chapter assignment
Introduction to HTML worksheet (use w3schools.com as a reference)

Homework #1: Complete any assignments which were not finished in class

Submit bi-weekly exit slip, 3:2:1

Week Outline and Class Objectives

• Intro. HTML
Videos to Inspire
Mitch Resnick, Let’s Teach Kids to Code
What Most Schools Don't Teach, Inspiration in Coding

Resources
HTML Handbook
Notepad Lesson with Mrs. Cullen (in the Classroom)

Assignments

File Structure, Pre-Assessment for Web4

File Structure, Pre-Assessment for Web5

File Structure, Pre-Assessment for Web6

---
Codecademy, Introduction to HTML chapter assignment
Introduction to HTML worksheet (use w3schools.com as a reference)

Homework #1: Complete any assignments which were not finished in class

Catch up on any missing blogs or exit slips (end of quarter)

Week Outline and Class Objectives

CLICK HERE FOR WHAT TO DO WHILE I AM OUT- March 26th & 27th
•  Links Needed While I am Out

Design Principles, Pre-Assessment Assignment

Copyright Assignment

• Design Principles

Design Principles, Pre-Assessment Assignment
Design Principles, Presentation & Exam

Best Practices for Typography on the Web VIDEO & To Focus On List
---
Photography Composition
Food Photography Tricks

---

Copyright

Copyright Assignment

Copyright Links

Color Combination Builder:
- Kuler
- Color Combos
- Color meanings in Business/Marketing

- The psychology of color, Infographic

Site Resources
themeforest.net - attractive
www.webpagesthatsuck.com - not so attractive
themeforest.net/item/mobile/full_screen_preview/7057821 - responsive site
http://www.templatemonster.com/demo/48160.html - responsive site

• Intro. HTML
Videos to Inspire
Mitch Resnick, Let’s Teach Kids to Code
What Most Schools Don't Teach, Inspiration in Coding

Resources
HTML Handbook
Notepad Lesson with Mrs. Cullen (in the Classroom)

Assignments
Codecademy, Introduction to HTML chapter assignment
Introduction to HTML worksheet (use w3schools.com as a reference)

Homework #1: Complete any assignments which were not finished in class

Week Outline and Class Objectives

• Express Yourself
Express Yourself Project Directions

Express Yourself Rubric

Optional Photoshop Project, Photoshop Ping Pong

- Photoshop Ping Pong NHS Showcase
- Photoshop Ping Pong Examples Outside Natick
- Photoshop Ping Pong image to download option 1, option 2, option 3

• Copyright

Copyright Assignment

Copyright Links

• Design Principles

Design Principles, Pre-Assessment Assignment
Design Principles, Presentation & Exam

Best Practices for Typography on the Web & To Focus On List
---
Photography Composition
Food Photography Tricks

Color Combination Builder:
- Kuler
- Color Combos
- Color meanings in Business/Marketing

- The psychology of color, Infographic

Site Resources
themeforest.net - attractive
www.webpagesthatsuck.com - not so attractive
themeforest.net/item/mobile/full_screen_preview/7057821 - responsive site
http://www.templatemonster.com/demo/48160.html - responsive site

Homework #1: Complete EYP Reflection (page 17), do not start until told by teacher

Week Outline and Class Objectives

• Express Yourself
Express Yourself Project Directions

Express Yourself Rubric

Optional Photoshop Project, Photoshop Ping Pong

- Photoshop Ping Pong NHS Showcase
- Photoshop Ping Pong Examples Outside Natick
- Photoshop Ping Pong image to download option 1, option 2, option 3

• Copyright

Copyright Assignment

Copyright Links

• Design Principles

Design Principles, Pre-Assessment Assignment
Design Principles, Presentation & Exam
---
Photography Composition
Food Photography Tricks

Color Combination Builder:
- Kuler
- Color Combos
- Color meanings in Business/Marketing

- The psychology of color, Infographic

Site Resources
themeforest.net - attractive
www.webpagesthatsuck.com - not so attractive
themeforest.net/item/mobile/full_screen_preview/7057821 - responsive site
http://www.templatemonster.com/demo/48160.html - responsive site

Homework #1: Complete EYP Reflection (page 17), do not start until told by teacher

Week Outline and Class Objectives

•  Photoshop

Next Revolution in Beauty, A-dobe Fotoshop (entertaining commercial)

Photoshop Interface (very basics)

Photoshop Copy Cat Drill
- The Killers, Process Example
---
- Taylor Swift Example
- Taylor Swift, to Load
---
- The Killers Example
- The Killers, to Load
---
- Photoshop Worksheet

• Express Yourself
Indiv. Photos to Load in Class
Express Yourself Project (empty rubric)
---
Web4: EYP, Pre-Assessment Analysis
Web5: EYP, Pre-Assessment Analysis

Web6: EYP, Pre-Assessment Analysis

Homework #1: complete Photoshop Worksheet
Homework #2: Express Yourself Words, pg. 2 (share in Google Doc)

Week Outline and Class Objectives

•  Key Word Building
Key Word Building Assignment, w/ directions, examples and rubric
Example Project: https://twitter.com/css_web

---

*Web4, Voc. Exam

*Web5, Voc. Exam

*Web6, Voc. Exam

•  Photoshop

Next Revolution in Beauty, A-dobe Fotoshop (entertaining commercial)

Photoshop Interface (very basics)
Discuss psdisasters.com

Photoshop Copy Cat Drill
- The Killers, Process Example
---
- Taylor Swift Example
- Taylor Swift, to Load
---
- The Killers Example
- The Killers, to Load
---
- Photoshop Worksheet

Homework #1: Complete any worksheets started in class

Week Outline and Class Objectives

•  Key Word Building
Key Word Building Assignment, w/ directions, examples and rubric
Example Project: https://twitter.com/css_web

---

Presentation Room

•  Photoshop

Next Revolution in Beauty, A-dobe Fotoshop (entertaining commercial)

Photoshop Interface (very basics)

Photoshop Copy Cat Drill
- The Killers, Process Example
---
- Taylor Swift Example
- Taylor Swift, to Load
---
- The Killers Example
- The Killers, to Load
---
- Photoshop Worksheet

• Forms to Fill Out & Info to Know
Flash Drive
Welcome Letter

Sharing a Google Doc

Homework #1: None, Enjoy February Break!

Week Outline and Class Objectives

CLICK HERE FOR WHAT TO DO WHILE I AM OUT on Feb. 3, 2015

•  Key Word Building
Key Word Building Assignment, w/ directions, examples and rubric
Example Project: https://twitter.com/css_web

---

Presentation Room

• Forms to Fill Out & Info to Know
Flash Drive
Welcome Letter

Sharing a Google Doc

•  Poster Gallery

Directions for Exploring, Creating & Sharing

Homework #1: Complete Key Word Building Assignment

Week Outline and Class Objectives

• Forms to Fill Out & Info to Know
Computer Experience Survey
Welcome Letter

Fire Escape Plan from room 201
Natick High Web Design, Gallery Site

• Vidoes to Influence
Here is to the Crazy Ones
Smart is Sexy
Above and Beyond by: Peter Reynolds
Why I Create, by: Adobe
What Most Schools Don't Teach, Inspiration in Coding

•  Poster Gallery

Directions for Exploring, Creating & Sharing

•  Key Word Building
Key Word Building Assignment
Example Project: https://twitter.com/css_web
Presentation Room