TECH 1 Unit 1.6 Creating Web Pages Unit / TECH 2 UNIT
Creating web pages with Contribute
Program Date- August 22, 2008
Location- Pioneer Middle School
Program Objectives:
Teachers will learn how to use the basic functions of Contribute
Teachers will learn how to use basic skills to organize their website.
Teachers will understand basic concepts of web page design.
Teachers will learn how to find help online and tools to assist in the professional development.
Teachers will learn how to access the templates
Program outline and schedule:
8:00- 8:15 Get set up on a computer, Review the agenda and goals.
Log-in by Clicking on GUIDED STUDYin the user field and GS in the password field.
If you have a laptop, that is best to work on, so find a plug in and a place to sit (extra chairs are at the south end of room).
After you sign in, CHECK IN WITH BROCK TO MAKE SURE YOU HAVE A CONTRIBUTE KEY FOR YOU COMPUTER (Turn on your computer, click on Contribute, and have him take a look if you're not sure).
Introductions- What do you want to create?
8:15 - 8:30 Examples of quality websites...what do you want to change/create
Tiers of website design
Website design basics
Online and on-you-computer help....anytime!
8:30- 9:30 Activity #1- Going through the basics.... with a toolkit
In this activity, you are going to build a simple site, so we can review all the basic
commands that you use everyday.
The Site
We are going to build a 4+ page website today with:
a home page
an about me page
a photograph gallery
a links page of popular links for students in your classroom
1. Basic- This activity will cover the items below:
text
menus
control clicking
hyperlinks / anchors
tables and designing web pages with tables
pictures....simple editing tips
Creating PDFs and inserting them to a page
using Flashpaper to save Powerpoints- see example below
9:30 - 10:00
Types of pictures- Good articles on using pictures online
The two most popular image formats for the web are JPG and GIF. These formats represent very different approaches to the problem of delivering an image with minimum file size and download time.
Formats of picture files recommended for web pages:
.jpg= use this format for pictures; good quality; small file size;universal on the web
.gif= only contains 256 colors; small file size; common in animations and icons
Formats of picture files NOT recommended for web pages (if you want to use them, convert them in iPhoto, Photoshop Elements, or Appleworks Drawing) :
.tiff- larger file size, better quality; not huge, but compress before putting on web
.png- almost universal.....but don't offer transparency (most browsers see these)
raw= these are pictures straight out of a camera; HUGE file size; you must compress to fit on the web
.psd= Photoshop documents; huge file size; great quality; must compress for web
While GIF is great for computer generated images with limited palettes, JPG is far better for photographs. It gives better quality images for the same file size.
The bottom line is use jpg format for photographs and gif images for banners, clip art, etc.
Copyright issues......
Below are some great resources to use on the Internet. We must be careful with the images we choose and search for royalty-free or copyright-free pictures to put on our page. Just going to Google Image search will give you anything and everything.
Resources for web pages
Cool Text - Website that lets you create very nice text graphics, logos, and buttons.
how to get help- Contribute Help (USE THIS RESOURCE.....IT'S AWESOME!), Online help
10:00- 10:30 Activity #2- Create a banner and buttons (if time)
At cooltext.com, create 3 different banners for your website to go across the top of three potential pages
Create customized buttons for your page.
11:00 - 11:30
PDFs
To create a PDF from an Appleworks or Word file go to: Print (Yes, Print!) and then in the print window click on the PDF button in the lower left hand corner. A menu will pop up and choose Save as PDF.
In Contribute, choose the links button and then link to File on my Computer. This will create a new link to your PDF. Remember to Publish before you move the linked file, or else it won't go off to the web. Once your page is published you can throw away your PDF, because it was copied to the web.
Activity #3- Templates in Contribute
Extra templates..... click below:
K-12 templates- (click on the link to download templates, and then installer will put templates in Contribute starter pages for you)-
Elementary, Middle School, and High School templates to give your website a nice, uniform look.
Higher Education templates (click on the link to download templates, and then installer will put templates in Contribute starter pages for you)-
11:30- 12:30 Lunch
12:30-1:00 Finish templates / Activity #4 Working with Photo Albums in iPhoto