The week of March 20 to March 24

Current Project: A Global Web

Entry Document

Rubric

• 1-2 NTKs
• 5-6 NTKs

Learning Targets:

• Explain the qualities of an effective website.
• Use design process to create a website for a purpose

Standards

• 9-12.CI.2. create a web page 
• 9-12.CI.3. use a variety of media and formats to design, develop, publish, and present projects (e.g., newsletters, web sites, presentations, photo galleries)
• 9-12.CC.3. collaborate in content-related projects that integrate a variety of media (e.g., print, audio, video, graphic, simu- lations, and models) 

Checkpoints

• Part I: HTML and CSS
• Part II: Design 
• week 1
• week 2
• Part III: Refinement

This week's agendas:

Monday

• Quiz
• Evaluate group websites
1. 1-2 hour websites
2. 5-6 hour websites

Tuesday

• Typography
• Examples: 1 2 3
• Website refinement planning guide

Wednesday

• Work on Website refinement planning guide (due Friday)

Thursday

• Complete the Website refinement planning guide
• Turn in your Website Refinement Planning Guide to Google Classroom by Friday.
• 1-2 hr.
• 5-6 hr.
• Use your planning guide to make final adjustments to your website.
• When you are done, fill out a rubric for your site.
• Submit rubric to me in class on Friday.

Friday

• Turn in your Website refinement planning guide to Google Classroom today.
• 1-2 hr.
• 5-6 hr.
• Use your planning guide to make final adjustments to your website.
• When you are done, fill out a rubric for your site.
• Submit rubric to me in class today.

Assignments:

• Submit Group Website
• Website refinement planning guide

Resources:

• Website Usability Guidelines from 1-2 hour and 5-6 hour
• HTML Guides:
• Positioning
• Menu Bars
• Linking Pages

This Week: Mar. 13 – Mar. 17

Current Project: A Global Web

Entry Document

Rubric

• 1-2 NTKs
• 5-6 NTKs

Learning Targets:

• Explain the qualities of an effective website.
• Use design process to create a website for a purpose

Standards

• 9-12.CI.2. create a web page 
• 9-12.CI.3. use a variety of media and formats to design, develop, publish, and present projects (e.g., newsletters, web sites, presentations, photo galleries)
• 9-12.CC.3. collaborate in content-related projects that integrate a variety of media (e.g., print, audio, video, graphic, simu- lations, and models) 

Checkpoints

• Part I: HTML and CSS
• Part II: Design 
• this week 
• last week

This week's agendas:

Monday

• Activity: Planning group website
• Success criteria: Finished product meets the qualities of an effective website.
• Your planning sheet is signed by Ozias.
• Create a Group Planning document (on paper or electronically) that goes through the first two steps of the design process by answering these questions:
1. What is our purpose?
2. What are our requirements?
3. What is our content?
• The more specific your answers are to those questions, the easier the final project will come together.
• Success criteria: Document accurately reflects the goals from the entry document and is approved by Mr. O.
• Fundraising video

Tuesday

• Rubric
• HTML Guides:
• Positioning
• Menu Bars
• Linking Pages
• Overview of user testing (see Wednesday for details)
• Activity: Planning group website
• Success criteria: Finished product meets the qualities of an effective website.
• Your planning sheet is signed by Ozias.
• Prototype your website.
• Use the rubric to get feedback from another group
• Implement the feedback (document this)

Wednesday

• Quiz review
• Activity: Planning group website
• Success criteria: Finished product meets the qualities of an effective website.
• Your planning sheet is signed by Ozias.
• Activity: gather feedback on your website:
• Write down three things you want your testing group to find on your site. Observe while they try to do so. Make note of any problems they have.
• Ask your testing group to evaluate your website using the rubric.
• Using your notes and the rubrics from the testing group, list and prioritize changes you need to make to your website. Then make them.
• Success Criteria: you are able to explain the results of your testing and how you used it to improve your website during your presentation.

Thursday

• 5-6 user testing

Friday

• Finish presentations
• Quiz

Quizzes and Tests:

• Quiz on stages of design and qualities of a good website next Friday.

Assignments:

• Project Sheet
• Assignment #1 (Group): Planning Document
• Assignment #2 (Group): Layout 
• Assignment #3 (Individual): User feedback and testing
• Assignment #4 (Group): Design Reflection (use rubric)

Resources:

• Website Usability Guidelines from 1-2 hour and 5-6 hour
• HTML Guides:
• Positioning
• Menu Bars
• Linking Pages

This Week, March 6-10, 2017

• Current Project
• Agendas
• Quiz
• Assignments
• Resources

• Monday
• Tuesday
• Wednesday
• Thursday
• Friday

Current Project: A Global Web

Entry Document

• 1-2 NTKs
• 5-6 NTKs

Learning Targets:

• Explain the qualities of an effective website.
• Use design process to create a website for a purpose

Standards

• 9-12.CI.2. create a web page 
• 9-12.CI.3. use a variety of media and formats to design, develop, publish, and present projects (e.g., newsletters, web sites, presentations, photo galleries)
• 9-12.CC.3. collaborate in content-related projects that integrate a variety of media (e.g., print, audio, video, graphic, simu- lations, and models) 

Checkpoints

• Part I: HTML and CSS
• Part II: Design (this page)

This week's agendas:

Monday

• Activity: Planning group website
• Success criteria: Finished product meets the qualities of an effective website.
• Workshop:
• Small group: define and find connections: Understand, Define, Ideate, Plan, Prototype (verb), Present (verb).
• Deliverable: group mind map
• Intro to Design Process
• Qualities of a Good Website
• Example sites:
• https://www.codeschool.com
• Flipboard
• www.apple.com

Tuesday

• Activity: Planning group website
• Success criteria: Finished product meets the qualities of an effective website.
• Workshop
• Qualities of a Good Website:
• Has a clear purpose
• Accurate
• Multi-modal
• Ethical (including respecting intellectual property)
• Usable (including readable and accessible)
• Aesthetics
• Example sites:
• https://www.codeschool.com
• Flipboard
• www.apple.com

Wednesday

• Funky schedule today due to speaker.
• How to link between multiple pages
• How to style navigation bars
• Activity: 
• Create a Group Planning document (on paper or electronically) that goes through the first two steps of the design process by answering these questions:
1. What is our purpose?
2. What are our requirements?
3. What is our content?
• The more specific your answers are to those questions, the easier the final project will come together.
• Success criteria: Document accurately reflects the goals from the entry document and is approved by Mr. O.

Thursday

• No science teacher for you today!
• Continue to work on your Group Planning document.

Friday

• Workshop: How to add multiple pages and a menu bar.
• Activity: Continue to plan your website.
• There are several components to planning. Get the planning sheet given to you in class signed by Mr. Ozias as you complete each component.

Quizzes and Tests:

• Quiz on stages of design and qualities of a good website next Friday.

Assignments:

• Assignment #1 (Group): Planning Document
• Assignment #2 (Group): Layout 
• Assignment #3 (Individual): Design Reflection (use rubric)
• Assignment #4 (Group): User feedback and testing

Resources:

• Website Usability Guidelines from 1-2 hour and 5-6 hour

Current Work: 2/23–3/3

• Quiz
• Assignments
• Resources

---

Quiz

• Friday, 3/3/17
• Review is available here.
• Quiz Answer Form

Assignments:

• Assignment #1: "practice1.html" should already be in your "HTMLpractice" folder
• Assignment #2:
• check it in with me in class
• Directions:
• Create a webpage; name it "practice2.html"
• Use a correct page structure
• Include the following HTML:
• Header
• Paragraph
• Bold
• Emphasis
• Numbered List
• Bullet Point
• Images
• Link
• Include CSS to do the following:
• Change a font
• Change a background color
• Put a border around something
• Assignment #3:
• Create this using CSS:

• Use content of your own choosing.

Resources

• Slide Show
• HTML/CSS Cheat Sheet
• CSS Selectors and properties (and another one)
• CSS demos at W3 Schools

Agenda: Friday, 2/16/17

Today

• Assignment #1: "practice1.html" should already be in your "HTMLpractice" folder
• Assignment #2
• DUE MONDAY (check it in with me in class)
• Directions:
• Create a webpage; name it "practice2.html"
• Use a correct page structure
• Include the following HTML:
• Header
• Paragraph
• Bold
• Emphasis
• Numbered List
• Bullet Point
• Images
• Link
• Include CSS to do the following:
• Change a font
• Change a background color
• Put a border around something
• Workshop: CSS and positioning (take notes!!!!!!!!!)
• CSS demos at W3 Schools

Resources:

• Slide Show
• HTML/CSS Cheat Sheet
• CSS Selectors and properties (and another one)
• CSS demos at W3 Schools

Agenda: Thursday, 2/16/17

1st and 2nd Hour

• Earth Science stuff today

5th and 6th Hour

• Assignment #1: "practice1.html" should be in your "HTMLpractice" folder
• Assignment #2:
• Create a webpage; name it "practice2.html"
• Use a correct page structure
• Include the following HTML:
• Header
• Paragraph
• Bold
• Emphasis
• Numbered List
• Bullet Point
• Images
• Link
• Include CSS to do the following:
• Change a font
• Change a background color
• Put a border around something

Resources:

• Slide Show
• HTML/CSS Cheat Sheet
• CSS Selectors and properties (and another one)
• CSS demos at W3 Schools

Agenda: Wednesday,2/15/17

1st and 2nd Hour

• Heart Video
• Assignment #1: "practice1.html" should be in your "HTMLpractice" folder
• Intro to CSS
• Structure of the website
• Anatomy of a style declaration
• Assignment:
• Create a webpage; name it "practice2.html"
• Use a correct page structure
• Include the following HTML:
• Header
• Paragraph
• Bold
• Emphasis
• Numbered List
• Bullet Point
• Images
• Link
• Include CSS to do the following:
• Change a font
• Change a background color
• Put a border around something

Resources:

• Slide Show
• HTML/CSS Cheat Sheet
• CSS Selectors and properties (and another one)

5th and 6th Hour

• Refresh on CSS
• Assignment #1: "practice1.html" should be in your "HTMLpractice" folder
• Assignment #2:
• Create a webpage; name it "practice2.html"
• Use a correct page structure
• Include the following HTML:
• Header
• Paragraph
• Bold
• Emphasis
• Numbered List
• Bullet Point
• Images
• Link
• Include CSS to do the following:
• Change a font
• Change a background color
• Put a border around something

Resources:

• Slide Show
• HTML/CSS Cheat Sheet
• CSS Selectors and properties (and another one)

Agenda: Friday, 2/10/17

1st and 2nd Hour

After yesterday's HTML-athon, today we need to get caught up on some Earth Science!

5th and 6th Hour

• Intro to CSS
• Structure of the website
• Anatomy of a style declaration
• Assignment:
• Create a webpage; name it "practice2.html"
• Use a correct page structure
• Include the following HTML:
• Header
• Paragraph
• Bold
• Emphasis
• Numbered List
• Bullet Point
• Images
• Link
• Include CSS to do the following:
• Change a font
• Change a background color
• Put a border around something

Resources:

• Slide Show
• HTML/CSS Cheat Sheet
• CSS Selectors and properties (and another one)

Agenda: Thursday, 2/9/17

1st and 2nd Hour

Do you want to make a website?

Do you want to learn some code?

We'll write HTML,

And CSS as well,

And head out on this road!

Today:

• Create a new folder in your Google Drive. This is where you will store your work.
• Name it "HTMLpractice-LastName-FirstInitial" (leave out the quotation marks; include the hyphens; no spaces). 
• Right-click on it, go to "Share" and share it with me.
• Set up your text editor (note: if you have your own computer, you will need to use Chrome for this app):
• First: download this extension: HTML Editey
• Then: open it agree to everything
• Create a new document
• In that document, go to FILE>PAGE SETUP and uncheck "enable auto pairing"
• Learn a few HTML tags
• At the end of class, fill out this exit ticket 

5th and 6th Hour

• More about HTML
• Links
• Lists
• Images
• Intro to CSS
• Structure of the website
• Anatomy of a style declaration
• Assignment:
• Create a webpage; name it "practice2.html"
• Use a correct page structure
• Include the following HTML:
• Header
• Paragraph
• Bold
• Emphasis
• Numbered List
• Bullet Point
• Images
• Link
• Include CSS to do the following:
• Change a font
• Change a background color
• Put a border around something

Resources:

• Slide Show
• HTML/CSS Cheat Sheet
• CSS Selectors and properties (and another one)

Agenda: Wednesday, 2/8/17

1st and 2nd hour

• A short visit from Link Crew
• Make sure you turned in your website evaluation assignment
• Today: HTML Pretest (Pretest Answer Form Link)
• Introduction to the internet
• Student count day.

5th and 6th hour

Do you want to make a website?

Do you want to learn some code?

We'll write HTML,

And CSS as well,

And head out on this road!

Today:

• Create a new folder in your Google Drive. This is where you will store your work.
• Name it "HTMLpractice-LastName-FirstInitial" (leave out the quotation marks; include the hyphens; no spaces). 
• Right-click on it, go to "Share" and share it with me.
• Set up your text editor (note: if you have your own computer, you will need to use Chrome for this app):
• First: download this extension: HTML Editey
• Then: open it agree to everything
• Create a new document
• In that document, go to FILE>PAGE SETUP and uncheck "enable auto pairing"
• Learn a few HTML tags

Agenda: Tuesday, 2/7/17

1st and 2nd hour

• Course Selection Fair (short class!)
• Earth Science work today

5th and 6th hour

Pretest Link

• Make sure you turned in your website evaluation assignment
• Today: HTML Pretest
• Introduction to the internet

Agenda: Monday, 2/6/17

1st and 2nd Hour

1st and 2nd Hour

• Project Entry Document and NTKs
• Use your Website Evaluation Form, collaborate with your group to develop a list of website design guidelines. Put them in this document: Class Guidelines

Finish and Turn in Group Assignment: Mind Map

1. Create on paper a mind map of the kinds of information you will need for your website. Refer to the Entry Document.
2. Take a picture of your mind map and submit to Google Classroom.
3. Claim a project board for your group and attach your mind map to it

Today: Individual Assignment
Read this article on website design. Use the article to add any guidelines you are missing to your list of design guidelines.
Then, use your guidelines to evaluate one of your favorite websites. Create a document that:

• lists your guidelines
• describes how each one is or is not used on your website (you may want to use screenshots to make this easier)
• gives your overall evaluation of the website
• Make sure you include the URL of the website!

2 hints for your document:

• Use a table to keep your guidelines and screenshots line up (if you don't like the look of the table, you can make the borders invisible)
• Use Google Drawing to annotate your images

5th and 6th hour

• Project Entry Document and NTKs
• Class Website Guidelines

Finish and Turn in Group Assignment: Mind Map

1. Create on paper a mind map of the kinds of information you will need for your website. Refer to the Entry Document.
2. Take a picture of your mind map and submit to Google Classroom.
3. Claim a project board for your group and attach your mind map to it

Today: Individual Assignment
Read this article on website design. Use the article to add any guidelines you are missing to your list of design guidelines.
Then, use your guidelines to evaluate one of your favorite websites. Create a document that:

• lists your guidelines
• describes how each one is or is not used on your website (you may want to use screenshots to make this easier)
• gives your overall evaluation of the website
• Make sure you include the URL of the website!

2 hints for your document:

• Use a table to keep your guidelines and screenshots line up (if you don't like the look of the table, you can make the borders invisible)
• Use Google Drawing to annotate your images

Agenda: Friday, 2/3/17

1st and 2nd Hour

1st and 2nd Hour

• Project Entry Document and NTKs
• Use your Website Evaluation Form, collaborate with your group to develop a list of website design guidelines. Put them in this document: Class Guidelines

Group Assignment: Mind Map

1. Create on paper a mind map of the kinds of information you will need for your website. Refer to the Entry Document.
2. Take a picture of your mind map and submit to Google Classroom.
3. Claim a project board for your group and attach your mind map to it

5th and 6th hour

• Project Entry Document and NTKs

Use the Website Evaluation Form (in the Project Resources  or on paper) to evaluate these websites:

1. Website 1
2. Website 2
3. Website 3
4. Website 4
5. Website 5

Class Guidelines

Agenda: Thursday, 2/2/17

1st and 2nd Hour

• Project Entry Document and NTKs
• Use the Website Evaluation Form (in the Project Resources  or on paper) to evaluate these websites:
  1. Website 1
  2. Website 2
  3. Website 3
  4. Website 4
  5. Website 5

Class Guidelines

5th and 6th hour

• Project Entry Document and NTKs

Use the Website Evaluation Form (in the Project Resources  or on paper) to evaluate these websites:

1. Website 1
2. Website 2
3. Website 3
4. Website 4
5. Website 5

Class Guidelines

Agenda: Wednesday, 2/1/17

1st and 2nd Hour

• Earth Science Study Guide
• Entry Document/NTKs
• Create a Group Notes Document in Google Docs
• Write down in your own words everything you need to do to meet all the requirements
• List your Need to Knows based on your list
• Share your document with Ozias and Reason
• Create a class NTK list on this document

5th and 6th hour

Use the Website Evaluation Form in the Project Resources to evaluate these websites:

1. Website 1
2. Website 2
3. Website 3
4. Website 4
5. Website 5

Agenda: Tuesday, 1/31/17

1st and 2nd Hour

• Snow=late students
• Earth Science notes
• New groups and contracts

5th and 6th hour

• Earth Science Notes
• Entry Document/NTKs
• Topic Sign-up

Agenda: Monday, 1/30/17

Debrief Presentations

Mid-year reflection (see Classroom)

New groups and contracts

Mid-Term Exam: 5th and 6th hour

Answer Form

Mid-Term Exam

Answer Form

Agenda: Thursday, 1/12/17

Quiz (answer form)

Project work time:

• Look at your project board and  divide up research tasks
• Assignment: research logs (individual, due today; see Google Classroom)
• Assignment: group outline (due Friday)

Semester Exam Review Packet is available.