Web Design

 

Class Info

Course Description:

Web Design is a business course that provides instruction in the principles of web design using HTML/XHTML and current/emerging software programs. Areas of instruction include audience analysis, hierarchy layout and design techniques, software integration, and publishing. Instructional strategies should include peer teaching, collaborative instruction, project-based learning activities, and school and community projects.

In this course, you will learn step-by-step instructions and in-depth explanations of the features of the Macromedia Web Collection. You will first learn how to get started with Dreamweaver 8 and how to develop a Web page. Then, you will work with text and graphics, links and tables. Next, you will focus on Flash 8. You will first learn how to get started with Flash and how to draw objects. Then, you will learn how to work with symbols and interactivity, how to create animations, and how to create special effects. The last section of the course covers Fireworks 8. You will first learn how to get started with Fireworks. Then, you will learn how to work with objects and how to import, select, and modify graphics.

Text/Materials:

Text: Sherry Bishop, Jim Shuman, Barbara Waxer, The Web Collection: Macromedia Dreamweaver 8, Flash 8, Fireworks 8 Revealed, Deluxe Education Edition, Course Technology, 2006.

Software: Macromedia Dreamweaver 8, Flash 8, Fireworks 8, and Windows XP will be used. Another operating system may be used, but students may notice some differences in the appearance of certain dialog boxes.

Handouts: Additional handouts may be required and will be provided as needed.

Course Format:

Lecture/introduction of Topic

Create application together

Create applications independently

Written Test/quiz

Classroom Expectations:

Be Respectful
Be prepared to learn
Follow all school rules

Computer Lab Expectations:

  • Must have AUP on file
  • No food, water only but must be kept on the floor.
  • No data disks/CDs/DVDs allowed without teacher permission
  • No loading programs or files in your locker
  • Internet and e-mail use must be class related
  • No chats, games, etc.
  • No sharing files
    1st offense - failure of assignment
    2nd offense - failure for 6 weeks
  • Repeated violations of the Internet will result in loss of class participation points.

Evaluation:
In class assignments
daily assignments
participation

The majority of assignments are graded based upon the successful completion of assignments and following of directions. Each assignment will be worth different points depending upon the requirements. Grades are determined based upon the accuracy and proper formatting of documents

In Class work/Homework--60%
Homework is not accepted late

Written quizzes/exams--20%
Ojective written exams that consist of T/F, MC, Short Answer, and Essay questions will be given and will cover the content of the textbook. You must read because we may not discuss everything in class.

Participation--20%
Based upon attendance, behavior, work ethic, meeting deadlines, daily work grades.

Grading Scale:
6 Weeks grading scale
A+ 100
A 90-99
B 80-89
C 70-79
D 60-69
F 50-59
   

 

   
   

 

Links

HTML Tutorial  
   

 

Calendar

 

DATE ASSINGMENT/DAILY ACTIVITY HOMEWORK
Aug 15

Introductions

HTML introduction

Take a quiz

HTML online tutorial

 
Aug 17

Using the tutorial to create your own web page

How to view source code on any web page?

How to copy and past HTML code from one source into your textpad document?

Using the HTML tutorial as a guide, begin to create a personal web page. Content of web site is your choice.

I recommend that you learn a concept using the tutorial and then apply it to your own web page.

You must include all of the following concepts from the tutorial.

  • Formatting
  • Links
  • Tables
  • Lists
  • Images
  • Background
  • Colors
 
Aug 21 and 23 Continue exploring HTML tutorial and creating your own web page using HTML.  
Aug 27, 29, 31

One Laptop Per Child (CBS 60 minutes video)

Continue working on HTML web site

  • 3-4 pages in web site
  • Be sure to include the concepts listed above.

Additional resource(s):

Learn HTML

Learn HTML in 20 minutes

HTML tutorial

 
Sept 5, 7

Introduction to Dreamweaver

Taking your personal web site created using html and setting up a site in Dreamweaver.

 
Read 1st chapter in textbook  
Sept 11, 13

Introduction to Chapter 1

  • Complete Striped Umbrella Lessons together in class
  • Complete Skills Review (Blooms & Bulbs) - individually - Print Site Map
  • Complete Project Builder 1 and 2. Trip Smart and Emma's Book bag. Print screen shot of site map for both

Review for Test over chapter 1

 

 
Sept 17

Take test over chapter 1

We will be creating a web site together for a small photography business. You will begin by locating other photography web sites that appeal to the eye. You are looking at layout, appearance, content, usability, navigation, etc.

  • Locate and add to your favorites a list of web sites you have located.
  • Write a list of questions you have about creating the web sites.
  • Be prepared to share the web sites you have found and identify what you like about the web sites.

 

 
Sept 19 ISTEP  
Sept 21

Review Test over chapter one.

Begin/lecture Chapter 2

  • Print code after steps on pages 2-6 to 2-8
  • Print index page from Internet Explore after steps on page 2-12 to 2-13.
 
Sept 25

Continue lecture/steps for Chapter 2

  • Begin on page 2-14
  • Print the SPA page in Internet Explorer after completing steps on page 2-17
  • Complete lesson 3 (page 2-18) and print the site map after steps on page 2-23.

Individual Assignments

  • Complete Skills Review page 2-34
  • Complete Project Builder 1 page 2-36
  • Complete Project Builder 2 page 2-37
 
Sept 27 Continue Skills Review and Project Builders for Chapter 2. Must be completed today.  
 
2nd 6 weeks
 
Oct 1 Continue Skills Review and Project Builders for Chapter 2. Must be completed today.  
Oct 3

Finish Skills Review and Project Builders for Chapter 2 - 30 minutes

Grade and check for completion and accuracy

see rubric

Begin Lesson 3 Lecture/discussion

 

Read Chapter 2 - We will be having a test in the near future. Any notes you take can be used on the test.
Oct 5

Review requirements for skills review and Proj Builders for Chapter 2.

Begin Lesson 3 - Lecture/discussion

TEST Chapter 2 on Tuesday

Any notes you take can be used on the test.

Oct 9

Test over chapter 2 today

Willis Photography web site. Share what I have created. Get in groups. Assign roles.

  • Researcher
  • Designer
  • Writer
Willis Photography - storyboard assignment. Continue to research websites and get ideas on layout/design. Come to class on Thursday with a completed storyboard of your theme.
Oct 11 Work in groups with Photography web site  
Oct 15

Begin Dreamweaver lesson 3-Complete pages 3-4 to 3-18

Oct 17

Continue Lesson 3-Begin lecture on page 3-19 - 3-37

Complete Skills Review on page 3-38 to 3-29

Oct 22

Complete Chapter 3 Skills Review (page 3-38 to 3-29)

Complete Chapter 3 Project Builder 1 and 2 (page 3-40 and 3-41)

All must be complete by end of period today

Read and take notes chapter 3
Oct 24

Chapter 4 - lecture/demo (Striped Umbrella) complete steps together.

 

Read and take notes chapter 4
Oct 26

Complete Steps for Striped Umbrella for Chapter 4

Complete Chapter 4 Skills Review individually (page 4-32 to 4-34)

Complete Chapter 4 Project Builders 1 and 2

Read and take notes chapter 4
OCT 30

Sub today.

We are going to take a break from the photography websites and learn a little about Flash. You will find this program helpful when creating the photography web site.

You will be reading and completing the exercises for the Flash Chapter 1. You will be expected to complete Chapter 1, Lessons 1-6. You are basically going to read and do the steps and save all work. Expect a quiz next class period. Work hard and help each other out.

Lesson 1-Understanding the Flash envioronment.

  • Read Pages 1-2 to 1-6 and skim the diagrams that identify the parts of the Flash enviornment.
  • TERMS to know: Stage, timeline, frame, panels
  • FIGURE 1: page 1-6, be sure to review.
  • Complete Steps on page 1-7 to 1-9

Lesson 2-Open and Play a Movie

  • Read and complete the steps for Flash Lesson 2,
  • pages 1-10 to1-13

Lesson 3-Create and Save a Movie

  • Read and complete the steps for Flash Lesson 3.
  • pages 1-14 to 1-17

Lesson 4-Work with the timeline

  • Read and complete the steps for Flash Lesson 4
  • pages 1-18 to 1-23

Lesson 5-Plan a Web Site - Read
Lesson 6-Distribute a Flash Movie
- Read and do

Complete Skills Review page 1-32

NOV 1

FLASH AND FIREWORKS LECTURE/DISCUSSION

How can your group apply what you know about Flash and Fireworks to the photography website?

 

Nov 5

Flash - Review and complete Skills Demo from Flash Chapter 1 (Page 1-32)

Locate 2 internet resources that will provide instructions on completing a photo gallery in Flash

Nov 8

Discuss and share within your group the information you found about creating a photo gallery in Flash. You will provide the rest of the class a brief summary of your findings. Question: Do you have enough information to create the photo gallery in Flash?

Complete Flash Chapter 2 together.

 

 
3RD 6 WEEKS
 
Nov 12 Continue and complete Flash Chapter 2 steps together.  
Nov 14

Finish Flash Chapter 2 steps

LearnFlash Video - How to

 
Nov 16 Complete Lesson 2 and begin lesson 3. Complete through Chapter 3 Lesson 1.  
Nov 20

Sub Today-The only program you will be using today is FLASH. You are not to be playing games, etc. Please work hard so we can move forward.

Individually complete all the steps for Chapter 3 - You must complete everything assigned for Chapter 3 today in class. SAVE ALL OF YOUR WORK.

  • Lesson 2 (pages 3-10 to 3-15)
  • Lesson 3 (pages 3-16 to 3-21)
  • Lesson 4 (pages 3-22 to 3-27)
  • Complete Chapter 3 Skills Review (3-28 to 3-29)

Begin Chapter 4 (Creating Animations). You need to get as far as possible in this chapter.

  • Lesson 1
  • Lesson 2
  • Lesson 3
  • Lesson 4
  • Lesson 5
 
Nov 27

Video - creating photo gallery

Link to Video

 

 
Nov 29

How to import Flash file in Dreamweaver.

Get in your groups and each of you will create a photo gallery using images from WillisPhoto folder in shortcut to data files.

\WillisPhoto\photos\

One person from each group will create gallery for "portraits", "sports", "weddings". You may want to discuss layout and theme together as a group so when galleries are used in web site they will be similar in appearance and design.

 

 

 

 

 

 

Grades

4th
5th
6th
Semester One
Semester Two