| With the growing access worldwide to broadband, the use of audio and video on Web sites has become more realistic. Technological advances in compression and streaming (the capability to send the audio or video data in a constant stream from the server to the client) have also increased the desirability of audio and video, where appropriate, on Web sites. You should still be careful, however, in using audio and video where bandwidth and user control is limited. As much fun as it is, we can't get into the details of audio and video production in this book. If you're recording your own sound samples, you need a good microphone (or two), amplification (such as the Midiman Audio Buddy), capture hardware, and sound editing software (Audition from Adobe Systems is a great do-it-all package, and so is Sound Forge from Sony Pictures Digital, if you add the Noise Reduction plug-in.) For video, you need a high-quality capture device, a zippy computer, gobs of disk space, and encoding and editing software (such as Adobe Premiere). Today's hardware and software tools make A/V production more affordable than ever, but the software typically has long and steep learning curves. Hollywood makes it all look easy, but it isn't, so budget some time to educate yourself. To play audio and video files, you and your site visitors must have plug-in software. Some of the primary plug-ins you may want to have (and encourage your site visitors to get) include Apple QuickTime, Microsoft Media Player, Real's RealOne Player, and the Beatnik Player. However, if you import your audio and video clips into Flash, it could be that the Flash player is the only one you and your visitors will need. The importance of choosing appropriate file formats is hard to overemphasize. For audio, MP3 (Motion Picture Experts Group Audio Layer-3) files have very good quality, small size, can stream, and are extremely popular. AIFF (Audio Interchange File Format) features good quality and compatibility, but with larger file sizes. MIDI (Musical Instrument Digital Interface) files can have very good quality and offer very low file sizes, but they're for instrumental music only. RealAudio files offer small size and streaming. Rich Music Format (RMF) provides good quality and compression, and requires the Beatnik plug-in. WAV (Waveform Extension) files offer good quality and compatibility but large file sizes. For video, MPEG and QuickTime tend to be popular choices. Many platforms support MPEG, and it provides a strong combination of high quality and high compression ratios. QuickTime tools and plug-ins are popular, especially on the Macintosh, but PCs can also play QuickTime movies, which offer a variety of quality and compression settings and have the file suffix .mov . AVI tends to be Microsoft-centric, and although it runs inline in the IE browser, support varies with other browsers. WMF (Windows Media Format) is another popular PC video format but it isn't cross-platform. Using Dreamweaver to Add Sound Files to a Page Now, back to Dreamweaver. After you have your sound files, you can choose either to link to them so a user can download the file, or embed them so they will play in the browser or launch the required plug-in and play upon receipt of the file. Linking and embedding are described in the following sections, but you should also be aware of two other options. First, you can attach sounds to HTML objects with the Play Sound JavaScript behavior. We covered behaviors earlier in this chapter, so take a look at that section if you skipped it. Second, you can choose to load the sound into a Flash movie, then embed the Flash object into your page. The latter is especially convenient , given that you don't have to worry about special sound plug-ins or variations in playback software at the client. As long as the visitor has the Flash player, she'll hear the sound as you intend it to be heard . We take a look at embedding Flash objects earlier in this chapter. Linking to a Sound File Linking gives your site visitor the option to save the sound file to the local hard drive for playback at a later time, or play it right away. Linking is a good option when you are unsure of your audience's preferences and capabilities. However, you don't have as much control over the sound's behavior as you do with embedding. To link to a sound file, follow these steps: - Place the text (or image or other media) you want to link to the sound file.
- In Design view, select the text or media by highlighting it.
- In the Property inspector, click the folder icon (to the right of the Link field) and find the audio file. Click to select it.
- Click OK. Your file is now linked.
Typically, when a site visitor activates a link of this type, the file begins to download and play in the associated player. Alternatively, visitors can save the file to their hard drives to play at a later time. Embedding Sound If you want your sound files to play inline and you want to have the most control over how and when the sounds play, you should embed them. A variety of attributes is available in Dreamweaver when you embed a sound file, including -
Plugin ” Enter a value here for name and id , which is necessary if you want to add behaviors or scripting to the sound file and player. -
W ” Width is best controlled by pixels, but you can use a percentage to describe how much space within the browser frame you want the plug-in player to occupy. -
H ” The Height attribute determines the height of the embedded sound file's plug-in player. -
Src ” Location of the file. -
Plg URL ” You can set a URL that takes users who don't have the correct plug-in to a plug-ins page to download it. To embed a sound file on a page, follow these steps: - Open the document to which you want to add the sound file in Design view.
- Place your cursor in the location where you want to add the file. On the Common tab of the Insert bar, click the Media button. Then click the plug-in icon. Alternatively, you can select Insert, Media, Plugin from the main menu. (If you know your audience will be using only Internet Explorer on the Windows platform, you could choose Insert, Media, ActiveX and specify the Windows Media Player class ID in the ActiveX Property inspector.) The Select dialog box appears.
- Find the file you want to embed, and select it. In Design view, you'll now see an icon that represents your file.
- The media file is now embedded. To manage its attributes, either select the plug-in icon in Design view or click within the embedded sound file in Code view. The Property inspector activates.
Make any modifications you want using the Property inspector. For example, you'll typically want to tweak the width and height settings if you want the user to be able to see the sound's helper application. You may also want to set some parameters, such as hidden or autoplay . When you're finished, save your file and test it by clicking Play from within the Property inspector. Then preview it in your target browsers. Inserting Video Adding video to your page works just the same way that adding audio does ”at least from the authoring perspective. You can link to a video file, or you can embed the file. As with sound, linking to video gives the user more options, whereas embedding video can make the experience of the page more cohesive and give the creator more control over how and when it plays. Linking and embedding video follows precisely the same steps as embedding sound, discussed earlier, with the difference that you'll select a video file rather than a sound file. Additional Attributes for Embedding Audio and Video Additional attributes are available for embedding audio and video. They include -
autoplay="true/false" ” Answer with true , and your movie starts when the page is first accessed. Answer with false , and the user must click the Play button on the console for the movie to play. -
controller="true/false" ” This adds user controls to the movie. If you set this to true , you must find out how many pixels your controller needs for the display and then add that amount to the height of your movie. -
loop="true/false/ palindrome " ” If you want the movie to play repeatedly, set this to true . If you want to play it once and stop, set it to false . palindrome plays from beginning to end and backwards in a continuous loop. To add these attributes, bring up the Tag Inspector (select Window, Tag Inspector). Find the embed tag (for example, on the Status bar) and highlight it. All the attributes that you are currently using and that you might like to use are found there. Click in the value section found next to the attribute name and fill in the value of these attributes manually. Dreamweaver automatically updates them to the code. Be aware that different playback applications support different parameters. For example, Windows Media Player supports parameters such as showcontrols , showpositioncontrols , clicktoplay , showtracker , and many others. Other multimedia players have their own sets of parameters; you'll have to research them, for example, by consulting the vendor's Web site. |
|
