Multi-Medien

Jetzt kommen wir zu einem etwas heiklen Thema: Multimedia-Objekte auf Eurer Webseite. Ursprünglich war HTML rein textorientiert, die einzige Ausnahme waren Bilder mit dem img-Tag. Heute sollen jedoch auch Videos, Musik, Flash-Filme, Radio-Streams, 3D-Szenerien und vieles andere mehr in Webseiten eingebunden werden. Das ist daher nicht ganz unproblematisch, da es für solche Multimedia-Elemente zwei Ansätze gibt: Einen im HTML-Standard und einen, den die Browser tatsächlich umsetzen. Da hilft im Zweifelsfall nur in möglichst vielen Browsern auszuprobieren, ob die Seite wie gewünscht funktioniert.

Der Standard sieht ein mächtiges Tag für alle Varianten von Multimedia vor: den object-Tag. object-Tags sind Inline-Elemente. Die anzuzeigende Multimedia-Datei, von welchem Typ diese ist etc. steht in Attributen des object-Tags. Leider sind diese Attribute alles andere als einheitlich. Welche Attribute Ihr braucht und welche Werte dort hineinmüssen, müßt Ihr je nach Medium (mp3, Flash-Film, Java-Applet) nachlesen. Einige Multimedia-Editoren liefern zu den erzeugten Medien auch gleich den passenden HTML-Code.

Im object-Tag (also zwischen <object> und </object>) steht das, was der Browser anzeigt, wenn das Multimedia-Objekt nicht angezeigt werden kann. Das kann beispielsweise der Fall sein, wenn das passende Plugin fehlt. Dieser Ersatz kann beliebiger HTML-Code sein. Es ist sogar möglich, in einen object-Tag einen weiteren object-Tag hineinzuschreiben: Wenn der Browser das Video nicht als AVI anzeigen kann, klappt es vielleicht im RealMedia-Format.

Soviel zur Theorie des Standards, jetzt zur Praxis. Zum Einbinden von Java-Applets wird noch immer der eigentlich veraltete applet-Tag verwendet, für andere Multimedia-Elemente der embed-Tag. Java-Applets sind kleine Programme, die in der objektorientieren Programmiersprache Java geschrieben sind. Mit dem passenden Plugin kann der Browser diese Programme ausführen. Da ich hier keine Einführung in Java machen kann (schon allein aus Platzgründen), soll dazu ein Beispiel für einen applet-Tag genügen

<applet code="meineKlasse.class" width="600" height="400">
  <param name="language" value="de_DE">

</applet>

Im Attribut code steht der Name der Applet-Datei, width und height sind die Abmessungen des Applets im Browserfenster. Innerhalb des applet-Tags werden mit einem oder mehreren param-Tags Parameter an das Applet übergeben.

Für Multimedia-Elemente ist in der Praxis (leider) immer noch das embed-Tag zuständig. Ein embed-Tag sieht so aus

<embed src="jingle.wav">

Das embed-Element aktiviert ein (hoffentlich vorhandenes) Browser-Plugin, das die im src-Attribut angegebene Datei abspielt. Mit welchem Datei- und Medientyp wir es dabei zu tun haben, erkennt der Browser an der Dateiendung. embed kennt noch weitere Attribute: hidden entscheidet mit den möglichen Werten 'true' oder 'false' darüber, ob eine eventuelle Bedienoberfläche des abspielenden Programms angezeigt werden soll oder nicht. Ebenfalls die Werte 'true' und 'false' kennt die hoffentlich selbsterklärenden Attribute autostart und loop.

(Fast) immer und überall

Einige sogenannte Universalattribute könnt Ihr (fast) jedem HTML-Tag mitgeben. Eines davon ist bereits im Zusammenhang mit Tabellen aufgetaucht: das name-Attribut. Damit könnt Ihr einem Element einen Namen geben, mit dem Ihr es (z. B. von JavaScript aus) ansprechen könnt. Sehr ähnlich ist das ebenfalls universelle id-Attribut. Beiden Attributen könnt Ihr beliebige Namen (innerhalb des ASCII-Zeichensatzes) zuweisen. Es gibt aber auch einige Unterschiede zwischen 'name' und 'id': Ihr könnt mehreren Elementen denselben Namen zuweisen (beispielsweise bei Radiobuttons). Eine ID muß im gesamten HTML-Dokument eindeutig sein (darf nur einmal vorkommen). IDs werden auch verwendet, um einzelne Elemente gezielt mit CSS zu formatieren.

Aus einer ganzen Reihe von Anwendungsprogrammen kennt Ihr vermutlich Tooltips. Das sind kleine Textfenster, die sich öffnen, wenn die Maus einige Zeit über einem Element stehenbleibt. In HTML steht Euch dafür das title-Attribut zur Verfügung. Wie Euer Browser einen solchen Tooltip anzeigt, könnt Ihr im folgenden Beispiel ausprobieren

<p title="Tool-Tip-Text">Ein Element mit Tooltip</p>
Ein Element mit Tooltip

Die Sprache des Texts in einem Element gebt Ihr mit dem lang-Attribut an. Das gibt beispielsweise Suchmaschinen, die Eure Seite indexieren, einen Hinweis zur Einordnung. Auf die Darstellung im Browser hat dieses Attribut (noch) keinen Einfluß. Die gewünschte Sprache gebt Ihr mit Hilfe einer Reihe von standardisierten Länderkürzeln an. Beispiele

• 'de' für Deutsch
• 'en' für Englisch
• 'fr' für Französisch
• 'en' für Spanisch
• 'it' für Italienisch
• 'aa' für Afar
• 'zu' für Zulu

Es gibt auch «Unterkürzel» wie 'de_AT' für die österreichische Variante der deutschen Sprache oder 'en_US' für american english.

Die beiden Universalattribute class und style werden wir im Zusammenhang mit CSS noch ausführlich kennenlernen.