9 minute read

Introduction to Website Development

GRADES 9‐12

This is a project‐based course designed to teach students skills in web design. This includes planning, construction, deployment, and

maintenance of a webpage. Students will learn to use a variety of hardware and software to create, maintain, and update web

pages. This will include the use of computers, scanners, digital cameras, web authoring software, imaging and graphic design

software. Students will work in collaboration with one another to explore solutions to problems, share their skills, and discover new

and innovative approaches to unique challenges.

Credit: 0.5

INTRODUCTION TO WEBSITE DEVELOPMENT

GRADES 9‐12 UNIT 1: THE HISTORY OF THE INTERNET

Objectives

Students will explain the historical innovations in the evolution of communications systems and the internet. Students will identify, analyze and synthesize historical, social, economic, environmental, and government regulations impact on Communications technology from multiple authoritative sources. Students will gather relevant information from multiple authoritative print, digital resources, using advanced researches, to predict the social, economic and environmental impacts of existing and evolving communication technologies. Students will identify key factors that have impacted the evolution of the communications technologies. Students will identify legal implications of misuse of the Internet. Students will describe the school technology/computer use policy. Students will describe the function of a web browser. Students will explain how browsers find information on the internet.

Essential Questions

What is the history of the internet? What are the Copyright Responsibilities of Internet Use? Why was the Internet developed? What is, and how can you protect yourself from computer hacking and cyber‐crime?

Knowledge and Skills

The internet was developed to share information amongst its users. People use the internet at their own risk. There is copyrighted information on the internet, which cannot be used without permission of the copyright holder.

Instructional Strategies

Explore sample internet use policies. Discuss similarities and differences between various internet use forms.

Develop own internet use policy. Research history of the internet.

Evidence of Learning

Appropriate performance on student evaluation and/or classroom participation.

INTRODUCTION TO WEBSITE DEVELOPMENT

GRADES 9‐12 UNIT 2: WEB PAGE LAYOUT AND DESIGN (Dreamweaver from the Adobe CS6 suite)

Objectives

Students will use storyboarding to set up the flow of a website. Students will use the software tools to demonstrate an understanding of the software applications used. (e.g. Dreamweaver and online resources). Students will define and utilize communications technology systems domain specific words and phrases. Students will define and properly use common website and internet terminology. Students will read, interpret and utilize media communication equipment instruction manuals, troubleshooting guides, and specification requirements. Students will demonstrate an understanding of design elements and applications of design principles when developing projects. Students will organize web sites and effectively use text, images and links.

Essential Questions

What is the role of the web page designer? What are the basic elements and principles of design? What is a storyboard when used with web design?

Knowledge and Skills

Specialized software packages are used in creating and editing Web pages. Web pages are planned and evaluated so that they meet a particular need for a client. Web sites can be created, modified, and optimized by the web designer. Principles of design are used to plan projects and to incorporate solutions into subsequent projects.

Instructional Strategies

In this unit, students create the elements of web pages with Adobe Dreamweaver. They will build web sites that features required design principles for the work to be completed. As they create their web pages, students will plan, implement, and test their web site design. Students will evaluate their work for quality layout and design.

Evidence of Learning

Appropriate performance on student evaluation and/or classroom participation.

INTRODUCTION TO WEBSITE DEVELOPMENT

GRADES 9‐12 UNIT 3: IMAGE EDITING (FIREWORKS and/or PHOTOSHOP Program from Adobe CS6)

Objectives

Students will effectively use Fireworks and/or Photoshop program in the Adobe CS6 suite to edit images for use in a web page. Students will set up a web page and effectively use images and buttons for links. Students will apply proper formatting for importing and exporting image files. Students will use appropriate design elements of a web page. Students will test image attributes and adjust and edit as needed.

Essential Questions

What ways can an image be manipulated? What steps are involved in image modification? What processes are involved in image modification?

Knowledge and Skills

Images are used to enhance the material used in a web page. Designers use various software packages to modify images for webpages. The presentation of an electronic image can be just as important as its content.

Instructional Strategies

Complete an image manipulation by copying parts of an image. Use file formats for images: e.g., .gif, .jpg, and .png. Import images into the computer from the internet to a file. Planning and designing graphics for use in a web page. Apply design principles when creating images and logos. Brainstorming and create ideas for banners and pamphlets.

Evidence of Learning

Appropriate performance on student evaluation and/or classroom participation.

INTRODUCTION TO WEBSITE DEVELOPMENT

GRADES 9‐12 UNIT 4: ANIMATION IN WEB PAGES (FLASH Program from Adobe CS6)

Objectives

Students will build a Flash animation that uses tweening. Students will create a Flash animation for images. Students will work with images, text and thumbnails in Flash. Students will link Flash animations to web pages.

Essential Questions

What is Flash animation? How can you incorporate a Flash animation in a web design? How can you build a Flash animation?

Knowledge and Skills

Flash animation is used to animate information in a web page. Various design workers within a web design business are responsible for individual tasks such as Flash animation. Flash animation can be used by individuals and corporations as a way to display key ideas.

Instructional Strategies

Create basic tweening projects using Flash. Choose tweening projects to create a web site header. Create a Flash tween poster of your best idea and evaluate it. Consider combining Flash tween activities into one webpage. Re‐evaluate and consider ways to modify your design if necessary. Prepare to present your ideas to the class.

Evidence of Learning

Appropriate performance on student evaluation and/or classroom participation.

INTRODUCTION TO WEBSITE DEVELOPMENT

GRADES 9‐12 UNIT 5: BUILDING A WEB PAGE WITH A TABLE

Objectives

Students will define a layout table design for a web site project. Students will plan a table design for a project. Students will structure a table design web site. Students will design a table design web site. Students will build a table design web site. Students will test a table design web site.

Essential Questions

Why is a table design used to build a web page? What does the table design communicate between the web designer and the client? What part does storyboarding play in designing a table design website? How is testing the web site useful when designing a table design web site?

Knowledge and Skills

The table layout portrays: the style, and recurring information, as well as the type of information included in the website. The table layout is used to understand the designer’s intent for the website. There is a need to evaluate the strengths of the design in table design layout.

Instructional Strategies

Project Management Skills  Designing a table style website  Developing a project storyboard Design Skills  Creating designs that meet table design requirements  Making simple storyboards to convey ideas  Providing multiple design ideas  Use the design process  Creating various table design ideas  Finalizing design in the design process Technical Skills (Macromedia Dreamweaver)  Using table design  Creating links  Checking links

Evidence of Learning

Appropriate performance on student evaluation and/or classroom participation.

INTRODUCTION TO WEBSITE DEVELOPMENT

GRADES 9‐12 UNIT 6: WEB SITE FOR A CLIENT

Objectives

Students will create a table design for the site. Students will create the redesign components of the home page. Students will create the redesign components of the content page. Students will make a class presentation on using technical skills in Adobe cs6 Dreamweaver, Flash and Fireworks or Photoshop.

Essential Questions

What client background information is needed to build a client web page? Why is communication important between the web designer and the client? Why is there a need to storyboard a client web site? Why do client web sites need to be reviewed and revised during the design process? How is testing the web site beneficial to the designing process of a client web site? Why are libraries used when designing a web site?

Knowledge and Skills

The client’s needs dictate the topic of the site and specifies the content to be included on the site. The web designer interprets the client’s needs in designing the navigation, the look and the feel, and the content flow. The client determines which site design most closely meets their needs.

Instructional Strategies

Analyze the client’s site and identify three or four major design challenges. Write a design document. Present a design document to a client. Respond constructively to client feedback. Make necessary changes to a design document, based on client feedback.

Build a Web page layout based on a design document. Design a Dreamweaver document as a Dreamweaver template, using linked sheets.

Evidence of Learning

Appropriate performance on student evaluation and/or classroom participation.

Student Name:

Web Project:

Score

Development of Storyboard/plan

Follows storyboard and plan to produce project.

On Task; proper use of class time.

Timeliness; completes project on time.

Presentation/Grammar

INTRODUCTION TO WEBSITE DEVELOPMENT

GRADES 9‐12 WEB SITE DESIGN PROJECT RUBRIC

Date:

Due:

0‐5 pts.

Not completed or sloppily presented. Many parts missing, some sections not presentable. Some parts missing, could improve for presentation. Complete, neat, professional presentation.

Did not follow storyboard.

Followed some of storyboard, but dismisses other parts to produce required outcome. Most of the time, but had some problems with all directions. Always, follows precise directions, is able to solve project problems.

Wastes class time, constantly talking to others often, off task.

Not using time effectively, strays to unrelated topics. Usually on task but talks to others occasionally. Works full class periods.

Three or more days late. Two days late. One day late. Met original date and time.

Multiple grammatical and stylistic errors. Some errors in grammar and/or stylistic errors.

Few grammatical and/or stylistic errors Nearly error free and reflects a clear understanding of design principles.

6‐10 pts. 11‐15 pts. 16‐20 pts. Your Score

Total Score: Final Grade = Total Score

Final Grade:

INTRODUCTION TO WEBSITE DEVELOPMENT

GRADES 9‐12 RESOURCES

Macromedia Studio MX, Aho, Kirsti. 2004. Thompson Course Technology, Boston, MA. Dreamweaver Fireworks Flash

PACING GUIDE

Unit

Quarter 1 Quarter 2

Unit 1: The Internet Basics X Unit 2: Web Page Layout and Design (Dreamweaver) X Unit 3: Image Editing (Fireworks and/or Photoshop) X Unit 4: Animation in Web Pages (Flash) Unit 5: Building a Web Page with a Template Unit 6: Web Site for a Client X X X

This article is from: