| Adding Media for WebPages |
![]() |
|
Adding video You must download a helper application to view these formats. With these
formats, you can stream audio and video simultaneously. |
|
You can use Director to create Shockwave movies or Flash to create interactive, low-bandwidth, multimedia presentations for the web. With Flash, file size is surprisingly small, and the technology works across many platforms. (Of course, users must first download the free player plug-in before they can view these files.) |
| This is a streaming version of the same movie... I don't know how this will all work out.... |
Adding sound to a page
There are several different types of sound files and formats, and several different
ways to add sound to a web page. Some factors to consider before deciding on
a format and method for adding sound are its purpose, your audience, file size,
sound quality, and differences in browsers.
Note: Sound files are handled very differently and inconsistently by different
browsers. You may want to add a sound file to a Flash movie, then embed the
SWF file to improve consistency.
About audio file formats
|
|||
| .midi or .mid (Musical Instrument Digital Interface) format is for instrumental music. | MIDI files are supported by many browsers and don't require a plug-in. Although their sound quality is very good, it can vary depending on a visitor's sound card. A small MIDI file can provide a long sound clip. MIDI files cannot be recorded and must be synthesized on a computer with special hardware and software. | Player? NO |
|
.wav (Waveform Extension) format files have good sound quality, are supported by many browsers, and don't require a plug-in. |
You can record your own WAV files from a CD, tape, microphone, and so on. However, the large file size severely limits the length of sound clips that you can use on your web pages. | Player? NO |
|
| .aif (Audio Interchange File Format, or AIFF) format, like WAV format, has good sound quality, | can be played by most browsers, and doesn't require a plug-in; you can also record AIFF files from a CD, tape, microphone, and so on. However, the large file size severely limits the length of sound clips that you can use on your web pages. | Player? NO |
|
.mp3 (Motion Picture Experts Group Audio, or MPEG-Audio Layer-3) format |
is a compressed format that makes sound files substantially smaller. The sound quality is very good: if an MP3 file is recorded and compressed properly, its quality can rival that of a CD. New technology lets you "stream" the file so that a visitor doesn't have to wait for the entire file to download before hearing it. However, the file size is larger than a Real Audio file, so a whole song could still take quite a while to download over a normal phone line connection. To play MP3 files, visitors must download and install a helper application or plug-in such as QuickTime, Windows Media Player or RealPlayer. | Player? yes..QuickTime, Windows Media Player or RealPlayer |
|
| .ra, .ram, .rpm, or Real Audio format | has a very high degree of compression with smaller file sizes than MP3. Whole song files can be downloaded in a reasonable amount of time. Because the files can be "streamed" from a normal web server, visitors can begin listening to the sound before the file has completely downloaded. The sound quality is poorer than that of MP3 files, but new players and encoders have improved quality considerably. Visitors must download and install the RealPlayer helper application or plug-in to play these files. | RealPlayer helper application or plug-in to play these files. | |
Linking to an audio file
Linking to an audio file is a simple and effective way to add sound to a web
page. This method of incorporating sound files lets visitors choose whether
they want to listen to the file, and makes the file available to the widest
audience.
To create a link to an audio file:
1. Select the text or image you want to use as the link to the audio file.
2. In the Property inspector, click the folder icon to browse for the audio
file, or type the file's path and name in the Link field.
ie. HI, click me to hear me sing!
This file is a hefty 132K which is why it takes so long to download.
or
Embedding a sound file
Embedding audio incorporates the sound player directly into the page, but the
sound only plays if visitors to your site have the appropriate plug-in for the
chosen sound file. Embed files if you want to use the sound as background music,
or if you want more control over the sound presentation itself. For example,
you can set the volume, the way the player looks on the page, and the beginning
and ending points of the sound file.
To embed an audio file: pluginfile for music below and above:
music file for fish or whatever
1. In Design view, place the insertion point where you want to embed the file
and then do one of the following:
• In the Insert bar, select Media then click the Plugin icon.
• In the Insert bar, select Media then drag the Plugin icon to the Document
window, or to the Code view window if you are working in the code.
• Choose Insert > Media > Plugin.
For more information about the Plugin object, see Inserting Netscape Navigator
plug-in content.
2. In the Property inspector, click the folder icon to browse
for the audio file, or type the file's path and name in the Link field.
3. Enter the width and height by entering the values in the appropriate fields
or by resizing the plug-in placeholder in the Document window.
These values determine the size at which the audio controls are displayed in
the browser. For example, try a width of 144 pixels and a height of 60 pixels
to see how the audio player appears in both Navigator and Internet Explorer.
Using behaviors to control media
You can add behaviors to your page to start and stop various media objects.
Control Shockwave or Flash lets you play, stop, rewind, or go to a frame in
a Shockwave or Flash movie (see Control Shockwave or Flash).
Play Sound lets you play a sound; for example, you can play a sound effect whenever
the user moves the mouse pointer over a link
Check Plugin lets you check to see if visitors to your site have the required
plug-in installed, then route them to different URLs, depending on whether they
have the right plug-in. This only applies to Netscape Navigator Plug-ins, as
the Check plugin behavior does not check for ActiveX controls. For more information,
see Check Plugin.
Using parameters to control media objects
Use the Parameters dialog box to enter values for special parameters defined
for Shockwave and Flash movies, ActiveX controls, Navigator plug-ins, and Java
applets. Parameters are used with the object, embed, and applet tags. Parameters
set attributes specific to the type of object being inserted. For example, a
Flash movie object can have a quality parameter <param name="quality"
value="best"> for the object tag. The Parameter dialog box is available
from the Property inspector. See the documentation for the object you're using
for information on the parameters it requires.
Note: There is no widely accepted standard for identifying data files for ActiveX
controls. Consult the documentation for the ActiveX control you're using to
find out which parameters to use.
To open the Parameters dialog box:
1. Select an object that can have parameters (such as a Shockwave movie, an
ActiveX control, a Navigator plug-in, or a Java applet) in the Document window.
2. Open the dialog box using one of these methods:
• Right-click (Windows) or Control-click (Macintosh) the object, and choose
Parameters from the context menu.
• Open the Property inspector if it isn't already open, and click the
Parameters button found in the lower half of the Property inspector. (Make sure
the Property inspector is expanded.)
Here I clicked, added the behavior play so that when the page downloaded
it played the tune....unlike the above that were linked and allowed the person
the choice of playing...
To enter a value for a parameter in the Parameters dialog box:
1. Click the plus (+) button.
2. Enter the name of the parameter in the Parameter column.
3. Enter the value of the parameter in the Value column.
To remove parameters:
Select a parameter and press the minus (-) button.
To reorder parameters:
Select a parameter and use the up and down arrow buttons.
Setting Flash and Shockwave movie properties
To ensure the best results in both Internet Explorer and Netscape Navigator,
Dreamweaver inserts Flash and Shockwave movies using both the object and embed
tags. (The object tag is defined by Microsoft for ActiveX controls; embed is
defined by Navigator for plug-ins.) To view the following properties in the
Property inspector, select a Flash movie or a Shockwave movie. See also About
Flash content, and Inserting Shockwave movies.
To see all Flash movie properties, click the expander arrow in the lower right
corner.
Name specifies a name to identify the movie for scripting. Enter a name in the
unlabeled field on the far left side of the Property inspector.
W and H specify the width and height of the movie in pixels. You can also specify
the following units: pc (picas), pt (points), in (inches), mm (millimeters),
cm (centimeters), or % (percentage of the parent object's value). The abbreviations
must follow the value without a space (for example, 3mm).
File specifies the path to the Flash or Shockwave movie file. Click the folder
icon to browse to a file, or type a path.
Src specifies the path to a Flash source document (FLA), when Dreamweaver MX
and Flash MX are both installed on your computer. To edit a Flash movie file
(SWF), you update the movie's source document.
Edit lets you launch Macromedia Flash MX to update a FLA file. This button is
disabled if you do not have Macromedia Flash MX loaded on your computer. For
information about editing an inserted Flash movie, see Editing a Flash movie
from Dreamweaver.
Reset Size returns the selected movie to its original size.
Loop, when checked, makes the movie play continuously; when unchecked, the movie
plays once and stops.
Autoplay, when checked, automatically plays the movie when the page loads.
V Space and H Space specify the number of pixels of white space above, below,
and on both sides of the movie.
Quality controls anti-aliasing during playback of the movie. A movie looks better
with a high setting, but it requires a faster processor to render correctly
on the screen. Low emphasizes speed over appearance, whereas High favors appearance
over speed. Auto Low emphasizes speed at first, but improves appearance when
possible. Auto High emphasizes both qualities at first, but sacrifices appearance
for speed if necessary.
Scale determines how the movie fits into the dimensions set in the width and
height fields. The Default setting displays the entire movie.
No Border fits the movie into the set dimensions so that no borders show and
maintains the original aspect ratio.
Exact Fit scales the movie to the set dimensions, regardless of the aspect ratio.
Inserting Netscape Navigator plug-in content
Plug-ins enhance Netscape Navigator, providing ways to view media content in
a wide variety of formats. Plug-ins are the means by which content files are
played and displayed on your website. For example, typical plug-ins include
RealPlayer and QuickTime, while some content files themselves include MP3s and
QuickTime movies.
After you create content for a Navigator plug-in, you can use Dreamweaver to
insert that content into an HTML document. Dreamweaver uses the embed tag to
mark the reference to the content file.
To insert Navigator plug-in content:
1. In the Design view of the Document window, place the insertion point where
you want to insert the content, then do one of the following:
• In the Insert bar, select Media and then click the Plugin icon.
• Choose Insert > Media > Plugin.
2. In the dialog box that appears, select a content file for a Navigator plug-in.
Playing plug-ins in the Document window
You can preview movies and animations that rely on Navigator plug-ins--that
is, elements that use the embed tag--directly in the Design view of the Document
window. (You cannot preview movies or animations that rely on ActiveX controls
in the Document window.) You can play all plug-in elements at one time to see
how the page will look to the user, or you can play each one individually
to ensure that you have embedded the correct media element.
To play movies, the proper plug-ins must be installed on your computer. When
Dreamweaver starts up, it automatically searches for all installed plug-ins,
looking first in the Configuration/Plugins folder and then in the plugin folders
of all installed browsers.
To play plug-in content in the Document window:
1. Insert one or more media elements by choosing Insert > Media > Shockwave,
Insert > Media > Flash, or Insert > Media > Plugin.
2. Play plug-in content:
• Select one of the media elements you have inserted, and choose View >
Plugins > Play or click the Play button in the Property inspector.
• Choose View > Plugins > Play All to play all of the media elements
on the selected page that rely on plug-ins.
Note: Play All only applies to the current document; it does not apply to other
documents in a frameset, for example.
To stop playing plug-in content:
Select a media element and choose View > Plugins > Stop, or click the
Stop button in the Property inspector.
You can also choose View > Plugins > Stop All to stop all plug-in content
from playing.
Troubleshooting Navigator plug-ins
If you have followed the steps to play plug-in content in the Document window,
but some of the plug-in content does not play, try the following:
• Make sure the associated plug-in is installed on your computer, and
that the content is compatible with the version of the plug-in you have.
• Open the file Configuration/Plugins/UnsupportedPlugins.txt in a text
editor and look to see if the problematic plug-in is listed. This file keeps
track of plug-ins that cause problems in Dreamweaver and are therefore unsupported.
(If you experience problems with a particular plug-in, consider adding it to
this file.)
• Check that you have enough memory (and on the Macintosh, check that
enough memory is allocated to Dreamweaver). Some plug-ins require an additional
2 to 5 MB of memory to run.