HTML-Dateien selbst erstellen: Inhaltsverzeichnis


Multimedia, Java-Applets und Plugin-Dateien

 Videos einbinden
 Klangdateien einbinden
 Java-Applets einbinden
 Plugin-Dateien einbinden
 Objekte aller Art einbinden (zukünftig)
 MIME-Typen


MS Internet Explorer ab V2.0 Videos einbinden

Sie können eine Videodatei vom Dateityp AVI in einer HTML-Datei referenzieren. Das Video wird innerhalb des Anzeigefensters des Browsers abgespielt. Bislang kann nur der MS Internet Explorer ab Version 2.0 dieses Feature interpretieren.

Beachten Sie, daß Videodateien vergleichsweise groß sind und im WWW bei den derzeit üblichen Übertragungsraten unzumutbare Ladezeiten verursachen.

Beispiel


  <img dynsrc="hochzeit.avi">
Videos werden ähnlich wie normale Grafiken referenziert. Mit <img dynsrc=...> notieren Sie eine Video-Referenz. Hinter dem Istgleichzeichen folgt die Angabe der Videodatei. Es muß eine Datei vom Typ AVI sein. Der Dateiname muß in Anführungszeichen stehen.

Im Beispiel wird vorausgesetzt, daß sich die Video-Datei im gleichen Verzeichnis befindet wie die HTML-Datei, in der sie referenziert wird. Sie können auch Video-Dateien in anderen Verzeichnissen referenzieren. Das funktioniert genau so wie beim  Referenzieren von Grafiken.

Wiederholungsrate des Videos bestimmen

Normalerweise wird das Video genau einmal abgespielt. Sie können eine bestimmte Wiederholungsanzahl von Abspielvorgängen festlegen oder erzwingen, daß das Video unbegrenzt oft wiederholt wird.

Beispiel


  <img dynsrc="hochzeit.avi" loop=infinite>
Mit der Zusatzangabe loop= können Sie die Wiederholungsanzahl der Abspielvorgänge beeinflussen. Mit loop=infinite bewirken Sie, daß das Video solange abgespielt wird, wie sich der Anwender die HTML-Datei anzeigen läßt. Wenn Sie die Anzahl der Abspielvorgänge genau angeben wollen, geben Sie anstelle von "infinite" die gewünschte Zahl ein, z.B. loop=4.

Anzeigegröße des Videos bestimmen

Wenn Sie hierzu keine Angaben machen, wird das Video in seinem normalen Format angezeigt. Sie können die Anzeigegröße verändern.

Beispiel


  <img dynsrc="hochzeit.avi" width=640 height=480>
Mit der zusätzlichen Angabe width= dehnen bzw. komprimieren Sie die Anzeigebreite des Videos, mit height= die Anzeigehöhe des Videos. Die Wertangabe erfolgt in Pixeln. Beachten Sie, daß das Dehnen eines Videos eine gröbere Auflösung bei der Anzeige bewirkt. Wenn Sie Breite und Höhe ohne Kenntnis des normalen Videoformats festlegen, kann dies zur Verzerrung des Videos führen. In manchen Fällen (z.B. für Cartoon-Effekte) kann dies sogar wünschenswert sein.

Alternative Grafikanzeige, falls Video nicht angezeigt werden kann

Für den Fall, daß das Video nicht angezeigt werden kann (z.B. weil ein anderer Browser verwendet wird), können Sie eine Grafikdatei angeben, die anstelle des Videos angezeigt wird.

Beispiel


  <img dynsrc="hochzeit.avi" src="party.gif">
Mit der zusätzlichen Angabe src= bestimmen Sie ein Bild, das alternativ angezeigt wird. Das Bild wird nur dann angezeigt, wenn das bei dynsrc= referenzierte Video nicht angezeigt werden kann. Auf diese Weise können Sie z.B. bewirken, daß Anwender des MS Internet Explorers ein Video angezeigt bekommen, während Anwender mit anderen Browsern anstelle des Videos die angegebene Grafik sehen.

Der Dateiname der Grafik muß in Anführungszeichen stehen. Im Beispiel wird vorausgesetzt, daß sich die Grafikdatei im gleichen Verzeichnis befindet wie die HTML-Datei, in der sie referenziert wird. Sie können auch Grafikdateien in anderen Verzeichnissen referenzieren. Das funktioniert genau so wie beim gewöhnlichen  Referenzieren von Grafiken.

Startbeginn des Videos festlegen

Normalerweise wird das eingebundene Video sofort beim Aufruf der HTML-Datei abgespielt. Sie können bestimmen, daß der MS Internet Explorer erst dann mit dem Abspielen des Videos beginnt, wenn der Anwender mit dem Mauscursor über den Anzeigebereich des Videos fährt.

Beispiel


  <img dynsrc="hochzeit.avi" start=mouseover>
Mit der zusätzlichen Angabe start=mouseover legen Sie fest, daß das Video erst dann abgespielt wird, wenn der Anwender mit der Maus über den Anzeigebereich des Videos fährt. Mit der Angabe start=fileopen stellen Sie dagegen ein, daß das Video gleich beim Aufrufen der Datei abgespielt wird. Letztere Angabe ist jedoch in der Praxis nicht erforderlich, da sie der Voreinstellung entspricht.

Kontroll-Buttons für Videoablauf anzeigen

Sie können dem Anwender unterhalb des Anzeigebereichs des Videos Kontroll- Buttons zur Verfügung stellen. Mit diesen Buttons kann der Anwender das Video z.B. anhalten und fortsetzen, schnell vorwärts und rückwärts laufen lassen oder abbrechen. Diese Funktionen müssen von der Browser-Software zur Verfügung gestellt werden.

Beispiel


  <img dynsrc="hochzeit.avi" controls>
Mit der Zusatzangabe controls bewirken Sie, daß dem Anwender die Kontrollfunktionen zur Verfügung stehen.

Andere Zusatzangaben beim Einbinden von Videos

Beim Einbinden von Videos sind darüber hinaus alle Zusatzangaben möglich, die auch beim  Referenzieren von Grafiken mit dem <img>-Tag erlaubt sind. Dazu gehören beispielsweise die Angaben zum Rand (border=), zum Ausrichten (align=) oder zur alternativen Textanzeige (alt=).


 Seitenanfang


Klangdateien einbinden

Sie können eine Klangdatei vom Typ WAV in einer HTML-Datei referenzieren. Die Klangdatei wird erst dann abgespielt, wenn der Anwender dan Bereich der HTML- Datei anzeigt, in dem die Klangdatei-Referenz steht. Dies ist der Unterschied zum  Einbinden einer Hintergrundmusik.

Das Einbinden einer WAV-Datei mitten in einer HTML-Datei wird bislang nur vom NCSA Mosaic-Browser unterstützt.

Beispiel


  <sound src="demo.wav">
Mit <sound src=...> notieren Sie eine Klangdatei-Referenz. Hinter dem Istgleichzeichen folgt die Angabe der Klangdatei. Es muß eine Datei vom Typ WAV sein. Der Dateiname muß in Anführungszeichen stehen.

Im Beispiel wird vorausgesetzt, daß sich die Klangdatei im gleichen Verzeichnis befindet wie die HTML-Datei, in der sie referenziert wird. Sie können auch Klangdateien in anderen Verzeichnissen referenzieren. Das funktioniert genau so wie beim  Referenzieren von Grafiken.

Wiederholungsrate und Wiederholungsverzögerungen bestimmen

Normalerweise spielt NCSA Mosaic die Klangdatei genau einmal ab. Sie können eine bestimmte Wiederholungsanzahl von Abspielvorgängen festlegen oder erzwingen, daß die Klangdatei unbegrenzt oft wiederholt wird. Ferner können Sie bestimmen, wie viel Zeit zwischen den Abspielwiederholungen liegen soll. Die Abspielwiederholungen finden nur solange statt, wie der Anwender den Dateibereich anzeigt, in dem die Klangdatei-Referenz steht.

Beispiel


  <sound src="demo.wav" loop=infinite delay=3>
Mit der zusätzlichen Angabe loop= bestimmen Sie die Anzahl der Abspielwiederholungen. Bei loop=ininite wird die Klangdatei so oft abgespielt, bis der Anwender den Anzeigebereich mit der Klangdatei-Referenz verläßt. Wenn Sie die Anzahl der Abspielvorgänge genau angeben wollen, geben Sie anstelle von "infinite" die gewünschte Zahl ein, z.B. loop=3.

Mit der zusätzlichen Angabe delay= bestimmen Sie, wieviel Pausenzeit zwischen den Abspielwiederholungen vergehen soll. Die Angabe erfolgt in Sekunden.


 Seitenanfang


HTML 3.2Netscape ab V2.0MS IE ab V3.0 Java-Applets einbinden

Java-Applets sind ausführbare Programme, deren Bildschirmausgaben ein WWW-Browser innerhalb seines Anzeigefensters darstellen kann. Ähnlich wie eine Grafik oder ein Video wird ein Applet bei der Präsentation mit dem WWW-Browser an der Stelle angezeigt, an der es innerhalb der HTML-Datei referenziert ist. Applets können z.B. bewegte Animationen (Tricksequenzen) enthalten, Echtzeitabläufe in bewegten Grafiken darstellen (Stichwort: Börsenticker), oder Interaktionen mit dem Anwender austauschen (kleine Spiele wie Hangman oder Mastermind, Taschenrechner, grafische Simulationen aufgrund eingebbarer Parameter usw.).

Applets müssen in einer Programmiersprache geschrieben sein, die der WWW- Browser interpretieren und ausführen kann. Bislang funktioniert das nur mit der Programmiersprache Java und mit den Browsern Netscape und Hot Java. Netscape hat ab Version 2.0 einen Java-Interpreter in seinem Lieferumfang.

Java-Programme müssen in compilierter Form vorliegen, um bei der Referenzierung in einer HTML-Datei ausgeführt werden zu können.

Beispiel


 <!-- NETSCAPE-Syntax: -->
  <applet code=AnimText.class width=400 height=75 src="animtext.java">
    <param name=text value="Dieser Text wird animiert dargestellt">
    <param name=type value=wave>
    <param name=bgcolor value=255:10:30>
    <param name=fgcolor value=white>
    <param name=style value=bold>
    <param name=min value=14>
    <param name=max value=48>
  </applet>

 <!-- HOTJAVA-Syntax: -->
  <app class="AnimText" src="animtext.java"
  width=400 height=75
  text="Dieser Text wird animiert dargestellt"
  type=wave bgcolor=255:10:30 fgcolor=white style=bold
  min=14 max=48>
Wie Sie dem Beispiel entnehmen können, gibt es zwei konkurrierende Syntax- Methoden, um Java-Applets in einer HTML-Datei zu referenzieren. Die obere Syntax wird von Netscape (ab Version 2.0) interpretiert, die untere vom Sun-Browser HotJava. Die Netscape-Syntax gilt für Java-Applets, die mit dem Java-1.0-beta-Compiler erzeugt wurden, und die HotJava-Syntax für Applets, die mit dem Java-1.0-alpha-Compiler erzeugt wurden. Die Netscape-Syntax ist bei moderneren Java-Applets die maßgebliche. Auch der von HTML 3.2 unterstützte Standard bezieht sich auf diese Syntax.

Mit <applet ... > leiten Sie die Referenz eines Java- Programms für Netscape ein. Zwischen dem einleitenden Tag und dem abschließenden </applet> notieren Sie in vielen Fällen Parameter, die dem Programm beim Aufruf übergeben werden.

Für HotJava definieren Sie die Referenz mit dem Befehl <app ... >. Dieser Befehl hat kein abschließendes Tag. Parameterangaben werden in Form von Zusatzangaben innerhalb des <app>-Tags notiert.

Objektklasse des Java-Programms angeben

Die Objektklasse wird im Quelltext des Java-Programms definiert und von einer allgemeineren Objektklasse der Java-Objekthierarchie abgeleitet. Im Beispiel des obigen Programms heißt die Objektklasse AnimText. Im zugehörigen Java-Programm wird diese Klasse wie z.B. wie folgt definiert:

Beispiel


 public class AnimText extends java.applet.Applet implements Runnable
  {
   ...Definitionen und Prozeduren des Java-Programms
  }
Auf die Syntax der Java-Sprache kann hier nicht weiter eingegangen werden. Es soll lediglich der Zusammenhang zwischen der Angabe im Quelltext der HTML-Datei und der Angabe im Quelltext des Java-Programms sichtbar gemacht werden.

Bei der Netscape-Syntax bestimmen Sie die Objektklasse, der das Java-Programm angehört, mit der Zusatzangabe code= im einleitenden Tag von <applet ... >. Die Angabe hat die Form code=Objektklasse.class, im Beispiel also code=AnimText.class.

Bei der HotJava-Syntax notieren Sie stattdessen die Zusatzangabe class=. Hinter dem Istgleichzeichen geben Sie ohne weiteren Zusatz die Objektklasse an, im Beispiel also class="AnimText". Der Name sollte in Anführungszeichen stehen.

Größe des Anzeigebereichs des Java-Programms bestimmen

Mit den Zusatzangabe width= bei <applet ... > bzw. <app ... > bestimmen Sie die Breite des Anzeigebereichs, in dem das Java-Programm ablaufen soll, mit height= die Höhe des Anzeigebereichs. Beide Angaben erfolgen in Pixeln.

Parameter übergeben

Viele Java-Programme erwarten beim Aufruf Parameter, die dem Programm als Input dienen. Das ist so, wie wenn Sie beim Kommandozeilenaufruf eines Programms gleich einen Dateinamen mit angeben oder Optionen, wie sich das Programm verhalten soll.

Welche Parameter ein Java-Programm erwartet, wird in dem Programm selbst definiert. Wenn Sie ein fremdes Java-Programm einbinden wollen, müssen Sie eine Dokumentation des Programms haben bzw. wissen, welche Parameter das Programm erwartet. Sie müssen die Anzahl, die Namen und evtl. die gültigen Wertbereiche der Parameter kennen. Im obigen Beispiel erwartet das Programm 7 Parameter. Einer der Parameter ist z.B. der Parameter text. Im zugehörigen Java-Programm wird dieser Parameter beispielsweise wie folgt angefordert:

Beispiel


  public void init()
   {
     String s;
     s = getParameter("text");

     ... usw. - andere Java-Anweisungen
   }
Auf die Syntax der Java-Sprache kann hier nicht weiter eingegangen werden. Es soll lediglich der Zusammenhang zwischen der Angabe im Quelltext der HTML-Datei und der Angabe im Quelltext des Java-Programms sichtbar gemacht werden.

Bei der Netscape-Syntax zum Referenzieren von Java-Applets notieren Sie jeden zu übergebenden Parameter in einem eigenen HTML-Tag, und zwar zwischen <applet ... > und </applet>. Jeder Parameter wird durch <param name= value=> angegeben. Hinter name= geben Sie den Namen des Parameters an. Hinter value= geben Sie den gewünschten Wert des Parameters an, der dem Programm übergeben werden soll. Wenn es sich um eine Zahl handelt, notieren Sie einfach die betreffende Zahl. Wenn es sich um eine Zeichenkette handelt, notieren Sie diese und setzen Sie sie in Anführungszeichen.

Bei der HotJava-Syntax notieren Sie im <app>-Tag jeden Parameter als Zusatzangabe in der Form Parametername=Parameterwert.


 Seitenanfang


Netscape ab V1.1 Plugin-Dateien einbinden

Sie können Dateien etlicher Fremdformate in HTML-Dateien einbinden. Der WWW-Browser beim Anwender kann diese Dateien anzeigen, sofern dort ein entsprechendes  Plugin installiert ist. Wenn das Plugin installiert ist, kann der WWW-Browser die Datei so in seinem Anzeigefenster präsentieren, wie sie von dem Ursprungsprogramm erstellt wurde.

Beispiel


  <embed src="liquida.xls">

Mit <embed src=> definieren Sie Plugin-Referenz. Hinter dem Istgleichzeichen notieren Sie den gewünschten Dateinamen. Der Dateiname muß in Anführungszeichen stehen. Es kann ein beliebiger Dateityp (im Beispiel eine Excel-Datei) sein. Mit Hilfe eines Plugins, das den Browser befähigt, Excel-Dateien anzuzeigen, kann der Anwender die Datei so sehen, wie sie in Excel selbst angezeigt wird.

Im Beispiel wird vorausgesetzt, daß sich die Datei im gleichen Verzeichnis befindet wie die HTML-Datei, in der sie referenziert wird. Sie können auch Dateien in anderen Verzeichnissen referenzieren. Das funktioniert genau so wie beim  Referenzieren von Grafiken.


 Seitenanfang


Objekte aller Art einbinden (zukünftig)

Damit nicht für jede neue Form der Einbindung anderer Ressourcen ein neues HTML-Tag entsteht, arbeitet das W3-Konsortium an einem Vorschlag, der nur noch ein HTML-Tag für alle Multimedia- und Fremdprogrammreferenzen vorsieht: das <object>-Tag. Derzeit wird dieses Tag noch von keinem der bekannten WWW-Browser interpretiert.

Beispiel


  <object data="hochzeit.avi" type="application/avi"> 
    <img src="hochzeit.jpg">
  </object>
  
Mit <object> leiten Sie den Befehl ein. Die Datenquelle bestimmen Sie mit der Zusatzangabe data=. Das Referenzieren funktioniert dabei genau so wie das  Referenzieren von Grafiken (dort mit der Zusatzangabe src=).

Mit der Zusatzangabe type= legen Sie den Dateityp fest. Die Angabe besteht aus dem  MIME-Typ.

Das <object>-Tag besteht aus einem einleitenden und einem abschließenden Tag. Dazwischen können verschiedene Angaben stehen. Im Beispiel oben wird eine Grafik referenziert. WWW-Browser, die das <object>-Tag nicht kennen und es überlesen, zeigen stattdessen die Grafik an.

Weitere Zusatzangaben

Mit Hilfe weiterer Zusatzangaben soll das <object>-Tag viele andere HTML-Tags in Zukunft überflüssig machen.

Beispiel


  <object classid="java:AnimText.class" width=300 height=120> 
     <param name="Text" value="Willkommen auf meiner Homepage"> 
     <param name="Speed" value=100> 
  </object>
  
Mit der Zusatzangabe classid=java: können Sie ein Java-Applet als Objekt einbinden. Mit den Zusatzangaben width= und height können Sie die Anzeigegröße des Objekts in Pixeln bestimmen. Bei Java-Applets können Sie genau so wie bei dem  <applet>-Tag Parameter bestimmen, die dem Java-Applet beim Aufruf übergeben werden. Die Parameter stehen zwischen <object> und </object>. Sie haben die festen Zusatzangaben name= für den Namen des Parameters und value= für den Wert, der an das Applet übergeben wird.


 Seitenanfang


MIME-Typen

Die Abkürzung MIME steht für "Multipurpose Internet Mail Extensions". MIME-Typen sind ein Internet-Standard, um Dateitypen anzugeben. Im Zusammenhang mit multimedialen Elementen auf WWW-Seiten werden diese Angaben in Zukunft immer wichtiger.

MIME-Typen werden bei der Kommunikation zwischen WWW-Server und WWW-Browser eingesetzt. Sowohl der WWW-Server als auch der WWW-Browser unterhält eine Liste mit ihm bekannten Dateitypen. In vielen WWW-Browsern (z.B. bei Netscape) ist das die Liste der sogenannten "Helper Applications". Beim Übertragen vom Server zum Browser wird über das HTTP-Protokoll der MIME-Type mit übertragen. Aufgrund seiner Liste mit MIME-Typen weiß der WWW-Browser, wie er die Datei zu behandeln hat.

MIME-Typen werden nach folgendem Schema angegeben:
Kategorie/Unterkategorie

Kategorien sind z.B. "text", "image", "audio". Unterkategorien von "text" sind beispielsweise "plain" (Datei ist eine reine Textdatei) oder "html" (Datei ist eine HTML-Datei). Unterkategorien von "image" ist beispielsweise "gif" (Datei ist eine Grafik im GIF-Format).

Die folgenden MIME-Typen werden von den beiden gängigen WWW-Server-Typen CERN und NCSA unterstützt:

Dateiart Dateinamenerweiterungen MIME-Type
4.3BSD tar-Archivdatei *.tar application/x-tar
Adobe Acrobat *.pdf application/pdf
AIFF-Audio-Format *.aif,*.aiff audio/x-aiff
Audio-Datei *.au,*.snd audio/basic
AutoCAD *.dwg,*.DWG application/acad (nur NCSA)
AutoCAD *.dxf,*.DXF application/dxf (nur CERN)
Binärdateien *.bin application/octet-stream
Bourne-Shellscript *.sh application/x-sh
C-Shellscript *.csh application/x-csh
ClarisCAD *.CCAD application/clariscad (nur CERN)
CMU-Raster *.ras image/cmu-raster
CPIO-Datei (alt binär) *.bcpio application/x-bcpio
CPIO-Datei (POSIX) *.cpio application/x-cpio
CPIO-Datei (SVR4) *.sv4cpio application/x-sv4cpio
CPIO-Datei (SVR4 mit CRC) *.sv4crc application/x-sv4crc
FrameMaker MIF-Format *.mif application/x-mif (nur NCSA)
GIF-Grafik *.gif image/gif
GNU tar-Archivdatei *.gtar application/x-gtar
GNU ZIP-Archivdatei *.gzip multipart/x-gzip (nur CERN)
HTML-Datei *.html,*.htm text/html
I-DEAS-Dateien *.unv,*.UNV application/i-deas (nur CERN)
IGES-Dateien *.igs,*.iges,*.IGS,*.IGES application/iges (nur CERN)
Image Exchange Format *.ief image/ief
ISO-10303 STEP *.stp,*.STP,*.step,*.STEP application/STEP (nur CERN)
JPEG-Grafik *.jpeg,*.jpg,*.jpe image/jpeg
LaTeX-Quelldatei *.latex application/x-latex
MATRA-Prelude *.DRW application/drafting (nur CERN)
MATRA Prelude Solids *.SOL application/solids (nur CERN)
MIME Richtext *.rtx text/richtext
MPEG Videodatei *.mpeg,*.mpg,*.mpe video/mpeg
NCSA HDF Data File *.hdf application/x-hdf
PBM Anymap-Datei *.pnm image/x-portable-anymap
PBM Bitmap-Datei *.pbm image/x-portable-bitmap
PBM Graymap-Datei *.pgm image/x-portable-graymap
PBM Pixmap-Datei *.ppm image/x-portable-pixmap
POSIX-tar-Archivdatei *.ustar application/x-ustar
PostScript *.ps,*.PS,*.ai,*.eps application/postscript (nur CERN)
PTC Pro/Engineer *.prt,*.PRT application/pro_eng (nur CERN)
RBG-Grafik *.rgb image/x-rgb
QuickTime Videodatei *.qt,*.mov video/quicktime
Rich Text Format *.rtf application/rtf
SET (CAD) *.set,*.SET application/set (nur CERN)
SGI Movieplayer-Datei *.movie video/x-sgi-movie
Shell-Archiv *.shar application/x-shar
Stereolithografie *.stl,*.STL application/sla (nur CERN)
Struct.erw. Text *.etx text/x-setext
VDA-FS Surface data *.vda,*.VDA application/vda (nur CERN)
TCL-Script *.tcl application/x-tcl
TeX dvi *.dvi application/x-dvi
Texinfo (emacs) *.texinfo,*.texi application/x-texinfo
Textdatei *.txt,*.g,*.h,*.C,*.cc,*.hh,*.m,*.f90 text/plain
Textdatei mit Tabulatoren *.tsv text/tab-separated-values
TIFF-Grafik *.tif,*.tiff image/tiff
troff-Dateien *.t,*.tr,*.roff application/x-troff
troff mit MAN-Makros *.man application/x-troff-man
troff mit ME-Makros *.me application/x-troff-me
troff mit MS-Makros *.ms application/x-troff-ms
Unidata netCDF *.nc,*.cdf application/x-netcdf
WAIS-Quelldatei *.src application/x-wais-source
Windows Videodatei *.avi video/ms-video
Windows Wave Audio-Datei *.wav audio/x-wav
X-Bitmap *.xbm image/x-xbitmap
X-Pixmap *.xpm image/x-xpixmap
X-Windows Dump *.xwd image/x-windowdump
ZIP-Archivdatei *.zip multipart/x-zip (nur CERN)
ZIP-Archivdatei *.zip application/zip (nur NCSA)


 HTML-Dateien selbst erstellen: Inhaltsverzeichnis
 Seitenanfang

Blättern:
Browser-interne Ressourcen  |  Formulare


© 1996  Stefan Münz