HTML and CSS Reference
HANDS-ON PRACTICE 11.1
In this Hands-On Practice you will create a Web page similar that contains a hyperlink
to an MP3 file, as shown in Figure 11.1. The Web page will also provide a hyperlink to
a text transcript of that file to provide for accessibility.
The default MP3
player will launch in
the browser when
the visitor clicks on
“Podcast Episode 1”
Copy the WDFpodcast.mp3 and WDFpodcastTranscript.txt files from the Chapter11
folder in the student files and save them to a folder named podcast. Launch Notepad or
another text editor. Create a Web page with the heading Web Design Podcast, a hyper-
link to the MP3 file, and a hyperlink to the text transcript. Save your page as
podcast.html and test it in a browser. Try to test your page in different browsers and
browser versions. When you click on the MP3 hyperlink, an audio player (whichever
player or plug-in is configured for the browser) will launch to play the file. When you
click on the hyperlink for the text transcript, the text will display in the browser.
Compare your work to the sample in the student files (Chapter11/podcast.html).
Another method to include sound on your Web page is to embed the audio file in the
page and optionally display a control panel for the sound. In the past, the nonstandard
<embed> element was often used for this purpose because it has been well-supported by
browsers even though it is not part of the W3C HTML and XHTML recommenda-
tions. However, to follow W3C standards and to be forward-thinking, use the
<object> element to include (or "embed" ) audio and other media file types in a Web
page. Modern browsers support the <object> element.
The <object> element is a container tag and should be closed with an </object> tag.
Depending on the media type and plug-in or player to be used, additional configuration
values, called parameters, will need to be coded using the <param /> element. The
<param /> tag is a self-contained tag with two attributes: name and value. All the
<param /> tags for the object appear before the ending </object> tag. The player's
documentation will indicate if parameters are needed and the format you should use.
Table 11.1 lists the attributes of the <object> tag when used with media files. Table
11.2 lists common <param /> attribute values.