TitleIII Technology Literacy Challenge Grant

Learning Unit

LU Title: Web page Construction - 3 Easy Ways

Author(s): Tresa I. Wilson

Grade Level: Commencement & Intermediate

School : Madrid-Waddington Central School

Topic/Subject Area: Computer Technology

Address: PO box 67 Madrid, NY 13660

Email: twilson@mum.neric.org

Phone/Fax: 315.322.5746

OVERVIEW

Students will learn to make web pages easily by using Microsoft FrontPage, HTML with Microsoft Notepad, and using a web-based template found on the Internet. This learning Unit can be used in part, or as a whole. Teachers may wish to take 6 or more weeks to complete the entire unit. The final product is a useable web site for a non-profit organization or a business with which the student is familiar (perhaps an employer.)

 

CONTENT KNOWLEDGE

Declarative: Student will know

Procedural: Student will be able to

How the Internet is used by society

What makes a person a regular user of a web site

Critically evaluate the uses of internet media

How HTML (hypertext markup language) is used

 Use HTML code to produce a web page for a specific purpose

How Microsoft FrontPage is used to create a web page

 Design a web page using Web Page design software

Where free web page host sites can be found which have associated web-site design templates

 Conduct a web search for free web page host sites which have associated web-site design templates and learn how to use the templates

ESSENTIAL QUESTIONS

How is the Internet used? 

Why create a web site?

What makes a web site interesting?

What are the reasons why people visit web sites one time vs. repetitive visits?

How can a web site be created?

 

CONNECTIONS TO NYS LEARNING STANDARDS
List Standard # and Key Idea #: Write out related Performance Indicator(s) or Benchmark(s)

 MST 5 - Technology: Main idea 3: Students will use computers as tools for design, information processing, and communication.

 

INITIATING ACTIVITY

 Students surf the Internet and share their "favorite" web sites by using a structured work sheet (see Appendex A for a suggested format.) Each student will find and record a web site within the specified categories (news, research etc) and explain why they think it is a "good" site. Students will then exchange papers and research the recommended sites from their peers.

 

LEARNING EXPERIENCES

  1. Students will search the web to explore web page design elements: They will examine both good (Lycos Design contest winner) and bad web pages to identify important design elements. (compare and contrast)
  2. Students will learn HTML (Hypertext Mark-up Language) through use of a web-based tutorial. www.tucows.com is an excellent guide. (Try using a LCD overhead projector to show the tutorial.) Students should actually use Microsoft Notepad to actually do the lessons described in the tutorial. Depending on the level of the class, and the time element, students can progress from the Basic level through Advanced and even go to Artists Tips and Tricks. (error analysis)
  3. Students will create paper and pencil, thumbnail sketched, plans of the personal hobby web site they wish to create and the associated links students wishes to include. A flow chart may be used. (error analysis & inductive reasoning)
  4. Students will use web page design software, such as FrontPage, to create a personal/hobby web page. FrontPage can be intuitively discovered with help from the students' new knowledge of HTML, the Help Menu, and previous experiences with Microsoft Word. A couple of tutorial web sites should be visited first as a class. Two good sites are www.webmonkey.com and www.tripod.com. There are several spots where FrontPage may be downloaded for free for 30 days or more. Additionally, some of these sites will host your new site for free if you just plan to regularly update it. (error analysis & inductive reasoning)
  5. Students will do a web search to locate several free web page host sites for web pages designed with FrontPage and HTML. There are different user requirements for different hosts. (inductive)
  6. Students will now use a web site, which features a web page design template, to create a personal/hobby web page. www.homestead.com and www.homepage.com are two easy to use sites. (error analysis & inductive reasoning)
  7. Students will have designated presentation days to "show-off" their web personal/hobby web sites created with FrontPage and/or web page design template from the web. Students may offer a critique of other's work. (error analysis)

 

CULMINATING PERFORMANCE

Student will create three similar web sites, all containing the same subject matter, using the three web site development methods taught (HTML using Microsoft Notepad, FrontPage, and web-based template.) The web sites are created for non-profit organizations or business with which the students are familiar (perhaps an employer, boy/girl scouts, school-related group, etc.) The rubric below can be used to grade all three web sites from each student/team, or, to grade the best of the three sites, as chosen by the student/team. The amount of time available will determine if one chooses to develop and evaluate three sites, or, just one. (Teachers may want to further develop this exercise by having students word process a letter to the business represented in the web page and offer it to them for public use, and their services to modify the web site as desired. Some students may wish to contact their clients and work with them during the development process, thereby acting more as a real Web Page Design Consultant/Developer.)

 

STUDENT NAME ______________________________ WEB PAGE Type____________________

(HTML/ FrontPage/ Web Template)

 

Web Page Rubric

10

15

17

19

 

 

Text Layout

 

The pages are unattractive. Text is difficult to read.

 

The pages appear "busy" or "boring". Text may be difficult to read.

The pages are eye-catching and attractive. Text is easy to read.

The pages are well organized. Text spacing and alignment make reading easy.

 

 

Design and overall Visual Appeal

No visual elements. No variation in layout. OR Color is garish and variations are overused.

A few visual elements. A little variation in layout. OR Color is somewhat distracting and variations are overused.

Some appealing stylizing elements which relate to content. Some variation in type, size and color of layout. Good use of "white space"

Appealing elements. Sound Included (BONUS if an on/off button) Multimedia elements lend information and do not distract

 

 

Graphics

 

 

 

There are no photos, icons or clip art or they are inappropriate or of low quality.

 

Photos are blurry or fuzzy; icons and clip art do not "fit" with the topic. Too many pictures make the download time slow.

Photos, icons, and clip art are appropriate, of high quality, and download fairly quickly.

Photos, icons, and clip art are used creatively and may follow a theme.

(BONUS for animation)

 

 

Information

And Grammar

 

 

 

 

 

Information is poorly wiritten inaccurate, or incomplete. Web site is poorly organized. No counter. Errors in spelling, grammar, and punctuation repeatedly distract.

Information could be better written and too much information is given in each section. Counter is hard to find. Some grammar and punctuation errors present.

Information is well written and interesting to read and is presented in short sections. A clear organizational pattern is apparent.

Visually pleasing visitor counter. 3 or less grammar or spelling errors.

Information is creatively written and cleverly presented. Crisp organization and logic flow of information. Text is totally free of spelling and grammar errors.

 

 

Navigation/ Links

3 internal

3 external

 

 

The user may become lost or links may be missing or not working. Background color interferes with button use.

The user may become confused when navigating between pages. Some links may not work. Links do not seem to be related to web site. Background color sometimes interferes with button use.

Links are clear, logical, consistent and easy to find so that the user can easily navigate back and forth through pages. Background color doesn’t interfere with button use.

Meaningful links are created with images and icons (buttons) to enhance the text links. Background color visually enhances button use.

 

 

 

PRE-REQUISITE SKILLS

 Participants should be familiar with scanners and digital cameras if they are available for use. Students should be able to conduct an Internet search, be able to use Microsoft Windows and multi-task, and use Microsoft Paint to manipulate graphics. Previous experience with Microsoft Office use useful as it is very similar to FrontPage.

 

MODIFICATIONS

 Modifications could be made upon evaluation of individual needs. This unit could easily be used with younger children. The time requirement can be modified if only parts of the unit are utilized.

 

UNIT SCHEDULE/TIME PLAN

 Forty-minute time blocks are a bare minimum, with longer class periods an asset. Each of the 3 methods of site building take at least 5 days of teaching and 5 - 10 days of individual time if the culminating project is used. Many students will devote free school time as well as work at home computers to complete their projects. .

 

TECHNOLOGY USE

Internet connection is essential. Students could work in teams, if necessary, due to equipment limitations. Microsoft Paint, Notepad and FrontPage software is utilized, and bundled with the Microsoft Office Suite. The teacher should be able to construct a web site using web-based templates, HTML, and FrontPage, after performing the suggested activities in this unit. Knowledge and use of a scanner and digital camera is useful, not necessary. A LCD overhead projector makes teaching much easier.

 

 

APPENDIX A

 

Please list the URL for the favorite site and a 1-paragraph description. It must be the "best" site of this area of interest in your opinion. Please check out the experts' ideas on good web sites first by going to http://www.webreference.com/greatsite.html.

HOBBY SITE

URL

 

 

TV SITE

URL

 

 

MUSIC GROUP SITE

URL

 

 

RADIO STATION SITE

URL

 

 

WORLD NEWS SITE

URL

 

 

WEATHER SITE (Track snowstorms, early release from school.)

URL

 

 

HOMEWORK HELP SITE

URL

 

 

HEALTH RELATED SITE (Ex. Physical fitness)

URL