Multimedia

1
Multimedia

• What about that other cools stuff?

2
Why Use Multimedia

• Interactivity
• Appropriate to Site Content or Message
• Add Excitement to Site
• Impressive
• Design in Multi-Dimensional Space

3
Why Not to Use Multimedia

• Customers Cannot Access
• Frivolous/Distracting
• Is it appropriate?
• Does it impact your performance significantly?

4
Business Use of Multimedia

• Hotel Rooms/Reservations
• Real Estate - Walk Throughs
• Coolness - Image Enhancement
• Demonstrate Products, Installation, Training
• Sample Products - CD, Soundtrack, Films
• Customer Service - Egghead
• Meetings - Cybertown

5
Multimedia Objects on the Web

• Photo/Graphic (.jpg, .gif)
• Clickable Image Map
• Animated GIF
• Audio (.au, .wav. ram)
• Video (.mov, .ram, .avi)
• VRML
• Streaming audio/video, Quickcams

Plug Ins
6
Photo

• Scan and edit (CLA 4-27) photoshop, corel draw,
  paintbrush, MS image composer
• Inserting and image height40 width30
• GIF Compression
• Better for graphics than text
• Interlacing and transparent background possible
• Need to change mode to indexed color to save as a
  gif
• JPEG (JPG) Compression
• Preserves RGB colors
• Compression better for photo resolutionAlternate
  Text for an Image

7
Image - alt text, size, border

• Set ALT attribute for the tag to text to
  display when image is not
• unavailable
• Can specify height and width in pixels
• Border attribute SRCkachina.jpg border5

8
Rules of Thumb for Graphics

• Try to keep file size 30K or less
• Crop or resize images
• Use thumbnails of larger images
• Dont put too many on one page
• Reuse graphics

• Use GIF compression for graphics
• Use JPG for photos
• Minimize color range in your graphics -- can
  compress with better results
• Try different compression levels -- choose

9
Creating an Image Map

• Use an HTML editor
• select a picture, draw polygons and add
  hyperlinks where desired. (FrontPage, PageMill,
  Mapedit).
• Examples (on examples page)
• Nav Buttons
• Internet in a Baby
• USGS

10
Animated Gifs

• Like an Animation - Pasting frames with changes
  together.
• Allows you to specify timing between frames.
• Tools giffy, gif builder (comparison, tools)
• Examples
• Gates
• Animated Gif Libraries

11
Animation of Graphics

• Animated Graphics
• gifs - morphs
• java script
• dhtml
• movies...

12
Audio Files

• ?-law - Unix -older format (.au)
• AIFF - Audio Interchange File Format Apple
  (.aif)
• WAVE - Microsoft IBM (.wav)
• MPEG - high quality requires browser plugin
  (.mpg)
• MIDIMusical Instrument Digital Interface -
  requires midi plugin (.mid)
• RealAudio - streaming audio - requires plugin
  (.ram)

13
Audio (.au, .wav, .aiff, .mid, .ram)

• As Background Music
• HIDDEN"TRUE" LOOP"TRUE" (used after
  the body tag)
• As Link
• Play It
• LiveAudio Player - Controls/Consolep. 400

14
Video (.avi QT, .mov, .ram)

• QuickTime
• WIDTH50
• AVI
• WIDTH50
• Real Player

15
VRML

• The Palace
• Cybertown

16
Interactivity - Why
17
Etc.

• Streaming Audio
• Streaming Video
• QuickCams