1. 10 Multimedia and the Web CHAPTER TODAY AND TOMORROW 11th Edition
Chapter Understanding Computers, 11th Edition

2. Learning Objectives
Define Web-based multimedia and list some advantages and disadvantages of using multimedia.
Describe each of the following multimedia elements—text, graphics, animation, audio, and video—and tell how they differ.
Briefly describe the basic steps and principles involved with multimedia Web site design.
Chapter Understanding Computers, 11th Edition

3. Learning Objectives, Cont’d
List the various tasks involved with multimedia Web site development.
Explain how markup languages, scripting languages, and other tools are used today to create multimedia Web pages.
Discuss the possible format of Web-based multimedia in the future.
Chapter Understanding Computers, 11th Edition

4. Overview This chapter covers:
Types of Web-based multimedia applications and advantages and disadvantages of using multimedia
A look at basic multimedia elements
Steps and principles in designing multimedia sites
How a multimedia Web site is developed and tested
A look at the future of Web-based multimedia
Chapter Understanding Computers, 11th Edition

5. What Is Web-Based Multimedia?
Web-based multimedia: Web sites containing more than one type of media—typically sound, video, or animation, in addition to text and images
Multimedia sites typically contain interactive elements that users interact with directly (control the delivery of a sound or video clip, manipulate a 3D object, play a game)
Fast computers and broadband Internet connections make Web-based multimedia much more feasible than in the past
Chapter Understanding Computers, 11th Edition

6. Web-Based Multimedia Applications
Information delivery (photos of products, video clips, animation to convey concepts, etc.)
E-commerce (photos of products, samples of movies and music, etc.)
Can use virtual reality (VR) to convey three-dimensional views of products, homes for sale, etc.
Entertainment (online games, video clips, online music, interactive activities, etc.)
Web-based training (WBT) (delivering instruction via the Web
Chapter Understanding Computers, 11th Edition

7. Chapter 10 Understanding Computers, 11th Edition

8. Advantages and Disadvantages of Using Web-Based Multimedia
Can address a variety of learning styles
Visual learners
Auditory learners
Kinesthetic learners
Material more interesting and enjoyable
Many ideas are easier to convey
Disadvantages
Development cost
Amount of storage space required
Compatibility and download time for Web-based multimedia
Chapter Understanding Computers, 11th Edition

9. Multimedia Elements
Text is used to supply basic content, as well as to add text-based menus and hyperlinks
Serif typefaces: more readable, used for large bodies of text
Sans serif typefaces: used for titles, headings, Web page banners
Different typefaces can convey widely different feelings and impressions
Important to select the appropriate font size
When a consistent text appearance is required—such as a logo—a graphical image is used instead
Chapter Understanding Computers, 11th Edition

10. Multimedia Elements
Graphics: digital representations of a photograph, drawing, chart, or other visual image
Clip art: predrawn electronic images
Included with some software programs
Available for free via the Web
Can be purchased individually or in collections
Stock photographs: photographs available for purchase
Various graphic formats (TIF, GIF, BMP, JPEG, PNG, etc.)
Chapter Understanding Computers, 11th Edition

11. Multimedia Elements, Cont’d
GIF: graphics format that supports 256 colors, commonly used for Web page line art images
Can be transparent
Can be interlaced
Uses lossless file compression
Chapter Understanding Computers, 11th Edition

12. Multimedia Elements, Cont’d
JPEG: supports true color and is commonly used for photographs inserted in Web pages
Can be progressive
Uses lossy file compression
The amount of compression is specified when the file is saved
Chapter Understanding Computers, 11th Edition

13. Multimedia Elements, Cont’d
PNG: designed specifically for use with Web page images
Lossless compression
Can use color palette or true color
Still not widely used
Choosing a graphic format
GIF—typically used for line art (clip art, logos, etc.)
JPEG—typically used for photographs
Select the most appropriate format
For JPEG, balance compression quality and file size
Chapter Understanding Computers, 11th Edition

14. Chapter 10 Understanding Computers, 11th Edition

15. Multimedia Elements, Cont’d
Thumbnail image: small image on a Web page that is linked to a larger, higher-resolution image
Used to save loading time since only users who click the thumbnail view the full-quality image
Chapter Understanding Computers, 11th Edition

16. Multimedia Elements
Animation: a series of graphical images are displayed in succession to simulate movement
Java applet: small program inserted into a Web page that performs a specific task
Animated GIF: group of GIF images saved as an animated GIF file, inserted in a Web page; images are displayed successively to simulate movement
For more complex animations, developers can use JavaScript or another scripting language
Multimedia authoring software can be used to create multimedia elements
Chapter Understanding Computers, 11th Edition

17. Chapter 10 Understanding Computers, 11th Edition

18. Multimedia Elements Audio: sound (music, spoken voice, sound effects)
Can be recorded using a microphone or MIDI instrument; it can also be captured from CDs or downloaded from the Internet
Often played when an event occurs on a Web page or when the visitor clicks a link
Often streaming audio to speed up delivery
Common audio file formats:
.wav
.mp3
.midi
.aiff
.aac
Chapter Understanding Computers, 11th Edition

19. Multimedia Elements
Video: continuous stream of visual information broken into separate images or frames to be displayed successively to simulate the original event
Requires a great deal of storage space
Usually compressed to save room
Streaming video is frequently used on Web pages to speed up delivery
Common video formats:
.avi
.mpeg
.mov
.rm
Chapter Understanding Computers, 11th Edition

20. Multimedia Web Site Design
Web site design refers to planning what a Web site will look like and how it will work
Good planning pays off in the long run
Basic design principles
Users like interesting and exciting applications
Users have little patience with slow-to-load or hard-to-use applications
Plan for all needed delivery methods and access devices
Chapter Understanding Computers, 11th Edition

21. Multimedia Web Site Design
Basic design principles, cont’d
Set up the site so it can be used with as many different configurations as possible
Chapter Understanding Computers, 11th Edition

22. Multimedia Web Site Design, Cont’d
Basic design principles, cont’d
Careful consideration should be given to
Features that require a specific browser
Features that require little used plug-ins
The size of the page content
High-bandwidth items
Chapter Understanding Computers, 11th Edition

23. Determining the Intended Audience and Objectives
One of the first steps in designing a multimedia application or Web site
Objectives of the site affect its content
Intended audience affects the appearance (such as the style, graphics, fonts, and colors) of the site
Once the objectives and audience have been identified, you should have a good idea of the main topics to be included in the site
If the needed content is still unclear, rethink your audience and objectives and don’t go further in the process until it become clear
Chapter Understanding Computers, 11th Edition

24. Chapter 10 Understanding Computers, 11th Edition

25. Using Flowcharts, Page Layouts, and Storyboards
Used to design the structure and layout of a site
Flowcharts: show how the pages in a Web site relate to one another
Page layouts: show the basic layout of the pages on a Web site
Typically one for the home page and one for the rest of the pages on the site
Storyboards: illustrate the content of an animated sequence or other multimedia component
Chapter Understanding Computers, 11th Edition

26. Chapter 10 Understanding Computers, 11th Edition

27. Navigational Design Considerations
Users should be able to get to most pages on the site within three mouse clicks
Navigational items should be placed in the same location on every page
Each page should have a link to the home page of the site
Navigational tools can be used to aid navigation
Drop-down menus
Site maps
Search boxes
Text-based hyperlinks and navigation bars
Image-based navigation bars
Image maps
Frames
Hyperlinks show options as pointed to
Chapter Understanding Computers, 11th Edition

28. Chapter 10 Understanding Computers, 11th Edition

29. Access Considerations
Device compatibility
Web pages display differently on different devices
Some mobile devices display wireless markup language (WML) pages instead of HTML
Need to consider these devices when designing and creating Web pages
Chapter Understanding Computers, 11th Edition

30. Access Considerations, Cont’d
Assistive technology: hardware and software designed for use by individuals with physical disabilities
Affects Web design because less clicking and scrolling is easier and some devices cannot read graphics
Rehabilitation Act requires federal agences to have accessible Web pages
Accessibility tips:
Use alternative text description for all images
Use meaningful text-based hyperlinks
Use alternative content for Flash, JavaScript, and other types of animated elements
Consider creating an alternate text-based page
Keep readability in mind
Chapter Understanding Computers, 11th Edition

31. Chapter 10 Understanding Computers, 11th Edition

32. Multimedia Web Site Development
Once a Web site has been designed, it is time to create it, a process called Web site development
Three basic steps
Creating the multimedia elements
Creating the Web site
Testing, publishing, and maintaining the site
Chapter Understanding Computers, 11th Edition

33. Creating the Multimedia Elements
Create all of the individual multimedia elements that will be used in the site
Usually several different software programs are used, such as:
Graphics software
Animation software
Audio editing software
Video editing software
Each element should be saved in the appropriate size, resolution, and file format
Chapter Understanding Computers, 11th Edition

34. Creating the Web Site
Markup language: a language that uses symbols or tags to describe what a document should look like when it is displayed in a Web browser
Most Web sites are created with a markup language
Hypertext Markup Language (HTML): the original markup language
Uses HTML tags to indicate where effects and elements belong in the Web page
Some tags are paired
The computer and browser being used still determines exactly how the Web page will display
Chapter Understanding Computers, 11th Edition

35. Chapter 10 Understanding Computers, 11th Edition

36. Creating the Web Site, Cont’d
Extensible Markup Language (XML): a set of rules for exchanging data over the Web; addresses the content but not the formatting
Extensible Hypertext Markup Language (XHTML): a newer version of HTML based on XML; controls the appearance and format of a Web page like HTML
Stricter rules than HTML
Is beginning to replace HTML
Chapter Understanding Computers, 11th Edition

37. Chapter 10 Understanding Computers, 11th Edition

38. Creating the Web Site, Cont’d
Dynamic HTML (DHTML): used to add dynamic capabilities and interactivity to Web pages
Wireless Markup Language (WML): used to create Web pages to be displayed on WAP-enabled devices, such as smart phones
Scalable Vector Graphics (SVG): used to describe vector-based images that are to be displayed scalable (in different sizes) on Web pages to match the browser window size
Chapter Understanding Computers, 11th Edition

39. Creating the Web Site, Cont’d
Scripting language: allow the inclusion of scripts (instructions) in the Web page code
JavaScript (resembles the Java programming language)
VBScript (based on Microsoft’s Visual Basic programming language)
Perl (used to write CGI scripts to process data input via a Web page
AJAX: a new set of Web standards to create faster and more efficient interactive Web applications
Chapter Understanding Computers, 11th Edition

40. Chapter 10 Understanding Computers, 11th Edition

41. Creating the Web Site, Cont’d
Other content development tools
ActiveX: a set of controls that can be used to create interactive Web pages
Extends OLE to integrate content from two or more programs
Allows a variety of types of Windows files to be viewed via Web pages
Virtual Reality Modeling Language (VRML): language to create 3D Web pages
Newest version is called X3D
MHTML (MIME HTML): a format for transferring all the elements of a Web site together as a single file
Chapter Understanding Computers, 11th Edition

42. Creating the Web Site, Cont’d
Web site authoring software: used to create Web pages and complete Web sites
Automatically generates the appropriate HTML statements
Allows you to create an entire cohesive Web site, not just individual pages
Allows you to easily include
Forms and database connectivity for more dynamic interactions with your visitors
Other helpful development tools, such as tests for broken links and accessibility tests
Chapter Understanding Computers, 11th Edition

43. Chapter 10 Understanding Computers, 11th Edition

44. Testing, Publishing, and Maintaining the Site
Hyperlinks should be clicked to ensure they take the user to the proper location
Every possible action that could take place with an animated element should be tested
Proofread each page or screen carefully
Consider a “stress test”
Update content and check links on a regular basis
XHTML Web pages can be checked with an XHTML validator
Chapter Understanding Computers, 11th Edition

45. Chapter 10 Understanding Computers, 11th Edition

46. The Future of Web-Based Multimedia
Web-based multimedia will be more exciting and more embedded into everyday events than today
New types of multimedia will likely be developed to fit our growing need for mobile content
As Internet users keep moving to broadband, expect to see multimedia sites and tv merge closer together
Game boxes (Xbox, Sega Dreamcast 2, and Sony PlayStation 2) already have built-in Internet and multimedia capabilities
Interactive TV and video-on-demand may soon be the norm on the Web
Chapter Understanding Computers, 11th Edition

47. Summary What Is Web-Based Multimedia? Multimedia Elements
Multimedia Web Site Design
Multimedia Web Site Development
The Future of Web-Based Multimedia
Chapter Understanding Computers, 11th Edition