Chapter 10

waisttherapeuticΛογισμικό & κατασκευή λογ/κού

4 Νοε 2013 (πριν από 3 χρόνια και 7 μήνες)

61 εμφανίσεις

Understanding Computers: Today and Tomorrow, 11th Edition, Instruct
or’s Manual

Chapter 10

Page
1

Chapter
10

Multimedia and the

Web


At a Glance





Chapter Objectives




Chapter Approach




Chapter Notes


Overview


What I
s Web
-
Based Multimedia?

Classroom Activity

Quick Quiz


Multimedia Elements

Classroom Activity

Quick Quiz


Multimedia Web Site Design

Class
room Activity

Quick Quiz


Multimedia Web Site Development

Classroom Activity

Quick Quiz


The Future of
Web
-
Based
Multimedia




Chapter
Discussion Questions




Key Terms




Chapter Quiz



Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
2


Instructor’
s Notes


C
HAPTER
O
BJECTIVES

1.

Define Web
-
based multimedia

and

l
ist some advantages and disadvantages of using multimedia.

2.

Describe each of the
following multimedia elements

text, graphics, animation, audio, and
video

and tell how they differ
.

3
.

Briefly describe the basic steps and principles involved with multim
edia Web site design.

4.

List the var
ious tasks involved with multimedia Web site development.

5.

Explain how markup languages, scripting languages, and other tools are used today to create
multimedia Web pages.

6.

Discuss

the
possible
format of Web
-
based

multimedia in the future.

C
HAPTER
A
PPROACH

The purpose of
Chapter
10 is to give the students an overview of multimedia in general, as well as how
multimedia is used in conjunction with the Internet. The chapter first
takes a look at what Web
-
based
multime
dia is and a variety of Web
-
based multimedia applications. Next, the
elements found in multimedia
applications a
re discussed
, followed by the basic steps involved with designing and
developing

a
multimedia application or Web site. The chapter closes with a

brief look at the future of multimedia.


Although the focus on this chapter is on Web
-
based multimedia, be sure to stress that there are plenty of
non
-
Web
-
based multimedia applications. Also, point out to your students that this chapters contains just an

overview of the multimedia design and development process

designing and developing multimedia Web
sites and other applications are complex tasks and would require much more instruction than can be
covered in a single chapter.


C
HAPTER
N
OTES


What I
s Web
-
B
ased Multimedia?

Explain that multimedia technically refers to any type of application or presentation that uses more than
one type of media, although typically it is only used to describe applications that include sound, video,
animation, or interactivity
. Web
-
based multimedia usually refers to Web sites that contain more than one
type of media, in addition to text and images.
Review some of the applications mentioned in the chapter.
Can students think of any other Web
-
based multimedia applications they ha
ve encountered?


Discuss the advantages and disadvantages of using multimedia. One of the biggest advantages is that
multimedia applications can fit a variety of learning styles, including
visual, auditory,
and
kinesthetic
learners.
Other advantages includ
e a more interesting and enjoyable experience, and some applications are
easier to understand in a multimedia format.

Disadvantages include cost, slower delivery time,
and the
limitations (variety of browsers, plug
-
ins, etc.) of Web
-
based multimedia.


Cla
ss
room Activity


What
I
s Web
-
Based Multimedia
?


Refer the students to Figure 10
-
2

and discuss the ease of use of the multimedia program vs. the printed
instructions. How many advantages can they think of? Are there any disadvantages for using the program
instead of the printed directions?


Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
3

Quick Quiz


What I
s Web
-
Based Multimedia
?


1)

Which of the following terms refers to the use of more than one type of media, such as text, graphics,
sounds, and video, on a W
eb site?


a)

interactivity

b)

multimedia

c)

Web
-
based mu
ltimedia



2)

True or False:
Delivery speed is one potential
disadvantage of using Web
-
based multimedia
.


3)

A
person who learns best by seeing can be referred to as a(n)
______________

leaner
.


Answers:

c
, true,
visual


Multimedia Elements

Text, graphics, anima
tion, audio, and video are the most common types of multimedia elements. You will
want to discuss each of these to some extent.



Text

Text
can be used for basic content, as well as for hyperlinks, menus, and other navigational elements.
Explain the differ
ence between serif and sans serif typefaces (see Figure 10
-
3
) and mention that s
erif
typefaces
are typically used for large bodies of text;
sans serif typefaces
are more commonly used for
headings. Different typefaces can convey widely different feelings a
nd impressions. Point size should be
selected carefully to make sure text is readable while not taking up too much of the screen.


Explain

that
the computer and browser used to view the page determine which typefaces are used to display
Web pages. To avoid

unexpected results, common typefaces should be selected, and alternative typefaces
can be listed to be used if the specified typeface is not installed on a PC. When consistent appearance is
needed (such as for logos, navigational elements, etc.) a graphic

can be used instead of plain text.



Graphics

Graphics
are digital representations of images, such as photographs, drawings, etc. They can be created by
scanning a photograph or document, taking a digital photograph, or creating or modifying an image in a
n
image
-
editing program.
Clip art
and
stock photographs
are widely available on CD and on the Web

sometimes for free.


The most commonly used g
raphic file formats
used on Web pages
are:




GIF.

The

standard for Web page images, especially line art and other
non
-
photographic images.
The format is compressed, can use up to 256 colors, and can be transparent and int
erlaced (refer
students to Figure 10
-
5 to illustrate those concepts).




JPEG.
The

standard format for photographs. It uses variable compression and ca
n display true
color (16 million color) images.

C
an be progressive and the amount of compression is specified
when the file is saved (see Figure 10
-
6).




PNG.

A

newer format that may

eventually replace the GIF format for Web images. It uses lossless
compres
sion (similar to GIF), can use a specific color palette or true color, and can be interlaced
and transparent.


To select the most appropriate image, it is sometimes desirable to save the image in a variety of formats
and select the one with acceptable qual
ity and the smallest file size.

Look at the examples in Figure 10
-
7
with the class.

Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
4


Explain the concept of a thumbnail image and why it is used. See the example in Figure 10
-
8.


Animation

Animation
involves a series of graphical images displayed one after

another to simulate movement.
Page
transitions, animated GIFs, Java applets, Shockwave, Flash,
etc. are common types of animation.
A
nimation can also be added using
JavaScript
or a programming language.

Some examples of animation
are shown in Figure
s

10
-
9

and 10
-
10
. Make sure students realize what the animated elements in th
ese
f
igure
s

do.


Troubleshooting Tip



If some
multimedia
element on a Web page doesn’t work or show up as expected,


students

should first reload the page and then should read the in
structions,


i
ntroduction, or other information on the Web site to see if a required plug
-
in


needs to be installed to view the content
.


Audio

Audio
includes music, spoken voice, sound effects, etc. and can be used to enhance the presentation of an
a
pplication or for content delivery.

Audio can be recorded using a microphone or MIDI device, or captured
from a CD or downloaded from the Internet.

When adding audio to a Web site, make sure it doesn’t slow
down the site too much and annoy your site visit
ors.

Common audio formats include
.wav, .mp3, .midi,
.aif
f
,
and
.
aac
.


Video

Video
begins as a continuous stream of visual information and is broken down into individual
frames

when
it is recorded.

Video can be recorded using a standard video camera and t
hen input into a computer, or
recorded directly into a PC or onto digital media using a digital video camera.

Common video formats
include
.
avi, .mpeg, .mov,
and
.rm.


Classroom Activi
ty


Multimedia Elements

If you have a PC with Internet access and a com
puter projector attached, display a Web page that contains
some multimedia elements (such as a news site or PBSKids.org) and ask students to identify the types of
multimedia elements found on the page. If an
animated
element is
n’t

obvious until the mouse p
oints to it or
another action is taken, take the appropriate action to show the animation. Did the students miss any

elements
? If so,
point them out.
Ask the students to evaluate the purpose and necessity of the animation. Is
it necessary? Does it add to t
he functionality or appeal of the site? Would they eliminate any of the
elements? Why or why not?


Quick Quiz


Multimedia Elements


1)

The most common file format for Web page photographs is

a)

GIF

b)

JPEG

c)

PNG


2)

True or False: With video, several different versions

of an image are combined into a single file using
special software and when the Web page is displayed, the images rotate to simulate movement
.


3)

A small image that is linked to a larger version of the same image is called

a
(n)
_______________________

image
.


Answers:

b, false, thumbnail

Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
5


Multimedia Web Site Design

Web site d
esign
is the process of planning what your Web site will look like and how it will work. Careful
planning is very important and usually pays off in the long run.
Topics related to Web si
te design that you
should discuss with the class are listed next.


Basic Design Principles

Applications should be interesting and exciting, and Web site content should be changed on a regular basis.

Navigation should be clear, consistent, and easy to unde
rstand.
It is also very important for
Web pages
to

load quickly

10
0 KB to load in 30 seconds or less is a good guide.


The device used to access the application should be considered so the application is designed appropriately
to fit the type of device, sc
reen size, typical user, etc. The following should be limited, if possible
.




Features that require a specific browser



Features that require little
-
used plug
-
ins



Content wider
or taller
than a usual browser window



High
-
bandwidth items


Determining the Inten
ded Audience and Objectives

Explain that this is
one of the first steps in the design process. The intended audience will help determine
the appearance of the application, and the objectives will help determine the content.

Direct the students’
attention t
o the Web sites shown in Figure 10
-
1
2
.


Using Flowcharts, Page Layouts, and Storyboards

Explain that these tools are very helpful when designing a Web site (flowcharts and page layouts) and
animated elements (storyboards).
A
flowchart
can be used to descri
be how the pages of a site or application
relate to one another, although there will usually be additional links between the pages, such as all pages
having links to all main pages of the site.

Page layouts
are commonly used to design the appearance of a
W
eb site. Typically one layout is prepared for the home page and one general layout for the rest of the
pages on the site.

Storyboards
are commonly used with multimedia applications to illustrate the appearance
and content of each screen in the application.

Run through the flowchart shown in Figure 10
-
1
3

to get an
idea of the content and pages to be used on that site. What do students think of the page layout shown in
that figure?


Navigational Design Considerations

Look at the balance of a site after drawin
g the flowchart to ensure it is organized, but not too hard to reach
any one page (within three mouse clicks is optimal).

There are many techniques that can be used to aid
navigation.


Some of the most commonly used navigational tools are

site

map
s,

drop
-
down menus, search boxes, text
-

and image
-
based navigation bars, and using
frames
to always keep the navigation bar displayed on the
screen.

Long pages can use a table of contents to jump to a particular section of the document, or to go to a
printable or
savable version.

Look at Figure 10
-
1
4

with the class and make sure they can identify and
understand how the tools shown there work.

Have they used other useful navigational tools on Web sites?


In addition, a
ll pages should contain identifying information
to show visitors which site they’re on and
which page they are currently viewing. Contact information for the organization should also be included.


Access Considerations

Explain that there are two types of access considerations that apply to Web sites: ac
cess for multiple
devices and access by users of assistive hardware. The devices to be used by expected visitors should be
determined to decide if alternative versions of the site are needed for some categories of users, such as
those with an alternative b
rowser, microbrowser,
text
-
only browsers,
etc.

(direct the students’ attention to
Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
6

the images in Figure 10
-
15)
.

Alternative text for images
should always be used to
enable the page to be
usable with a text
-
only browser or screen reader program. Federal Web
sites need to
make sure the pages
are accessible by people with disabilities. It is a good idea for a Web site to
comply with
these standards to
ensure wider accessibility. Some factors that make a Web page more accessible
to assistive hardware and
individ
uals with disabilities
are shown in Figure 10
-
1
6
.


Classroom Activity


Multimedia Web Site Design

Direct the students’ attention to Figure 10
-
11. Break the class into groups of two or three students each and
ask them to design an alternative page layout f
or the home page of this site. They should discuss the types
of navigational tools they’d like to have and any multimedia content that will be included on the home
page. If time permits, have one or two groups share their design with the class.


Quick Quiz



Multimedia Web Site Design


1)

Which of the following is most often used to illustrate what a Web page will look like?


a)

flowchart

b)

storyboard

c)

page layout


2)

True or False:
In order for a screen reading program to identify an image
-
based hyperlink, alternative

text must be assigned to that image
.


3)

A

Web page that contains links to all the main pages on a Web site is called

a(n)

____________________.


Answers:

c
, true
,
site map


Multimedia Web Site Development

T
he
development
process involves actually creating
the Web site, either in
-
house or by an outside,
professional developer.

It involves the three basic steps described next.


Creating the Multimedia Elements

A wide variety of software can be used to create the individual elements to be used in the applicati
on or
site
.



Graphics software
can be used to create or modify images.

Painting programs
color images pixel
by pixel;
drawing programs
can modify and resize images using formulas so they can be layered
and resized without distortion;
image
-
editing programs

are used to touch up images, such as by
cropping them, applying filters,
optimizing
images, etc.



Audio
-
editing
and
video
-
editing
programs can be used to create and modify audio and video clips.
Clips can be captured from CDs or input using a video camera
or microphone. Clips can be
shortened, spliced together, etc.



Animation software
is used to create animations, such as animated GIFs, Shockwave and Flash
animations, etc. Animation can also be implemented using
Dynamic HTML (DHTML)
and
JavaScript

(discusse
d later in the chapter)
.
When selecting the type of animation to be used,
compatibility, file size, and required plug
-
ins should be considered, in addition to the
appropriateness of the format for the type of animation desired.


Creating the Web Site

Most
Web
pages are written in a markup language, such as HTML (Hypertext Markup Language)

or
XHTML (Extensible Hypertext Markup Language)
. With HTML, HTML tags are used to indicate the
content of the site (such as where images, hyperlinks, and animated elements

should go), as well as the
appearance of the text on the site. Some other uses for HTML tags are listed in the section.

With the class,
quickly go over the HTML tags shown in
F
igure
10
-
19
and discuss their purposes.

Explain that XHTML is
Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
7

a newer, stricter

version of HTML. Take a look at Figure 10
-
21 with the students and see if they can
decipher what some of the codes do.


Mention that other markup languages can be used
, such as DHTML, WML, and SVG.

Explain that
s
cripting languages are often used for dynam
ic content or to add interactivity. P
erhaps the most common is

JavaScript. Take a look at the JavaScript code shown in Figure 10
-
22

and see how it relates to the
Cyberchase

home page shown in Figure 10
-
10
.
Mention AJAX and its potential to speed up interac
tive
Web pages.
Explain that there are other options for specific applications, such as ActiveX, VRML, and
MHTML.


Explain that most people don’t create Web pages by typing the HTML codes directly. Instead, Web site
authoring software
is typically used. It

generate
s

the appropriate
HTML

or XHTML

tags
as options are
selected from menus and toolbar buttons are clicked

(refer students to Figure 10
-
23
)
. Some programs

allow
you to edit the HTML
or XHTML
directly, as well. Web pages can also be created in word pr
ocessors and
other application programs, but Web site authoring programs allow the creation of an entire site, including
adding effects, styles, navigation bars, backgrounds, etc. to the entire site at one time, as well as to publish
the entire site at one

time.



Testing
, Publishing,

and Maintaining
the Site

All navigational items should be thoroughly tested to ensure that they take the user to the correct location.

Usability testing is helpful to determine if the application or site is easy to understand

and navigate.

All
Web pages

should be proofread carefully for spelling and grammatical errors.

Web sites should also be
tested on different types of PCs and with several different browsers to make sure they work on as many
different configurations as poss
ible, and page download time should be evaluated. Any links to pages
outside the site should be tested on a regular basis to ensure that the page still exists and is still an
appropriate link.


A Web site “stress test” can be used to test how much traffic
the site can handle

this is especially
important for e
-
commerce sites.

Web sites should also undergo regular updates and testing to keep them
current, accurate, and interesting.


Classroom Act
ivity


Multimedia Web Site Development

If you haven’t already d
one so, run through the

list of HTML tags shown in Figure 10
-
1
9

with the class.
Next, direct the students’ attention to
the HTML version of the Web page shown in Figure

10
-
20
.
Ask them
to c
ompare the HTML code with the actual Web page and try to match up t
he text and other elements in the
HTML code with the actual Web page.

Give them a few minutes and the go through the code that’s shown,
asking students what each new section of the code does.

Next, direct the students’ attention to the XHTML
in
Figure 10
-
2
1 and discuss how it differs from HTML
.



Quick Quiz


Multimedia Web Site Development


1)

Which of the following
markup language
s is most often used with Web pages?

a)

HTML

b)

JavaScript

c)

W
ML


2)

True or False:
Web site authoring software can typically be used to crea
te all Web page content,
including the Web pages, animated elements, video clips, etc.


3)

The HTML code

_______________________

would begin to bold Web page text
.


Answers:

a
, false,
<b>


Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
8

The Future of
Web
-
Based Multimedia

Multimedia will likely continue to
be embedded in an increasing number of
Web pages
. Multimedia Web
sites and television applications will likely merge closer together and increase in popularity as more
individuals get broadband Internet access.


C
HAPTER
D
ISCUSSION
Q
UESTIONS


1.

The chapter

In
side the Industry box discusses the film industry. Discuss how making films has
changed with computers and digital equipment. Have any students had experience editing movies on a
computer? Are any students planning on working in the film industry? Do compu
ters make creating
films easier? If so, how? Are they any ways they make it more difficult?



2.

The chapter
How it Works
box
takes a look at publishing a Web site. If students will be creating and
publishing a Web page as part of this course or if students a
re allowed to publish personal Web pages
on the campus Web server, discuss how the process works. What program will the students use to
upload the files? What programs are available on campus for creating Web sites and Web page
elements?

Would students lik
e to
have a personal Web page
? Why or why not?
Have students create
and posted personal Web pages through another Web server? What was the purpose? Ask them to
share their experiences
.

Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
9


K
EY
T
ERMS

Animated GIF

A group of GIF images saved as an animated GI
F file that is inserted in a
Web page; the individual images are displayed one after another to
simulate movement.

Animation

The process by which a series of graphical images are displayed one after
the other to simulate movement.

Audio

Sound, such as
music, spoken voice, and sound effects.

Clip art

Predrawn electronic images.

Dynamic HTML (DHTML)

A form of HTML used to add dynamic capabilities and interactivity to
Web pages.

Flash

A popular Web animation program.

Flowchart

A tool that can be u
sed during the Web design process to illustrate
how the
pages in a Web site relate to one another.

GIF

A graphics format that supports 256 colors and is commonly used for Web
page line art images.


Graphic

A

digital representation of a photograph, draw
ing, chart, or other visual
image.

HTML (Hypertext Markup
Language)

A markup language widely used for creating Web pages.

Javascript

A scripting language widely used to add dynamic content to Web pages.

Java applet

A small program inserted into a Web

page that performs a specific task,
such as changing the values in a stock portfolio or scrolling text across the
screen.

JPEG

A graphics format that supports true color and is commonly used for
photographs inserted in Web pages.

Markup language

A lan
guage that uses symbols or tags to describe what a document should
look like when it is displayed in a Web browser.

Multimedia

The integration of a variety of media, such as text, graphics, video,
animation, and sound.

Page layout

A sketch of a Web pag
e often developed during the Web design process to
illustrate the basic layouts of the home page and the rest of the pages on a
Web site
.

PNG

A graphics format designed specifically for use with Web page images.

Storyboard

An ordered series of sketches

that can be developed during the design
process of an animated sequence or other multimedia component of a Web
site that illustrates what each page or screen in the application will look
like.

Text

Alphanumeric characters kept in a text, not graphic, fo
rmat.

Thumbnail image

A small image on a Web page that is linked to a larger, higher
-
resolution
image.

Video

A continuous stream of visual information broken into separate images or
frames to be displayed one after the other to simulate the original vi
sual
event.

Virtual reality (VR)

The use of a computer to create three
-
dimensional environments that look
like they do in the real world.

Understanding Computers: Today and Tomorrow, 11th Edition, Instructor’s Manual

Chapter 10


Page
10

Web site authoring software

A type of application program used to create Web pages and complete
Web sites.

Wirele
ss Markup Language
(WML)

A language similar to XML that is used with pages to be displayed on
WAP
-
enabled devices.

XHTML (Extensible Hypertext
Markup Language)

A newer, stricter version of HTML that is based on XML.

XML (Extensible Markup
Language)

A
set of rules used for exchanging data over the Web; addresses only the
content, not the formatting; the content displays in an appropriate format
based on the device being used.



COPYRIGHT © 200
7
Course Technology, a division of Thomson Learning, Inc.

Name:

______________

Course:

______________

Instructor:

______________

Chap
ter

Quiz

Understanding Computers: Today and Tomorrow

1
1
/e
, Chapter
10


True/False

Instructions:

Circle
T
if the statement is true or
F
if the statement is false.


T F 1
.

The appearance of text (such as font face and style) incorporated into a Web pag
e graphic
will appear as it was when it was created, regardless of the users installed fonts and
browser settings
.

T F 2
.

The amount of compression of a GIF image is selected by the user when the image is
saved
.

T F 3
.

Interlaced images display

faster than noninterlaced images
.

T F 4
.

Storyboards are more appropriate for designing multimedia components of a Web site,
rather than the entire Web site
.

T F 5.

On
ce a Web site has been created and thoroughly tested, it no longer requires
any further
testing.


Multiple Choice

Instructions:

Select the
best

answer for each question and write the corresponding letter in the blank at the
left of each question.

______
6
.


Which of the following
in NOT

an audio file format?


a.

.wav

c
.

.
mp3

e
.

.
aiff


b
.

.midi

d
.

.mov


______
7
.


Which of the following
can be used as a navigational tool?


a.

image map

c
.

XHTML

e
.

storyboards


b
.

HTML

d
.

video



Matching

Instructions:

Select the term that
best

matches each of the following statements and write the

corresponding letter in the blank at the left of each statement (all terms will not be used).


a.

JPEG

c
.

JavaScript

e.

X
HTML



b.

PNG

d.

GIF



______

8.



The file format most often used for Web page line art images
.


______

9.



A markup language.


____
__

10.


The file format most often used for Web page photographs
.