HTML and Fireworks Exam

Here is your marking period exam.  This is worth 20% of your grade and is due by the end of class.

Please prepare an HTML website using notepad about the October Snowfall.  I am looking to see that you can use your new Fireworks talents to enhance your website.  The site should include:


1. Create a website using HTML that demonstrates the following:

• That you can use proper HTML codes.  
• You can create links that work, are effective, and efficient.
• You demonstrate attention to those with vision issues by including alt text for all images.
• A modern, usable design.

2. You must include a table or other device that shows how this snowfall ranks all-time. Cite where you obtain your data.
3. You must include an image or animation that has been manipulated using Fireworks. This image must be obtained using Creative Commons (Flickr,wikicommons, etc...). You may create the image yourself if you choose.  Save the link, you'll need it later.
4. A summary paragraph.  You must include at least one link to valuable information about the storm.
5. Your audience is 5th graders in Seymour.
6. Your website must be free of bias and be highly usable.


How to save your project:
1. Rename your folder in the WDrive. Name it first initial-last name-test (bschneidertest).
2. Copy folder.
3. Find class folder in UDrive. (Udrive-WebSchneider-Class-TEST)
4. Paste folder into UDrive.
5. HAVE NEIGHBOUR TEST WORK TO MAKE SURE EVERYTHING WORKS!! Format the links correctly!
6. Saving correctly is one of our standards.  I will not grade your test if I can't find it!


Blog Post:
1. Where did you get the image?  Include link.  If you created it yourself then please state that.
2. What aspects of coding or image manipulation have you gotten better at?
3. How did you manipulate your image in Fireworks?
4. What do you need to improve on?


Website 80%, Blog Reflection 20%


Rubric


You have two things due.  This exam due today, Veterans Day assignment due Thursday.

Veterans Day

The armistice treaty ending the "Great War" was signed on November 11, 1918. It is said that throughout the world nobody had seen so much rejoicing. The world had just experienced unimaginable turmoil, suffering, and pain.

The following year Armistice Day was established on November 11. President Woodrow Wilson said:

To us in America, the reflections of Armistice Day will be filled with solemn pride in the heroism of those who died in the country's service and with gratitude for the victory, both because of the thing from which it has freed us and because of the opportunity it has given America to show her sympathy with peace and justice in the councils of the nation.

It was a tradition for many years that at 11am on Armistice Day that all traffic would stop, conversations cease, and all focus be made on remembering those who had sacrificed.

In 1953, in Kansas, a town observed "Veterans Day". They felt this paid tribute to the veterans who had served in World War II and the Korean War. While there was much optimism in the country at the time there was also an incredible need to remember those who had served and sacrificed. Vast amounts of men had not come home from these wars.

Congress thought this was a great idea and in 1954 made Veterans Day a national holiday.

Many of you have friends, brothers, sister, fathers, or mothers who have served. If you have a story about them you want to tell please do so today.

Here is the Fireworks contest. All classes are eligible for this contest. Winner will be posted on this blog on November 11. Examples from our contests are seen here.

Your assignment is to make a poster about Veterans Day.

Be sure you understand the purpose of Veterans Day before tackling this assignment.

Your assignment is to design an image that could be posted in schools. You will use Fireworks and choose the appropriate tool or tools for your image.

Assignment parameters:

1. You set up the image size when you create a new document: Height=300 pixels, Width =600 pixels.

2. Your images MUST be non-copyrighted. I will publish this!!

3. You must be able to defend your choice of a tool in your blog post.

4. You must include "Veterans Day" somewhere in your image. You might decide to include additional text (date, slogan, etc..).

5. You must finish by the end of the period on Monday November 7.

6. Save in Udrive class folder when done (bschneider) as a .jpg file. All students will save in the same folder so be sure you name it correctly in the WDrive BEFORE you copy it to the UDrive. Be sure to test your work in the UDrive.

7. Hint: Interpolation allows you to blend images. Tutorial 1 Tutorial 2

Good luck!  Before you start PRACTICE YOUR SKILLS!

Fireworks:

1. List of tutorials (choose one or all)

2. Another list (choose one or all)

3. More tutorials (have fun!)

ShowMe

We tried the ShowMe app in music theory yesterday.  These were done quickly.  Its a pretty cool app.  Play around with it.

Wednesday

If you are in E block do todays lesson.

If you are in H block scroll down to the previous lesson.

Today....

Choose one subject to write about.  Include links!!
1. Read this article about halloween.   Are some costumes choices inappropriate?  Why or why not?
2. What are we doing to our kids?  Do parents and kids have too much screen time?

Choose something to experiment with:
1. Check out the ShowMe app.  Play around with it.
2.  Try to create a song with the Voice Jam app.
3. Have fun making a Puppet Movie with PuppetPals.

Other ideas:
1. Start a iPad Hockey tournament.  Make a website to keep score.
2. Try to draw something on the iPad and then on MS Paint.  Compare the two software programs.
3. Write about any picture in the Guardian Eyewitness App. You can google it to embed picture in a blog post.

Write about what you did today on your blog.  Have fun!







more to come....

Fireworks Practice

Fireworks tasks:

• Take this picture of Molly.  Change her outfit so its the same color as the girl in front of her.
• Change the H to an S.
• Change STOP to GO.  Make it green.
• Use a text tool to make your name super cool.
• Put President Obama in a crowd at a Yankee Game.

Some of those are hard.  Save all to your fireworks folder.


Next I want you to tackle this puzzle.  Why are there three water fountains in the upstairs hallway next to the guidance office?


 


I would like you to write a blog post:

• Embed the picture in the blog post.  If you go to the image and click share and then "Grab the HTML code".  Copy the code into a blog post.
• Give me a good story or theory.  Creative writing is fine.  I have NO IDEA why we have three water fountains.
• Be sure to include any links that are needed.

Claudia's Post
Samantha's Post

Fireworks Assignment

Before you begin please write a blog post about any of the following items.  Be sure to include links!  What do you think?

• 1/2 portrait.  Cool.
• TV.  Is it helpful?
• 100 Year Old Marathoner
• Photo Grenade

Today we will continue the Fireworks Tutorials.  This is sandbox time.  Please complete the following 8 tutorials and have the completed products in your Fireworks folder.  Now, some of these might not work perfectly as the software has changed.  If somethings not working, please substitute another tutorial.  Take your time and FOLLOW THE DIRECTIONS.

• Blur and Overlay
• Change Image color
• Patterned Text
• Photo Frames
• Crayon Effect
• Pencil Drawing Effect
• Feather Effect
• Fading Effect

Be sure to choose the right photograph for each tutorial.  Some photographs aren't appropriate (too dark, not enough contrast, etc...).  Be sure to save and name everything correctly.

My goal is that by the end of class today you can identify the basic functions of Fireworks and apply those functions to an image.  

Fireworks

Today all classes will work on Fireworks tutorials.  Whether this is new or review I would like all to do the same work to start.  You should move straight down the "image effects" category.  Then move to the other categories.  This is sandbox time today and Thursday.  Create a fireworks folder to save all of your work.  Every thing you do should be named, saved, and put in a folder.


If you are turning in something late I will give you half credit today.  The 4 page website was due at the last class.  The blog post about the Red Dot was due for homework.


If you are feeling behind--study!  I do not assign specific homework.  I expect you will be working on any issues that you have.  If you need to practice coding, then practice!

Where in the world is that red dot?

This week we only have one web design period.  Some of you will read this on Wednesday, some on Friday.

All students should complete two assignments today.  Everyone must finish the 4 page website during class.  Then students will complete the blog post.  If you do not finish the blog post it must be finished for homework.  Remember, you can post to your blog from any computer or phone.

HTML:

1. Please check that you have completed all requirements of the assignment.
2. When done RENAME your folder.  Rename with your first initial, last name and the assignment (bschneider4page).
3. COPY the folder to the UDrive-Webschneider.  Find your folder for your class.  Find the 4 page folder.  PASTE your folder into the 4 page folder.  Have a partner check that all the links work (trust me--check this).

Blog Post:

See that red dot in the middle of nowhere?  Where is that?  What do they do there?  What language do they speak, etc...?  Write a blog post and tell me about them.  Include links.

Extras: if you have extra time here are some prompts for blog posts.  Choose one (or all) and write a post.  Be sure to link to the source.

1. Why do we conform? Check out this Candid Camera video.
2. How cool is this cathedral?
3. Who is your favorite group on The Sing-Off?

Clustrmaps

You will now learn how to put a clustrmap on your blog. Communication and Collaboration is our 2nd curriculum standard. We use the clustrmap to collect data about how well our message gets out.

• Go to the Get One page.
• Complete the form. Be sure to use the correct address for your blog. If you do not have an email to submit this will not work.  See me.
• The password will come to your email.
• Submit password on clustrmap page. They will then give you a long HTML embed code that you copy.
• Go to your blog, log-in and open the control panel. Paste the long code in the About Me section.
• Submit new code. Wait for me to approve it.

You can also check out meez if you want to add an avatar to your site (which seems to be blocked at school right now...). You could also try voki.com. What image do you want to portray to the world?  You would add a voki or meez the same way.


Today's HTML assignment is to create a four page website.

Student Blogging

Over the next few days all students will be getting their blogmeisters started. We will talk a lot about building an audience, blogging ethics, and 3d writing as we move forward.  But I just want you to get started today.

A few notes:
1. Do your typing in MS Word or notepad. Check spelling before you send.
2. Click request publishing.
3. When leaving comments leave first initial and last name (Bschneider) and your web address so people can respond.
4. The blog will not post until I accept it.  Don't keep clicking.
5. You can access your blog from anywhere.  But so can anyone else.  Everything that you write will be there forever.
6. I am sure there a ton of things I will remember, I haven't activated these blogs in while.
7. Please don't use first and last names.  Always use first name and last initial.
8. Always use links.  If you talk about somebody's blog, then link to it!
9. The blog accepts HTML code.


Spend a little time exploring the controls on the blog.  This is a VERY simple layout.  

All classes will take the typing test .

• Put your score in your blog (be honest!) and see if it improves later.
• Don't say "I took a typing test". Say "I took a typing test". Demonstrate that you know how to code a link.

Typing fast and accurately can make you much more efficient. I type fast, but improperly (I don't really use my outer fingers), so I lose accuracy and I know its not good for my hands and wrists.

When you finish please leave a comment on someones blog

• Leave a comment with your first name and last initial in the name box.  Copy YOUR blogmeister web address for the URL box.  Do this with me if you aren't sure.

Any extra time, work on your HTML or finish yesterdays reading assignments.

HTML: American Flag Assignment

With the HTML practice I am trying to do the following:

• Get you accustomed to naming files, saving them, and opening the pages.
• Understanding basic structure of code.
• Switching from one teacher (me) to many teachers (you).
• Have you acknowledge what a good website, good writing, and good design looks like.  

So.....

• I will guide you, model some items, but I will try not to give you the answers.  This is a coding class, which is problem solving.  You need to learn how to solve the problems.
• I will begin to insist on your best work.  Some of you will struggle and I will say "try again".  Don't get frustrated, I do that because I know you can do better.
• At just about anytime I will allow you to work on your own projects.  Some examples of student led projects include this music video or maybe creating an advocacy campaign to change the world.  Seriously, this is your chance to really think about what you want to do.

We will make our first webSITE today. Until now we have made webPAGES. Today please do the following:

• Create a folder in your WDrive-Web Design. Label it "Flag".
• Download a clip-art or Creative Commons image of an American Flag. Save in flag folder
• Create a two-page website.
• Title Page 1: "American Flag". Add heading, background color, and flag image.
• Center image.
• Title Page 2: "American Flag History". Add heading. Add short description of Flag history with two links to further information.
• Link pages together: Make image on Page 1 the link to Page 2. On Page 2 include a "home" link back to page 1.
• Does your font choice matter?  Read this.
• Save both pages. Test links.

When done:

• A Google A Day
• Put in your headphones and play with Bobby or Incredibox
• Read this longer, but fascinating, story in the NY Times about a student with autism.
• Watch this movie trailer.  Yes, that is tap water catching on fire at the end.  

Nobody finishes early.  There is always something to work on.

Thursday Lesson

I am at UConn today.  I am presenting a class to future teachers about technology in the classroom.  iPads will be the focus of the discussion.  Your Evernote podcasts will probably be played.

Do the work while I am gone.  I firmly believe that there is not one teacher in the room, but twenty.  We all teach each other.  When a class can let go of the idea that the teacher must tell them everything the class will start to fly.  I want YOU to create the ideas in this class.

Today:

1. Try the Google A Day.  Can you get the answer?

2. Organize your W Drive.  Put assignments into folders.  Make it neat.  Everytime you get a new assignment it should go in a folder.

3. Create a HTML page.  Title it "HTML Lesson".

• Create a one page website that demonstrates how to:
• Open a file and create HTML (open notepad, how to view source, etc...).
• How the "first 8 tags" work.  Body, head, etc...
• How to create a link.
• Use proper colors.  Does it need a table? Image?
• Save in WDrive.  HTMLTutorial.html

4. If you finish please show the substitute.

First HTML Quiz

Start today with a Google A Day.  The site times you.  So move fast.  We will be learning how to search effectively throughout the year.

Then Draw a Stickman.  Wouldn't you like to learn how to do that?  Guess what?  You will.

The quiz for web 1 will be due by the end of the period on Tuesday. Some of you will finish early, some of you will have to work fast...

You will create a one page website about your current class schedule. This website should include:

• A title in the header code.
• A clear heading on the page.
• A list of classes.
• A brief paragraph describing yourself (junior at Seymour High School, etc...)
• Background color other than white.  Keep the color light (no bright red, black, etc...if you disagree go back and look at the bad websites)

If you do the above correctly the maximum you can score is 3/4.  You must do at least one of the extras to be able to score 4/4.

Extras:

1. Can you include an image that you created?  Remember that the image must be in the same folder as the webpage.

2. Can you place the schedule in a table?

3. Can you create a link to Seymour High School?

Be sure you code the first 8 code tags correctly.  Be sure you open and close your tags in the correct order. 

Save the file to your WDrive-Web Design when done.

Web Design: Introductory Quiz

Today's quiz is a letter.

In this letter you must:

1. Include links and examples where necessary.
2. Provide evidence.
3. Be persuasive, yet friendly and helpful.
4. Your letter should be between 100-150 words.

Please evaluate the design bias, usability, and accessibility of the Seymour High School website. This letter should show evidence that you paid attention for the past few lessons.

Start your letter with "Dear Mrs. Goodrich".  


Save to your W Drive Web folder.  Print out for teacher.

Usability

Today we will finish our introductory unit (test to come shortly).

Usability involves design and it involves hardware. First I must have enough bandwidth to get my information to the user. Bandwidth is the "size of the pipe" that carries information. The larger the pipe, the more information I can send. Second I need to think about the hardware at the end of the line. Is my user viewing the information on a phone or through a dial-up connection? Is my user using high spped DSL?

Here is what bad design looks like according to Vincent Flanders: Check out the worst website ever and his checklist for how to ruin your website.

Top ways to ruin a website:
1. We've designed our site to meet our organization's needs (more sales/ contributions) rather than meeting the needs of our visitors.
2. It takes longer than four seconds for a man from Mars to understand what your site is about. Example.
3. Our site looks like we've never seen another web site. Example.
4. We use design elements that get in the way of our visitors.
5. Our site doesn't make us look like credible professionals.

1. Read the following article. Save it in your favorites. Web Usability Guidelines.  The chart at the bottom is awesome.

2. Skim this basic article about usability from Great Britian.

3. What's wrong with Google?  Wouldn't you like to learn how to do that? (this may be blocked...working on it...)

Start a MS Word document. Please answer the following questions:

1. Define the following. Provide definitions that make sense to your readers.

• bandwidth
• web usability

2. Which of the following websites has a higher usability for teenagers. Why??

Newsmap 
Connecticut Post

3. Find a website that you think has a high usability rating. Provide a link to this website and explain why you think its usability rating is high. Possible examples: Bobby (use headphones),  Baby Names (blocked??) Tall Buildings.

All three assignments (bias, accessibility, usability), the evernote biography recording, plus the two HTML webpages are due Friday 9/23.  Work hard today and produce your best work.

Accessibility

Everyone fills out an info sheet today.  We will start the HTML Tutorials today.  I will start with a bit of a group lesson and then I will see what you can do.  Most of the class time will be reading time today.

There are four main categories we are covering in this unit; bias, accessibility, usability, and ethics. Today we will focus on accessibility.

Read this article. Introduction to Web Accessibility. The website contains lots of useful information. Take your time reading it.

We will watch this CBS News Video together in class.

Read some of how Apple focusses on accessibility.

Create an MS Word document. Answer the following questions:

• Of the four major categories of disabilities (visual, motor, cognitive, hearing) which one do you think would pose the greatest challenges for a computer user. Why? Include specifics.
• Dealing with a disability can be frustrating. What are three ways a web designer can design a less frustrating website for those who have a disability?
• Try getting to the CNN website without using your mouse. How did that change the experience? Did you get frustrated?
• What is our obligation to serve those with disabilities?

Save the file in your web design folder.  Print out for teacher.

When done here is your first HTML assignment.

Bias, Usability, Accessibility, and Ethics

There are four main criteria that we use to assess the validity of a website; bias, usability, accessibility, and ethics. Today we will focus on bias.

This is also an exercise in communication skills and page design. Can you get your point across effectively? Do you know your audience?

1. Class Discussion about bias

• Barbie Doll website
• GI Joe website (collector site, real site blocked...)
• GIJoe Movie
• Legally Blonde: The Musical

2. Read the following articles:
Gender Bias
Journalism Bias this is a longer article. Skim the whole thing (except the studies and theories of media bias section). Click on links that interest you.

3. Create a one page flyer in MSPaint that contains bias.

Girls: Boys are silly. Why can't they act right so I can get my work done? They should treat us with respect and not be so clueless.
Boys: Girls are silly. Why can't they act right so I can get my work done? They should treat us with respect and not be so clueless.

Think about your audience. Who are you writing it for? I am looking for two things. First, do you have good ideas and understand bias? Second, can you format the page well so you communicate these ideas? This is your first task in design.

This flyer must include the following:

• A clip art or free-non-copyrighted image. Using copyrighted images is illegal. You could make your own image if you want using Paint or Fireworks. Check the links on the right for clip-art images or go here or toFlickr and use creative commons search.
• At least three quotes (from real or imaginary people)
• Have fun with this, stay respectful and appropriate.

4. Save in WDrive (Web Design folder). Check the Rubric for the assessment.

5. If you finish early you should start on the HTML Tutorials (link on right side of page).

Tell A Story

Today students will tell a story.  For many this will be exceedingly difficult.  Not because they can't write, or record, but because they have to interview their peers.

This entire class is about telling a story.  Telling a story through words, images, animation, links.  A bad web page story will be immediately discarded!  Nobody stays on a bad webpage or keeps listening to a poor recording.

Each student will write and record a 60 second biography for radio broadcast.  This biography will be of a classmate.  Students will record using Evernote.

We will post the biographies here.  Once the internet is up students will post to their individual blogs.

I am sure I will adapt this lesson after the first class.


Here are some posts that were created today:

• Danielle
• Tyler

A New Year

So...

Back in Web Class.  I am very excited to teach this "new" class.  I taught this for four years, took a two year break, and now I am back teaching two sections.  So much has changed!

This class should be fun and exciting.  You will write and read A LOT in here.  You will code, create, tape, video, and publish.  This will be an odd class for some of you as YOU take charge of your learning. You will have lots of choices as the year progresses.  This often makes students nervous as I rarely stand in front of you and say "now we will turn to.."

Today I ask you to have fun with the iPads in the group exploration activity.  If you finish, later you can do the solo activity.

Two things need to happen today:
1. You need to return your Internet Use form.  You got it in homeroom yesterday.  I can't do anything without that.
2. Fill out this Info Sheet using your iPad.

I may adapt this activity (filter....) and do some wifi mapping and area of triangle stuff.  Stay tuned.  I have this at 7:30am and will adapt again for 2nd time through at 12:30.

Digital Safety: Would you leave your front door open?

Very interesting discussion starter. We will definitely use this in class.

Responsible, fair use, at all times.