Web Design, 4 th Edition 6 Multimedia and Interactivity Elements

Web Design,4th Edition

6Multimedia andInteractivity Elements

Chapter 6: Multimedia and Interactivity on the Web 2

Chapter Objectives

Explain Web page multimedia issues Describe types of Web page animation Discuss adding and editing Web page audio and

video elements Identify ways to effectively use interactive elements


Multimedia Issues

Combination of text, images, animation, audio, and video

Most WYSIWYG editors include tools for incorporating multimedia

Use multimedia sparingly, and for distinct purposes


Multimedia Issues

Guidelines to follow– Give visitors a choice of content– List any necessary plug-ins– Provide text equivalents for all multimedia

elements– Do not waste bandwidth– Break audio or video files into short segments


Animation

Animation can be used to– Catch a visitor’s attention– Demonstrate a simple process– Illustrate change over time

Animated GIFs– Sequence of frames that simulate movement– Should be used to support your Web site’s message– Too many animated GIFs can detract from a page


Animation


Adobe Flash Professional CS5 and Microsoft Silverlight

Adobe Flash Professional CS5 is a tool for creating sophisticated Flash movies

Simulates motion via fast-paced presentation of changing static images

Microsoft Silverlight is a plug-in technology designed to play the multimedia content found in rich interactive applications (RIAs)


Adobe Flash Professional CS5 and Microsoft Silverlight


Avatars

Avatars are alternative personas or virtual identities for MMOGs or 3D virtual worlds

Avatars can be found– In e-mail marketing campaigns– Business or personal blogs– E-commerce Web sites

• Virtual models


Avatars


Gadgets

Also called widgetsSmall code objects that provide dynamic Web

content– Clocks– Weather reports– Breaking news headlines


Gadgets


Audio and Visual Elements

Downloadable media must be downloaded in its entirety before it can be heard or seen

Streaming media begins to play as soon as data begins to stream


Audio and Visual Elements


Audio Elements

Audio files can add sound effects, entertain visitors with background music, deliver a personal message, or sell a product or service with testimonials

Only include background music when it supports your site’s message and the mood you want to achieve

You can record your own audio files


Audio Elements

Streaming audio begins playing as the audio is delivered by the server– RealAudio

• RealPlayer

– Windows Media• Windows Media Player

– QuickTime• QuickTime Player


Streaming Audio


Editing Audio Files

Use these guidelines for creating and editing audio files for the Web:– Keep audio clips short– Select a mono audio channel– Use an 8 kHz sampling rate for voice only audio, and 22

kHz for music audio– Use an 8-bit audio file for voice and 16-bit audio file for

music


Video Elements

Video is becoming a more common content element

You can download royalty-free videos, purchase videos, or create your own video files using a digital camcorder and video editing software– Adobe Premiere Pro CS5– Pinnacle Studio Ultimate version 14– Windows Movie Maker


Video Elements


Editing Video Files

The common frame sizes are 160 x 120 or 240 x 180 pixels; the frame rate for Web video ranges from 10 to 15 frames per second (fps)

The greater the number of bits or bit depth, the bigger the file size

You can define the general quality level of your video, which automatically adjusts the compression


Interactive Elements

Requires user participation with one or more elements on a Web page

Use interactive elements on your Web site to keep the user interested and involved with your content

Various ways to incorporate interactivity


Web-based Form Guidelines

Structured Web documents on which information can be entered

Common form elements include text boxes, check boxes, option buttons, drop-down list boxes, and a Send or Submit button

Forms are frequently used to obtain comments and feedback or to order products or services


JavaScript, Applets, and Servlets

JavaScript, applets, and servlets are all used to create interactive content elements

Applets are small programs that are designed to execute in a browser and are sent to a browser as a separate file together with the related Web page

A servlet is similar to an applet; however, a servlet executes from the server instead of executing within the visitor’s browser


Blogs

Popular way to promote Web site interactivitySites such as Blogger, Typepad, and

WordPress provide tools you can use to quickly create a blog hosted on your own server or on the tool provider’s server


Blogs


Comments

Adding a comments feature to your site enhances interactivity by enabling visitors to comment on a specific article and by creating a sense of community

It is important to monitor comments posted to your Web site for spam or malicious content


Comments


Live Chat

Live chat allows visitors to ask questions about products or services in real time

Visitors’ chat messages are answered by in-house chat agents


Live Chat


Chapter Summary

Explain Web page multimedia issues Describe types of Web page animation Discuss adding and editing Web page audio and

video elements Identify ways to effectively use interactive elements

Web Design,4th Edition

6Multimedia andInteractivity Elements

Documents

Web Design, 4 th Edition 6 Multimedia and Interactivity Elements