Multimedia and the Web

Chapter 10

2

Overview

This chapter covers: What Web-based multimedia is

how it is used today advantages and disadvantages of using multimedia multimedia elements

Developing a multimedia site Steps and principles software used during this process

A look at the future of Web-based multimedia

3

What Is (Multi) Media?

Media a means of communication

Multimedia: The integration of a variety of media, such as

Text Images Video Animation Sound

The success of a website is based on three things: It serves the purpose for its being It reaches the audience it is intended for It uses the correct multimedia

4

Multimedia Elements

Text: Used to supply basic content, and 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 Important to select a typeface that

matches the style of the Web site When a consistent text appearance

is required—such as a logo—a graphical image is used instead

5

Multimedia Elements

Images or graphics: Digital representations of photographs, drawings, charts, and other visual images also called a graphic Clip art consists of pre-drawn electronic images Stock photos are also available online

6

Multimedia Elements

Animation: A series of graphical images are displayed in succession to simulate movement

Available using: Java applet: A small program inserted

into a Web page that performs a specific task

Animated GIF: A group of GIF images saved as an animated GIF file, inserted in a Web page, which are displayed successively to simulate movement

JavaScript or another scripting language Flash is in particularly wide use today Silverlight is an alternative to Flash

7

Multimedia Elements

Audio: All types of sound including music, spoken voice, sound effects Can be recorded using a microphone or MIDI

instrument, 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

Streaming audio is used to speed up delivery Common audio file formats include:

.wav

.mp3

• .aiff

• .acc• .midi

• .m4a

8

Multimedia Elements

Video: Begins as a continuous stream of visual information, which is then broken into separate images (frames) when the video is recorded Can require a substantial amount of storage space Video data, like audio data, is usually compressed Streaming video is used for large files Common video file formats include:

.avi .mp2

• .mov• .wmv

• .mp4

9

Multimedia Web Site Creation

Web site analysis and design The process of planning what a Web site will look

like and how it will function Web site development, implementation,

maintenance: The process of creating, testing, publishing, and

maintaining a Web site

10

Multimedia Web Site Design

Web site design principles/challenges: Make it interesting and exciting

applications Consider technology Target Audience Appropriate Navigation

Site maps Design tools

Flowcharts Page Layouts Storyboards

Access considerations

11

Multimedia Web Site Design

12

Multimedia Web Site Design

In 1998, Congress amended the Rehabilitation Act to require Federal agencies to make their electronic and information technology accessible to people with disabilities.

ADA compliance - Compatibility with assistiveTechnology such asscreen readers that “read” alternative text

13

Multimedia Web Site Development

Web site development Occurs after the site is designed Can be performed in-house or outsourced Three basic steps

Creating the multimedia elements using design software

Creating the Web site using authoring software Testing, publishing, and maintaining the site

14

Multimedia Web Site Development

Creating the multimedia elements Usually several different software programs are used,

such as: Image editing software Animation software

Flash Audio editing software

Protools, SoundForge, Reason Video editing software

Premiere

15

Multimedia Web Site Development

Creating the Web site Authoring tools – Dreamweaver, ExpressionWeb,

Notepad 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 Hypertext Markup Language (HTML): The original markup

language Uses HTML tags to indicate where effects and elements

belong in the Web page The computer and browser being used still determines

exactly how the Web page will display

Other languages CSS, WML, XML, JavaScript, VBScript, PHP, Perl, AJAX,

VRML, ActionScript

16

Multimedia Web Site Development

Testing, publishing, and maintaining the site All 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