HTML & CSS Exam (During Final Exam Block)
Hand in Guardian Rubric (Due during Final Exam Block)
Final Website Gallery Walk - Final Project Rubric
Clean up your desktop computer - files in the trash, log off accounts.
www.natickhighwebdesign.com/webfall2017/firstnamelastname
* This web address will only work if your home page is saved as index.html
Jan 4: Publish Home Page - Home Page Check-in Rubric
Jan 10: Publish Side Pages - Content Peer Grading Rubric
Jan 12 (rescheduled 1/17 due to snow): Publish Completed Site. Share Guardian Rubric (Due during Final Exam Block)
Exam Block: Final Website Gallery Walk (no changes to your site can be made during or after the exam block) - Final Project Rubric
FTP (File transfer protocol)
Instructions for FTP setup in Dreamweaver
Validator
Reset CSS
www.w3schools.com
Web fonts
Inspiration Websites at Templated.co
Adobe Kuler for web colors
Color Combos
Slideshow generator
Saving for the Web in Photoshop CC
HTML & CSS Unit Exam Study Guide
Final Project: Publish Completed Site (Home + Design + 2 choice) - due Wednesday 1/17
Publish home + side pages
Peer feedback
Find your published home page: www.natickhighwebdesign.com/webfall2017/firstnamelastname
* This web address will only work if your home page is saved as index.html
Jan 4: Publish Home Page - Home Page Check-in Rubric
Jan 10: Publish Side Pages - Content Peer Grading Rubric
Jan 12 (rescheduled 1/17 due to snow): Publish Completed Site. Share Guardian Rubric (Due during Final Exam Block)
Exam Block: Final Website Gallery Walk (no changes to your site can be made during or after the exam block) - Final Project Rubric
FTP (File transfer protocol)
Instructions for FTP setup in Dreamweaver
Validator
Reset CSS
www.w3schools.com
Web fonts
Inspiration Websites at Templated.co
Adobe Kuler for web colors
Color Combos
Slideshow generator
Saving for the Web in Photoshop CC
Final Project: Home Page - Publish 1st Draft on 1/2
Jan 2: Publish 1st Draft of Home Page - Home Page Check-in Rubric
Jan 10: Publish Side Pages - Content Peer Grading Rubric
Jan 12: Publish Completed Final Site. Share Guardian Rubric (Due during Final Exam Block)
Exam Block: Final Website Gallery Walk (no changes to your site can be made during or after the exam block) - Final Project Rubric
How to make a fixed-layout gallery
How to make a flexible-layout gallery
Validator
Reset CSS
www.w3schools.com
Web fonts
Font Design Article
Inspiration Websites at Templated.co
Adobe Kuler for web colors
Color Combos
Slideshow generator
Saving for the Web in Photoshop CC
Hopper article
Introduction to building in Dreamweaver CC, video #1 of 2
Introduction to building in Dreamweaver CC, video #2 of 2
Text Edit preferences
Photography Portfolio Page - 12/15
Submit Proposal for Final Project - 12/15
File Structure Quiz - 12/13
Jan 2: Publish 1st Draft of Home Page - Home Page Check-in Rubric
Jan 10: Publish Side Pages - Content Peer Grading Rubric
Jan 12: Publish Completed Final Site. Share Guardian Rubric (Due during Final Exam Block)
Exam Block: Final Website Gallery Walk (no changes to your site can be made during or after the exam block) - Final Project Rubric
How to make a fixed-layout gallery
How to make a flexible-layout gallery
Validator
Reset CSS
www.w3schools.com
Web fonts
Font Design Article
Inspiration Websites at Templated.co
Adobe Kuler for web colors
Color Combos
Slideshow generator
Saving for the Web in Photoshop CC
Google Classroom Question #5 - due 12/7
Create the New Balance Example Page: Complete Video Tutorials 1-4 - due 12/7
Photography Portfolio Page - 12/15
File Structure Practice Quiz - Socrative Login: FNIFL4U44
New Balance Example Website: Complete Video Tutorials 1-4
NB Image 1
NB Image 2
Skills to learn: Nav, Hero and Content Divs, Creating a Side Page, Class vs. Id, Float + Clear, Footer.
Design Inspiration: Templated.co
Lorem Ipsum Generator
Adobe Kuler for web colors
Saving for the Web in Photoshop CC
CSS Reference at w3schools.com
How to create a background image in css3
How to Insert Web Fonts Video
Reset CSS
CSS Validator
Boilerplate Skeleton for HTML & CSS document
Text Edit preferences
HTML Tag cheatsheet
HTML5 Tag cheatsheet
HTML Validator
In Class: Box Model Demo Site
Create the New Balance Example Page: Complete Video Tutorials 1-4 - due 12/7
Photography Portfolio Page - 12/15
In-class Box-Model Demo website:
Photos for In-class Demo
New Balance Example Website: Complete Video Tutorials 1-4
NB Image 1
NB Image 2
Skills to learn: Nav, Hero and Content Divs, Creating a Side Page, Class vs. Id, Float + Clear, Footer.
Design Inspiration: Templated.co
Lorem Ipsum Generator
Adobe Kuler for web colors
Saving for the Web in Photoshop CC
CSS Reference at w3schools.com
How to create a background image in css3
How to Insert Web Fonts Video
Reset CSS
CSS Validator
Boilerplate Skeleton for HTML & CSS document
Text Edit preferences
HTML Tag cheatsheet
HTML5 Tag cheatsheet
HTML Validator
Codecademy | Learn CSS: The Box Model (two parts) - due 11/22
Google Classroom Question #4 - due 11/22
Happy Thanksgiving!
CSS Topics: Box Model, Float + Clear, Web fonts
Box Model
Photos for Demo Website
Reset CSS
Introduction to CSS
Boilerplate Skeleton for HTML & CSS document
CSS Reference at w3schools.com
How to create a background image in css3
Design Inspiration Websites
Lorem Ipsum Generator
Adobe Kuler for web colors
Saving for the Web in Photoshop CC
Text Edit preferences
HTML Tag cheatsheet
HTML5 Tag cheatsheet
Validator
Codecademy | Learn CSS: 1. Selectors and Visual Rules (two parts) - due 11/16
Introduction to CSS worksheet - due 11/16
Exit Slip #5
HTML Review: Skeleton, Container elements, id and class
CSS Topics: Box Model
Box Model
Photos for Demo Website
Reset CSS
Introduction to CSS
Boilerplate Skeleton for HTML & CSS document
CSS Reference at w3schools.com
CSS Zen Garden
HTML to make your own Zen Garden Design
Text Edit preferences
HTML Tag cheatsheet
HTML5 Tag cheatsheet
Validator
Saving for the Web in Photoshop CC
No Question/Exit Slip
Codecademy: Learn HTML: Elements and Structure 1 - due 11/7
HTML Worksheet - due 11/7
Codecademy Learn CSS: 1. Selectors and Visual Rules (two parts) - due 11/16
Introduction to CSS worksheet - due 11/16
HTML Skeleton Quiz
Introduction to CSS: Skeleton, Selectors, Divs, Comments
Reset CSS
Introduction to CSS
Boilerplate Skeleton for HTML & CSS document
CSS Reference at w3schools.com
CSS Zen Garden
HTML to make your own Zen Garden Design
Understanding the Structure of an HTML Document study guide
Text Edit preferences
HTML Tag cheatsheet
HTML5 Tag cheatsheet
Validator
Saving for the Web in Photoshop CC
No Question/Exit Slip - check iPass and catch up on anything you missed - TERM ENDS FRIDAY
Codecademy: Learn HTML: Elements and Structure 1 - due 11/7
HTML Worksheet - due 11/7
Bad Typography Video
Photography Composition
Photography Composition Video
Food Photography Tricks
Color Psychology
Choosing the Right Color for your Brand, video
Adobe Color CC
Saving for the Web in Photoshop CC
Basics in Text Edit
- Tags to learn: skeleton of file, p, headings, images
Understanding the Structure of an HTML Document study guide
Text Edit preferences
HTML Tag cheatsheet
HTML5 Tag cheatsheet
Validator
Moodboard - due 10/24
Exit Slip #4 - due 10/26
Photography Portfolio Project: Part 1- due 10/26
Codecademy Learn HTML: Elements and Structure 1- due 11/7
Bad Typography Video
Photography Composition
Photography Composition Video
Food Photography Tricks
Color Psychology
Choosing the Right Color for your Brand, video
Adobe Color CC
Saving for the Web in Photoshop CC
Basics in Text Edit
- Tags to learn: skeleton HTML document, p, headings, images
What Most Schools Don't Teach, Inspiration in Coding
What is a Web Browser? video
How the Internet Works Video
Mitch Resnick, Let’s Teach Kids to Code Video
Text Edit preferences
HTML Tag cheatsheet
HTML5 Tag cheatsheet
Validator
Magazine Madness Project: Assignment + Rubric - due Friday, 10/20: submit both original and recreation as jpg files.
Google Classroom Question #3 - due 10/20
How to save for web + When to use JPG, PNG, GIF + Raster vs. Vector - take notes in class
Moodboard + Notes on Photography in Branding - due 10/24
Photography Portfolio Project: Part 1- due 10/26
Photography Composition
Photography Composition Video
Food Photography Tricks
Color Psychology
Choosing the Right Color for your Brand, video
Adobe Color CC
Text Tutorials
Dafont.com
When to use jpg, gif, png + Examples
How to create an animated GIF video + Example
Bad Typography Video
Real or Photoshop Game
Pen Tool Challenge
Cool Colors Challenge
No blog/exit slip. Mid-term catch-up week: check iPass and submit any late work (Email to notify me of any late submissions)
Magazine Madness Project: Assignment + Rubric - due Friday, 10/20: submit both original and recreation as jpg files.
Adjustment Layers Demonstration: Demo photo 1, Demo photo 2
Text Tutorials
Dafont.com
Alignment article
How to create an animated GIF video + Example
Real or Photoshop Game
Pen Tool Challenge
Cool Colors Challenge
Exit Slip #3 - due 10/5
Magazine Madness Project: Assignment + Rubric - due Friday, 10/20
Typography Questions + Typography video (to go with questions) - in class
Text Tutorials
Dafont.com
Alignment article
How to save for web
Pexels: A CC-Zero Image Library
Real or Photoshop Game
Pen Tool Challenge
Cool Colors Challenge
Photoshop Skills Checklist Project - submit in google classroom - due 9/29
Complete one text tutorial of your choice - submit as a jpg in google classroom - due 9/29
Google Classroom Question #2 - due 9/29
Dafont.com
How to save for web
Pexels: A CC-Zero Image Library
Real or Photoshop Game
Pen Tool Challenge
Cool Colors Challenge
Photoshop Skills Checklist Project - submit in google classroom - due 9/29
Homework: Magazine Madness Proposal + Final Project Example - submit proposal in google classroom - due 9/25
Exit Slip #2
Complete one text tutorial of your choice - submit as a jpg in google classroom - due 9/29
Photoshop Gallery Activity- submit as a jpg in google classroom - due 9/20
How to save for web
Pexels: A CC-Zero Image Library
Real or Photoshop Game
Pen Tool Challenge
Cool Colors Challenge
September 11 - 15
Google Classroom Question #1 - due Thursday 9/14
Photoshop Gallery - complete in class, due 9/20
Demonstrations: layers, cut + paste, transform, lassos, content-aware fill, clone stamp, masks and adjustment layers, filter gallery
Tutorials:
Magic wand
Quick selection (image to learn on)
Photoshop Layer Mask Tutorials
Photoshop Workspace
Photoshop Interface (very basics)
Photoshop Preview
Next Revolution in Beauty, A-dobe Fotoshop (entertaining commercial)
Photoshop Games!
Real or Photoshop Game
Pen Tool Challenge
Cool Colors Challenge
September 5 - 8
Exit Slip #1 - due 9/8
Welcome Letter - due 9/8
* Out of sequence activities due to technical difficulties with the Adobe Suite:
Design Principles Pre + Post Website Critique - due 9/12
Design Principles Video + Notes - complete in class, due 9/8
Tools to learn: layers, cut + paste, transform, lassos, content-aware fill, clone stamp, masks and adjustment layers, filter gallery
Teach Your Friend, magic wand vs. quick selection (image to learn on)
Design Principles Video
Photoshop Basic Tools Tutorial
Photoshop Interface (very basics)
Videos to Inspire
Photoshop Preview
Next Revolution in Beauty, A-dobe Fotoshop (entertaining commercial)
Photoshop Games!
Real or Photoshop Game
Pen Tool Challenge
Cool Colors Challenge
Keywords/Units & Seating
Logging in to your computer
Exploring the digital classroom
Tweet of the Week Introduction
Assignments: Welcome letter
Introductions: Turn Around and Meet My Friend
Welcome Letter - due Friday, 9/8
HTML pre-assessment- complete in class
File Structure pre-assessment - complete in class
Copyright Assignment - complete in class
Handbook
Fire Escape Plan from room 201
Creative Commons Search
Pexels: A CC-Zero Image Library
Student Website Examples
Videos to Inspire
Here is to the Crazy Ones
Smart is Sexy
Why I Create, by: Adobe
Creative Commons Video
Photoshop Preview
Using Standard District Template
Unit 1: Photoshop
Unit 2: Design Principles
Unit 3: HTML
Unit 4: CSS
Unit 5: Project Management
Unit 6: Dreamweaver | Project Website
Archived syllabus: Spring 2017
Projects by Introduction to Web Design Students.
See my schedule for after-school hours and free periods.
