02.12.2010, 10:31

Damian Robota

Audio-Dateien mit HTML5 einbinden

Audio-Dateien werden ebenso wie Video-Dateien eingebunden. Der passende Tag heißt jedoch <audio>.

Beispiel-Programmcode:

<audio src=“DATEINAME.FORMAT“>

Ihr Browser unterstützt leider kein HTML5.

</audio>

HTML5 in Internet Explorer 9

Ebenso wie beim Video-Tag können Sie natürlich mehrere Formate der Audiodatei bereitstellen. Jeder Browser holt sich automatisch das passende Format und überspringt die anderen.

Beispiel-Programmcode für einen Audio-Clip in mehreren Dateiformaten:

<audio>

<source src="DATEINAME.mp3" type=“audio/mp3“>

<source src="DATEINAME.ogg" type=“audio/ogg“>

</audio>

Dem HTML5-Tag <audio> können Sie neben den Standardattributen noch unter anderem „autoplay“, „controls“, „loop“, „src“ oder „type“ mitgeben.

Mit „autoplay“ wird die Datei automatisch nach dem laden der Webseite abgespielt. Mit „controls“ werden wie schon beim Video-Tag die Steuerelemente (Vorspulen, Lautstärke etc.) unter der Datei angezeigt. Die Endlosschleife des Audio-Clips starten Sie mit dem Attribut „loop“. „type“ enthält den MIME-Type der Datei. Dieser dient zur genaueren Zuweisung an den Browser.

Beispiel-Programmcode für eine MP3-Datei inklusive Steuerelemente und automatischen Start:

<audio scr=“DATEINAME.mp3“ type=“audio/mp3“ autoplay controls>

Ihr Browser unterstützt leider kein HTML5.

</audio>