Objecten

Handleiding HTML
Inhoud   Trefwoordenregister


In dit onderdeel komen aan de orde Introductie, Elementen, Plug-ins en ActiveX controls, Afbeeldingen, Image maps, HTML-documenten, Java applets, QuickTime filmpjes, Macromedia Flash animaties en Geluidsfragmenten.


Introductie

In een HTML-document kunnen verschillende soorten objecten opgenomen (of ingesloten) worden, bijvoorbeeld afbeeldingen, andere HTML-documenten, Java applets en multimedia objecten als QuickTime filmpjes, Macromedia Flash animaties en geluidsfragmenten. Voor het insluiten van deze objecten worden verschillende elementen gebruikt:

  • Afbeeldingen worden in een document ingesloten met het IMG element. Voor het maken van aanklikbare afbeeldingen (Client-side image maps) zijn de elementen MAP en AREA beschikbaar. De beschrijving is opgenomen in het onderdeel Afbeeldingen.
  • Voor het insluiten van andere HTML-documenten kan gebruik gemaakt worden van inline frames, welke gedefinieerd worden met behulp van het IFRAME element. De beschrijving is opgenomen in het onderdeel Frames.
  • Java applets, kleine programma's geschreven in de programmeertaal Java, worden in een HTML-document ingesloten met het APPLET element. Vaak is het mogelijk de werking van het applet te beïnvloeden, door voor een aantal parameters op te geven welke waarde gebruikt moet worden. Hiervoor dient het PARAM element.
  • Multimedia objecten kunnen in een HTML-document ingesloten worden met behulp van het EMBED element.

Voor het insluiten van de verschillende objecten is in HTML 4.0 het OBJECT element geïntroduceerd. Dit element moet in de toekomst de eerder genoemde elementen gaan vervangen. Het APPLET element heeft om die reden in HTML 4.0 het label afgekeurd gekregen, terwijl bijvoorbeeld het EMBED element niet eens in de specificatie is opgenomen.

Het OBJECT element wordt ondersteund door Microsoft Internet Explorer 3.0 en hoger, Mozilla, Netscape Navigator 4.0 en hoger en Opera 4.0 en hoger. Ten behoeve van oudere browsers kan tussen de activering en beëindiging van het OBJECT element een alternatieve inhoud opgenomen worden. Deze alternatieve inhoud wordt alleen weergegeven als de browser het OBJECT element niet ondersteunt, of als het object niet kan worden weergegeven.

Browsers die het OBJECT element ondersteunen, doen dat overigens niet altijd voor alle typen objecten. Met name in Netscape Navigator 4 is de ondersteuning beperkt. Een veel groter probleem is evenwel dat de ondersteuning lang niet altijd correct is en nogal eens tot problemen in de weergave leidt (vooral de verschillende versies van Microsoft Internet Explorer en Opera hebben hier last van). Bij multimedia objecten hebben die problemen vaak een relatie met de gebruikte plug-in. Dat is een programma dat ervoor zorgt dat bepaalde typen objecten binnen de browser kunnen worden weergeven. Soms is de weergave in een browser met de ene plug-in prima, terwijl een andere voor grote problemen zorgt.

Gezien de hiervoor genoemde problemen met het OBJECT element is de verleiding groot de "oudere" elementen te blijven gebruiken. Voor sommige objecten is dat voorlopig ook de beste oplossing. Bij multimedia objecten is het echter niet mogelijk het OBJECT element links te laten liggen, omdat nieuwere versies van Microsoft Internet Explorer het insluiten ervan met behulp van het EMBED element niet meer ondersteunt.

Na een korte toelichting op de begrippen plug-ins en ActiveX controls komen in dit onderdeel van de Handleiding HTML de verschillende objecten aan de orde. Per object wordt ingegaan op de ondersteuning door de verschillende browsers van de beschikbare elementen en wordt geadviseerd welke oplossing het beste gebruikt kan worden. Daarnaast worden voorbeelden gegeven van de verschillende mogelijkheden.

Bij de beschrijving van de ondersteuning van het OBJECT element blijft Microsoft Internet Explorer 3 buiten beschouwing. In het algemeen kan gesteld worden dat de weergave van vrijwel alle objecten veel problemen kent, maar dat daar tegenover staat dat deze browser nog slechts zeer minimaal gebruikt wordt.


Elementen

Voor het insluiten van objecten in een HTML-document zijn de volgende elementen beschikbaar:

APPLET
BGSOUND
EMBED
NOEMBED
OBJECT
PARAM


De elementen en bijbehorende attributen worden beschreven in aparte documenten. Voor elk element en attribuut is aangegeven of het deel uitmaakt van een HTML-specificatie en zo ja welke. Bovendien is aangegeven en of het element of attribuut ondersteund wordt door en zo ja vanaf welke versie van Microsoft Internet Explorer, Mozilla, Netscape Navigator en Opera.


Plug-ins en ActiveX controls

Een plug-in of ActiveX control is een programma dat de functionaliteit van de browser zodanig uitbreidt, dat bepaalde typen multimedia objecten binnen het venster van de browser kunnen worden weergeven.
Plug-ins zijn oorspronkelijk ontwikkeld door Netscape, maar worden ook ondersteund door andere browsers zoals Opera en oudere versies van Microsoft Internet Explorer (t/m versie 5.5 Service Pack 1).
ActiveX controls zijn speciaal ontwikkeld voor en worden ook alleen ondersteund door Microsoft Internet Explorer. De nieuwste versies van Internet Explorer (5.5 Servicepack 2 en hoger) ondersteunen geen plug-ins meer en kunnen daardoor multimedia objecten alleen weergeven als de juiste ActiveX control is geïnstalleerd.

De plug-in voor de belangrijkste bestandsformaten voor geluidsfragmenten (wav-, au-, aif- of midi-bestanden) is bij Netscape Navigator 3 en 4 LiveAudio. Het bedieningspaneel voor LiveAudio heeft een regelaar voor het geluidsvolume, welke door de gebruiker bediend kan worden. Als afmetingen voor het object moet 144 pixels breed en 60 pixels hoog aangehouden worden. Kies je kleinere waarden, dan valt een deel van het bedieningspaneel weg.

LiveAudio bedieningspaneel LiveAudio plug-in

Bij latere versies van Netscape Navigator 4 wordt als plug-in voor geluidsfragmenten de Beatnik Player meegeleverd. De afmetingen zijn hetzelfde als bij LiveAudio: 144 pixels breed en 60 pixels hoog. De Beatnik Player heeft geen geluidsregelaar.

Beatnik Player Beatnik Player plug-in

De ActiveX control voor wav-, au- en aif-bestanden in Microsoft Internet Explorer 3 en 4 is ActiveMovie. De gebruiker kan bepalen of het control met of zonder display moet worden weergegeven. Het bedieningspaneel moet het in beide gevallen zonder geluidsregelaar doen en ook via het VOLUME attribuut is de geluidssterkte niet te regelen.
In Microsoft Internet Explorer 3 ondersteunt ActiveMovie geen midi-bestanden. Indien ook Netscape Navigator 3.0 of hoger met LiveAudio geïnstalleerd is, maakt Microsoft Internet Explorer 3 automatisch gebruik van deze plug-in. Als dit niet het geval is, zal een aparte plug-in geïnstalleerd moeten worden. ActiveMovie in Microsoft Internet Explorer 4 ondersteunt wel midi-bestanden.

ActiveMovie bedieningspaneel ActiveMovie control zonder display

ActiveMovie bedieningspaneel ActiveMovie control met display

Latere versies van Microsoft Internet Explorer maken standaard gebruik van de Windows Media Player control. Indien voor de breedte van het object 300 pixels en voor de hoogte 45 pixels aangehouden wordt, is alleen het complete bedieningspaneel te zien. Voor geluidsfragmenten is dat voldoende. Als de hoogte toeneemt krijg je ook (een deel van) het display te zien. Het bedieningspaneel beschikt over een geluidsregelaar. Als je kiest voor een kleinere breedte dan 300 pixels valt de geluidsregelaar weg.

Windows Media Player bedieningspaneel Windows Media Player control alleen bedieningspaneel

Windows Media Player bedieningspaneel Windows Media Player control


In Netscape Navigator 6.0, Mozilla en Opera zijn standaard geen plug-ins opgenomen. De gebruikers van deze browsers moeten dus zelf de benodigde plug-ins kiezen.


De Quicktime Player kan niet alleen QuickTime filmpjes weergeven, maar ook allerlei andere multimedia objecten. Als de QuickTime Player geïnstalleerd is, gebruiken Mozilla, Netscape Navigator en Opera deze bijvoorbeeld vaak voor het afspelen van bepaalde typen geluidsfragmenten. In de nieuwste versies van de QuickTime Player kan de gebruiker instellen welke typen objecten ondersteund moeten worden. Tot voor kort was er alleen een plug-in, de nieuwste versies kennen echter ook een ActiveX control. De afmetingen die je moet aanhouden, hangen af van het object. Voor geluidsfragmenten wordt alleen het bedieningspaneel weergegeven en dat heeft een breedte van 136 pixels en een hoogte van 16 pixels. Omdat je niet weet of de QuickTime plug-in gebruikt wordt, is het verstandig grotere afmetingen aan te houden, bijvoorbeeld die van de LiveAudio en Beatnik Player plug-in. Het bedieningspaneel van de QuickTime plug-in/control beschikt over een geluidsregelaar.

QuickTime Player bedieningspaneel QuickTime Player bedieningspaneel


Afbeeldingen

Voor het opnemen van afbeeldingen in een HTML-document, beschikken we al sinds lang over het IMG element. HTML 4.0 biedt de mogelijkheid in plaats daarvan het OBJECT element te gebruiken.

Het IMG element wordt door alle gangbare browsers zonder problemen ondersteund voor de verschillende typen afbeeldingen (zoals gif, jpg en png). Wat betreft de ondersteuning van het OBJECT element valt het volgende op te merken:

  • Microsoft Internet Explorer 4.0 en hoger plaatst de afbeelding in een inline frame. De afmetingen hebben betrekking op het inline frame en niet op de afbeelding. Met de originele afmetingen valt daardoor een deel van de afbeelding weg, terwijl bij een vergrote weergave de afbeelding het originele formaat houdt. Microsoft Internet Explorer 5.5 Service Pack 2 en hoger ondersteunt geen Netscape plug-ins meer. Indien afbeeldingen van het type png geassocieerd zijn met bijvoorbeeld de QuickTime player, wordt in plaats van de afbeelding slechts een leeg inline frame weergegeven. Voor Internet Explorer 5.5 Service Pack 1 geldt hetzelfde als voor versie 4.0 t/m 5.5, tenzij de Security update Q321232 van 15 mei 2002 geïnstalleerd is. In het laatste geval is de werking hetzelfde als bij Internet Explorer 5.5 Service Pack 2.
    Indien als alternatieve inhoud een tweede OBJECT element is opgenomen, geven de verschillende versies van Microsoft Internet Explorer beide objecten weer in plaats van slechts één.
  • Netscape Navigator 4 ondersteunt geen afbeeldingen via het OBJECT element, behalve als voor de weergave gebruik gemaakt wordt van een plug-in (bijvoorbeeld de QuickTime player voor png-bestanden). In dat geval is echter ook de alternatieve inhoud zichtbaar. In Netscape Navigator 6.0 en hoger en in Mozilla is de ondersteuning correct.
  • In Opera 4.0 en hoger is de ondersteuning correct. Voor afbeeldingen van het type png geldt dat echter alleen indien deze niet geassocieerd zijn met een ander programma (bijvoorbeeld de QuickTime player). Is dat wel het geval, dan wordt slechts het logo van de plug-in weergegeven.
  • Geen enkele browser ondersteunt het CODEBASE attribuut in combinatie met het DATA attribuut.

In enkele schermafdrukken is de weergave door Microsoft Internet Explorer van afbeeldingen met behulp van OBJECT element te zien.

normale weergave origineel formaat origineel formaat in Microsoft Internet Explorer normale weergave vergroting vergroting in Microsoft Internet Explorer

Geadviseerd wordt voor het opnemen van afbeeldingen niet het OBJECT element te gebruiken, maar voorlopig trouw te blijven aan het IMG element. Belangrijkste reden is de weergave in Microsoft Internet Explorer. Als je png-bestanden wilt gebruiken, komen daar nog eens problemen in Opera en in de nieuwste versies van Internet Explorer bij (en als auteur kun je nu eenmaal niet bepalen door welk programma of plug-in de afbeelding moet worden weergeven).
Een uitgebreide toelichting op het IMG element wordt gegeven in het onderdeel Afbeeldingen.

Wanneer je ondanks alle problemen in de weergave toch het OBJECT element wilt gebruiken, dan geef je met het DATA attribuut aan om welke afbeelding het gaat. Omdat het CODEBASE attribuut door geen enkele browser wordt ondersteund, moet je in het DATA attribuut ook de verwijzing naar een andere directory opnemen. Het TYPE attribuut maakt aan de browser bekend om wat voor type afbeelding het gaat. Bij het type gif is de waarde "image/gif", bij het type png "image/png" en bij het type jpg "image/jpeg". De attributen WIDTH en HEIGHT bepalen de afmetingen van de afbeelding. Met het BORDER attribuut leg je vast of wel of geen rand om de afbeelding moet worden weergegeven.

<P><OBJECT DATA="images/face.gif" WIDTH="105" HEIGHT="125" TYPE="image/gif" BORDER="0">
De browser ondersteunt het OBJECT element niet, of kan de afbeelding niet insluiten.
</OBJECT></P>

Bekijk in een nieuw venster de weergave van de afbeeldingen in de typen gif of png.

N.B. Wanneer JavaScript is toegestaan, worden deze voorbeelden geopend in een nieuw venster zonder schuifbalken. Wanneer je gebruik maakt van Microsoft Internet Explorer, kun je dan een illustratie zien van de wijze waarop deze browser het OBJECT element geïmplementeerd heeft. Hoewel het nieuwe venster en het object in het document in dat venster (de afbeelding dus) in principe niets met elkaar te maken hebben, zijn ook de schuifbalken verdwenen van het inline frame waarin de afbeelding wordt weergegeven. Wil je zien hoe de weergave van Microsoft Internet Explorer "normaal" is, dan moet je met de muis rechtsklikken op één van bovenstaande hyperlinks en kiezen voor 'Openen in nieuw venster'.


In de voorbeelden hiervoor is een tekst als alternatieve inhoud van het OBJECT element opgenomen, maar het mag ook een ander object zijn. Bijvoorbeeld een gif-bestand voor als de browser geen png-bestanden ondersteunt. De browser mag slechts één van de objecten weergeven: of het object dat opgegeven is via het eerste OBJECT element, of het alternatief.

<P><OBJECT DATA="images/face.png" WIDTH="105" HEIGHT="125" TYPE="image/png" BORDER="0">
<OBJECT DATA="images/face.gif" WIDTH="105" HEIGHT="125" TYPE="image/gif" BORDER="0">
De browser ondersteunt het OBJECT element niet, of kan de afbeelding niet insluiten.
</OBJECT>
</OBJECT></P>

Bekijk in een nieuw venster welk(e) object(en) de browser weergeeft.


Image maps

Een image maps is een afbeelding, waarvan delen aanklikbaar zijn en je leiden naar een volgend document. Een afbeelding wordt een image map, als je aan de elementen IMG of OBJECT het USEMAP attribuut toevoegt en daarnaast met behulp van de elementen MAP en AREA informatie opneemt over welke documenten bij klikken geopend moeten worden.

Een image map gemaakt met het IMG element wordt door alle gangbare browsers ondersteund. De ondersteuning van een oplossing met behulp van het OBJECT is veel beperkter:

  • Microsoft Internet Explorer 4.0 en hoger ondersteunt het USEMAP attribuut niet en geeft slechts de afbeelding weer.
  • Netscape Navigator 4 ondersteunt geen image maps via het OBJECT element. In Netscape Navigator 6.0 en hoger en in Mozilla is de ondersteuning correct.
  • Opera 4.0 en hoger ondersteunt het USEMAP attribuut niet en geeft slechts de afbeelding weer.
  • Voor alle browsers geldt dat de eerder gemaakte opmerkingen ten aanzien van de ondersteuning van afbeeldingen ook voor de image map gelden.

Gezien de beperkte ondersteuning van het USEMAP attribuut en de problemen met de weergave van afbeeldingen in met name Microsoft Internet Explorer is het niet verstandig het OBJECT element voor image maps te gebruiken.
De algemeen ondersteunde oplossing met het IMG element wordt beschreven in het onderdeel Afbeeldingen. Hier worden enkele voorbeelden met het OBJECT element gegeven, welke op dit moment alleen door Mozilla en Netscape Navigator 6.0 en hoger correct worden ondersteund.

Om van een afbeelding een image map te maken, voeg je het USEMAP attribuut aan het OBJECT element toe. De "map" waarin de informatie over de image map staat, kun je op een willekeurige plaats in het HTML-document opnemen. De opbouw is hetzelfde als bij image maps via het IMG element.

<P><OBJECT DATA="images/vormen.gif" USEMAP="#vormen" WIDTH="300" HEIGHT="150" TYPE="image/gif" BORDER="1">
De browser ondersteunt het OBJECT element niet, of kan de afbeelding niet insluiten.
</OBJECT></P>

<MAP NAME="vormen">
<AREA SHAPE="rect" COORDS="15,15,95,93" HREF="map1a.htm" ALT="Rechthoek">
<AREA SHAPE="circle" COORDS="254,61,33" HREF="map1b.htm" ALT="Cirkel">
<AREA SHAPE="poly" COORDS="100,133, 120,75, 197,84, 208,129, 164,143" HREF="map1c.htm" ALT="Veelhoek">
<AREA SHAPE="rect" COORDS="0,0,300,150" HREF="object/map1d.htm" ALT="Geen vorm">
</MAP>

Bekijk in een nieuw venster of de browser deze image map ondersteunt.


Een alternatieve manier om een image map te maken is die waarbij binnen het MAP element niet AREA gebruikt wordt, maar A. Als je de map als alternatieve inhoud van het OBJECT element opneemt, moeten browsers die de image map niet kunnen weergeven, een rijtje hyperlinks laten zien.

<P><OBJECT DATA="images/vormen.gif" USEMAP="#vormen" WIDTH="300" HEIGHT="150" TYPE="image/gif" BORDER="1">
<MAP NAME="vormen">
<P><A SHAPE="rect" COORDS="15,15,95,93" HREF="map2a.htm">Rechthoek</A>
<A SHAPE="circle" COORDS="254,61,33" HREF="map2b.htm">Cirkel</A>
<A SHAPE="poly" COORDS="100,133, 120,75, 197,84, 208,129, 164,143" HREF="map2c.htm">Veelhoek</A>
<A SHAPE="rect" COORDS="0,0,300,150" HREF="object/map2d.htm">Rest afbeelding</A></P>
</MAP>
</OBJECT></P>

Bekijk in een nieuw venster of de browser deze image map ondersteunt.

Wanneer je de hyperlinks altijd wilt zien, kun je de map ook buiten het OBJECT element plaatsen.

<P><OBJECT DATA="images/vormen.gif" USEMAP="#vormen" WIDTH="300" HEIGHT="150" TYPE="image/gif" BORDER="1"></OBJECT></P>

<MAP NAME="vormen">
<P><A SHAPE="rect" COORDS="15,15,95,93" HREF="map3a.htm">Rechthoek</A>
<A SHAPE="circle" COORDS="254,61,33" HREF="map3b.htm">Cirkel</A>
<A SHAPE="poly" COORDS="100,133, 120,75, 197,84, 208,129, 164,143" HREF="map3c.htm">Veelhoek</A>
<A SHAPE="rect" COORDS="0,0,300,150" HREF="object/map3d.htm">Rest afbeelding</A></P>
</MAP>

Van de weergave van dit voorbeeld is een schermafdruk in Mozilla gemaakt.

Voorbeeld image map via OBJECT

Bekijk in een nieuw venster of de browser het insluiten van HTML-documenten ondersteunt.


HTML-documenten

HTML 4.0 biedt twee mogelijkheden om een HTML-document in een ander HTML-document op te nemen: in een inline frame via het IFRAME element en als object met behulp van het OBJECT element.

Het IFRAME element wordt ondersteund Microsoft Internet Explorer vanaf versie 3.0, Mozilla, Netscape Navigator vanaf versie 6.0 en Opera vanaf versie 6.0. Wat betreft de ondersteuning van het OBJECT element door de verschillende browsers geldt:

  • Microsoft Internet Explorer plaatst een HTML-document altijd in een inline frame, ook als het BORDER attribuut is opgenomen met de waarde "0". Het object wordt niet herkend als de waarde van het NAME attribuut van het OBJECT element gebruikt wordt in het TARGET attribuut in het A element. Het is daardoor niet mogelijk een ingesloten HTML-document te vervangen door een ander document met een hyperlink in het hoofddocument of in een ander frame.
  • Netscape Navigator 6.1 en lager ondersteunt geen HTML-documenten via het OBJECT element. In Netscape Navigator 6.2 en hoger en in Mozilla is de ondersteuning correct.
  • In Opera 4.0 en hoger is de ondersteuning correct. Het BORDER attribuut kun je (met de waarde "0") wel gebruiken om de rand om het object weg te laten, maar niet om de dikte van de rand te bepalen.

Vooral vanwege de beperkte mogelijkheden van het vervangen van ingesloten HTML-documenten in Microsoft Internet Explorer, wordt geadviseerd het IFRAME element te gebruiken. Voor een uitgebreide toelichting op de mogelijkheden van inline frames wordt verwezen naar het onderdeel Frames. Hier wordt slechts een enkel voorbeeld opgenomen.

Bij het IFRAME element leg je met het SRC attribuut vast welk document ingesloten moet worden. De attributen WIDTH en HEIGHT bepalen de afmetingen van het inline frame. Het FRAMEBORDER attribuut geeft aan of er wel (de waarde "1") of geen (de waarde "0") rand om het frame geplaatst moet worden.

<P><IFRAME SRC="htmldoc01.htm" WIDTH="220" HEIGHT="150">
De browser ondersteunt het IFRAME element niet.
</IFRAME></P>

Als je het OBJECT element gebruikt om een HTML-document in te sluiten, leg je met het DATA attribuut vast om welk document het gaat. De attributen WIDTH, HEIGHT bepalen de afmetingen van het object en het TYPE attribuut maakt aan de browser bekend om wat voor type object het gaat (in dit geval "text/html"). Met het BORDER attribuut leg je de dikte van de rand om het object vast.

<P><OBJECT DATA="htmldoc02.htm" WIDTH="220" HEIGHT="150" TYPE="text/html">
De browser ondersteunt het OBJECT element niet, of kan het HTML-document niet insluiten.
</OBJECT></P>

Van deze voorbeelden is een schermafdruk in Mozilla gemaakt, met links de oplossing met het IFRAME element en rechts die met het OBJECT element.

Voorbeeld IFRAME en OBJECT

Bekijk in een nieuw venster of de browser het insluiten van HTML-documenten ondersteunt.

N.B. Wanneer JavaScript is toegestaan, worden dit voorbeeld geopend in een nieuw venster zonder schuifbalken. Wanneer je gebruik maakt van Microsoft Internet Explorer, kun je dan een illustratie zien van de wijze waarop deze browser het OBJECT element geïmplementeerd heeft. Hoewel het nieuwe venster en het object in het document in dat venster (het HTML-document dus) in principe niets met elkaar te maken hebben, is ook de verticale schuifbalk verdwenen van het inline frame waarin het HTML-document wordt weergegeven. Een deel van de tekst blijft daardoor onzichtbaar. Wil je zien hoe de weergave van Microsoft Internet Explorer "normaal" is, dan moet je met de muis rechtsklikken op bovenstaande hyperlink en kiezen voor 'Openen in nieuw venster'.

Bij het IFRAME element bepaal je met het FRAMEBORDER attribuut of wel (met de waarde "1") of geen (met de waarde "0") rand om het frame geplaatst moet worden. Bij het OBJECT element plaatst Microsoft Internet Explorer altijd een 3-D rand. Mozilla en Netscape Navigator 6.2 en hoger plaatsen standaard geen rand, maar met het BORDER attribuut kun je aangeven dat je een vlakke rand van een bepaalde dikte wilt. Opera plaatst standaard wel een 3-D rand, maar het BORDER attribuut met de waarde "0" zorgt ervoor dat de rand verdwijnt. Het BORDER attribuut heeft in Opera echter geen invloed op de dikte van de rand.


Wanneer je een HTML-document insluit, dan wil je het misschien ook kunnen vervangen door een ander document. Als je daarvoor een hyperlink in het hoofddocument of in een ander frame wilt gebruiken, dan moet je het NAME attribuut toevoegen aan het IFRAME of het OBJECT element.

<P><IFRAME SRC="htmldoc03.htm" WIDTH="220" HEIGHT="150" FRAMEBORDER="0" NAME="ifr">
De browser ondersteunt het IFRAME element niet.
</IFRAME></P>

<P><OBJECT DATA="htmldoc05.htm" WIDTH="220" HEIGHT="150" TYPE="text/html" BORDER="0" NAME="obj">
De browser ondersteunt het OBJECT element niet, of kan het HTML-document niet insluiten.
</OBJECT></P>

De naam die je met het NAME attribuut aan een inline frame of object geeft, kun je gebruiken in het TARGET attribuut van de hyperlink.

<A HREF="htmldoc08.htm" TARGET="obj">Document 3</A>

Als je gebruik maakt van de oplossing met het OBJECT element, kun je in Microsoft Internet Explorer het ingesloten HTML-document alleen vervangen via een hyperlink in het ingesloten document zelf. In Mozilla, Netscape Navigator 6.2 en hoger en Opera werkt met ook met een hyperlink in het hoofddocument of in een ander frame.

Van de weergave van dit voorbeeld is een schermafdruk in Mozilla gemaakt.

Voorbeeld IFRAME en OBJECT

Bekijk in een nieuw venster of de browser een ingesloten document kan vervangen.


Java applets

Een Java applet is een klein programma geschreven in de programmeertaal Java. Een applet kan op allerlei manieren extra functionaliteit op een webpagina bieden, bijvoorbeeld teksteffecten, navigatiemogelijkheden en spelletjes.

Een Java applet bestaat uit minimaal één bestand met de extensie ".class". De bestanden die samen het applet vormen kunnen ook opgenomen worden in een archief-bestand. Het standaard archief-formaat voor Java bestanden is "jar" (Java ARchive), maar ook gewone zip-bestanden worden ondersteund, mits de erin opgenomen bestanden niet zijn gecomprimeerd.

HTML 4.0 kent twee elementen om een Java applet in een document op te nemen: het tot nu toe algemeen gebruikte APPLET element en het OBJECT element dat in de toekomst het APPLET element moet gaan vervangen.

Het APPLET element wordt door alle gangbare zonder problemen ondersteund (mits in de instellingen van de browser de uitvoering van Java is toegestaan). Wat betreft de ondersteuning van het OBJECT element valt het volgende op te merken:

  • In Microsoft Internet Explorer 4.0 en hoger is de ondersteuning correct. Het CODEBASE attribuut wordt echter niet ondersteund en dat betekent dat het applet alleen wordt ingesloten als het zich in dezelfde directory bevindt als het HTML-document. Bovendien wordt het ARCHIVE attribuut niet ondersteund, waardoor het applet niet als archief-bestand kan worden opgenomen.
    Indien als alternatieve inhoud een tweede OBJECT element is opgenomen, geven de verschillende versies van Microsoft Internet Explorer beide objecten weer in plaats van slechts één.
  • Netscape Navigator 4 geeft het applet zelf goed weer, maar toont ook de alternatieve inhoud. In Netscape Navigator 6.0 en hoger en in Mozilla is de ondersteuning correct. In alle gevallen is het noodzakelijk de attributen WIDTH en HEIGHT op te nemen.
  • Het insluiten van Java applets met behulp van het OBJECT element wordt niet ondersteund door Opera 4. In Opera 5.0 en hoger is de ondersteuning correct, alleen moet in Opera 6 het CODETYPE attribuut zijn opgenomen (waarbij het overigens niet uitmaakt wat de waarde van het attribuut is).

Wanneer je op veilig wilt spelen, dan is de beste oplossing voorlopig het APPLET element te blijven gebruiken. Als je accepteert dat het applet niet wordt weergegeven in Netscape Navigator 3 en Opera 4, dan is het OBJECT element ook een goede optie. Je moet dan wel de attributen WIDTH, HEIGHT en CODETYPE opnemen en er voor zorgen dat het gebruik van de attributen CODEBASE en ARCHIVE niet nodig is.


Wanneer je het APPLET element gebruikt om een Java applet in een document in te sluiten, dan geef je met het CODE attribuut aan om welke applet het gaat. Alleen de bestandsnaam wordt opgenomen, waarbij de extensie (.class) mag worden weggelaten. Het CODEBASE attribuut gebruik je, als het applet zich niet in dezelfde directory als het document bevindt. Het geeft aan waar (in welke subdirectory) het applet gevonden kan worden. De afmetingen van het applet moeten worden vastgelegd met de attributen WIDTH en HEIGHT.

Vaak moet voor het applet voor één of meer parameters een waarde opgegeven worden. Dat gebeurt met behulp van het PARAM element. Het NAME attribuut geeft aan om welke parameter het gaat, met het VALUE attribuut wordt de waarde vastgelegd. Of en welke parameters gebruikt kunnen of moeten worden, hangt af van het applet. De PARAM elementen worden geplaatst binnen het APPLET element.

Tussen de activering en de beëindiging van het APPLET element kan na de benodigde PARAM elementen ook een alternatieve inhoud opgenomen worden, voor als de browser Java niet ondersteunt of de ondersteuning door de bezoeker is uitgezet. In het volgende voorbeeld is met behulp van het IMG element als alternatieve inhoud een bewegende afbeelding (animated gif) opgenomen.

<P><APPLET CODE="FunScroll" CODEBASE="applet/" WIDTH="275" HEIGHT="100">
<PARAM NAME="font" VALUE="Helvetica">
<PARAM NAME="size" VALUE="13">
<PARAM NAME="delay" VALUE="80">
<PARAM NAME="bgcolor" VALUE="#336699">
<PARAM NAME="fgcolor" VALUE="#FFFFFF">
<PARAM NAME="frameWidth" VALUE="0">
<PARAM NAME="line0" VALUE="<20><size=36>Handleiding\nHTML<fade>">
<PARAM NAME="line1" VALUE="<30><fade>Een Nederlandse handleiding,\nbij het maken van HTML-pagina's.">
<PARAM NAME="line2" VALUE="<20><typed>Met de nieuwste mogelijkheden,\neen groot aantal voorbeelden,\nde ondersteuning door browsers\nen Cascading Style Sheets.">
<IMG SRC="applet1.gif" WIDTH="274" HEIGHT="99" ALT="" BORDER="0">
</APPLET></P>

Bekijk in een nieuw venster hoe het applet wordt weergegeven.

Wanneer de browser Java niet ondersteunt, krijgt de bezoeker de bewegende afbeelding te zien:


Het bestand dat via het CODE attribuut van het APPLET element is gespecificeerd en eventuele andere bestanden, welke deel uitmaken van het applet, kunnen ook opgenomen worden in een archief-bestand. Aan het APPLET element wordt in dat geval het ARCHIVE attribuut toegevoegd , met als waarde de naam van het archief-bestand. Het CODEBASE attribuut wordt aan het APPLET element toegevoegd, als het archief-bestand zich niet in dezelfde directory als het document bevindt. Het archief-bestand is een zip-bestand, maar de erin opgenomen bestanden mogen niet gecomprimeerd zijn. Door het gebruik van een archief-bestand kan de downloadtijd beperkt blijven, omdat alle benodigde bestanden in één keer aangevraagd worden.

Als voorbeeld wordt gebruik gemaakt van het iScroll applet.

<P><APPLET CODE="iscroll" CODEBASE="applet-zip/" WIDTH="480" HEIGHT="30" ARCHIVE="iscroll.zip">
<PARAM NAME="Notice" VALUE="Applet by www.CodeBrain.com">
<PARAM NAME="Text" VALUE="Handleiding HTML - een onmisbare hulp op het gebied van HTML en CSS - ">
<PARAM NAME="TextColor" VALUE="#FFFFFF">
<PARAM NAME="BackgroundColor" VALUE="#336699">
<PARAM NAME="VerticalBias" VALUE="0">
<PARAM NAME="FontName" VALUE="helvetica">
<PARAM NAME="FontStyle" VALUE="0">
<PARAM NAME="Speed" VALUE="25">
<PARAM NAME="Pause" VALUE="1000">
</APPLET></P>

Van de weergave van dit voorbeeld is een schermafdruk in Mozilla gemaakt.

Voorbeeld Java applet

Bekijk in een nieuw venster of het Java applet wordt weergegeven.


Wanneer je het OBJECT element gebruikt om een Java applet in te sluiten, moet je het CLASSID attribuut opnemen om te specificeren om welk object het gaat. De naam van het object wordt daarbij voorafgegaan door de aanduiding dat de gebruikte methode "java" is (en niet bijvoorbeeld "http") en de extensie ".class" wordt nu wel opgenomen. Met het CODETYPE geef je aan om wat voor soort object het gaat.
De parameters voor het Java applet worden vastgelegd met behulp van het PARAM element. Het NAME attribuut geeft aan om welke parameter het gaat, met het VALUE attribuut wordt de waarde vastgelegd. Welke parameters gebruikt kunnen of moeten worden, hangt af van het applet. De verschillende PARAM elementen worden geplaatst binnen het OBJECT element, vóór een eventuele alternatieve inhoud.

<P><OBJECT CLASSID="java:Bounce.class" WIDTH="275" HEIGHT="75" CODETYPE="application/java">
<PARAM NAME="message" VALUE="Handleiding HTML">
De browser ondersteunt het OBJECT element niet, of kan het Java applet niet insluiten.</OBJECT></P>

Bekijk in een nieuw venster of het Java applet wordt weergegeven.

Wanneer het applet zich niet in dezelfde directory bevindt als het HTML-document, moet je het CODEBASE attribuut opnemen, om aan te geven waar de bestanden zich bevinden. Bijvoorbeeld in de subdirectory "applet":

<P><OBJECT CLASSID="java:FunScroll.class" CODEBASE="objecten/" WIDTH="275" HEIGHT="750" CODETYPE="application/java">
<PARAM NAME="font" VALUE="Helvetica">
<PARAM NAME="size" VALUE="13">
<PARAM NAME="delay" VALUE="80">
<PARAM NAME="bgcolor" VALUE="#336699">
<PARAM NAME="fgcolor" VALUE="#FFFFFF">
<PARAM NAME="frameWidth" VALUE="0">
<PARAM NAME="line0" VALUE="<20><size=36>Handleiding\nHTML<fade>">
<PARAM NAME="line1" VALUE="<30><fade>Een Nederlandse handleiding,\nbij het maken van HTML-pagina's.">
<PARAM NAME="line2" VALUE="<20><typed>Met de nieuwste mogelijkheden,\neen groot aantal voorbeelden,\nde ondersteuning door browsers\nen Cascading Style Sheets.">
De browser ondersteunt het OBJECT element niet, of kan het Java applet niet insluiten.</OBJECT></P>

Bekijk in een nieuw venster of het Java applet wordt weergegeven.

Ook bij het OBJECT element kun je het applet in een archief-bestand plaatsen:

<P><OBJECT CLASSID="java:iscroll.class" CODEBASE="applet-zip/" WIDTH="480" HEIGHT="20" CODETYPE="application/java" ARCHIVE="iscroll.zip">
<PARAM NAME="Notice" VALUE="Applet by www.CodeBrain.com">
<PARAM NAME="Text" VALUE="Handleiding HTML - een onmisbare hulp op het gebied van HTML en CSS - ">
<PARAM NAME="TextColor" VALUE="#FFFFFF">
<PARAM NAME="BackgroundColor" VALUE="#336699">
<PARAM NAME="VerticalBias" VALUE="0">
<PARAM NAME="FontName" VALUE="helvetica">
<PARAM NAME="FontStyle" VALUE="0">
<PARAM NAME="Speed" VALUE="25">
<PARAM NAME="Pause" VALUE="1000">
De browser ondersteunt het OBJECT element niet, of kan het Java applet niet insluiten.</OBJECT></P>

Bekijk in een nieuw venster of het Java applet wordt weergegeven.

Omdat Microsoft Internet Explorer de attributen CODEBASE en ARCHIVE niet ondersteund, kun je bij gebruik van het OBJECT element het applet het beste in dezelfde directory plaatsen als het HTML-document en geen archief-bestand gebruiken.

Het in de voorbeelden gebruikte FunScroll applet is ontwikkeld door Jan Andersson, het iScroll applet door CodeBrain.com.


QuickTime filmpjes

Voor het insluiten van QuickTime filmpjes heb je de beschikking over de elementen EMBED en OBJECT. Bij beide elementen kun je gebruik maken van een zogenaamde Netscape plug-in, bij het OBJECT element daarnaast ook van een ActiveX control. Het EMBED element is niet opgenomen in HTML 4.0, het OBJECT element wel.

Het insluiten van QuickTime filmpjes met behulp van het EMBED element wordt door alle gangbare browsers ondersteund, behalve door de nieuwste versies van Microsoft Internet Explorer. Omdat Microsoft Internet Explorer 5.5 Service Pack 2 en hoger geen Netscape plug-ins meer ondersteunt, moet nu een oplossing gekozen worden waarbij via het OBJECT element gebruik gemaakt wordt van de QuickTime ActiveX control (het EMBED element kan overigens wel weer gebruikt worden wanneer de QuickTime ActiveX control eenmaal geïnstalleerd is op het systeem van de bezoeker; als auteur ben je daarvan echter niet op de hoogte).

Wat betreft het OBJECT element geldt dat de oplossing met behulp van een ActiveX control alleen ondersteund wordt door alle versies van Microsoft Internet Explorer. Voor de oplossing met de Netscape plug-in geldt het volgende:

  • Microsoft Internet Explorer versie 4.0 t/m 5.5 ondersteunt het object correct, maar in enkele subversies alleen als het TYPE attribuut is opgenomen. Microsoft Internet Explorer 5.5 Service Pack 2 en hoger ondersteunt geen Netscape plug-ins meer. In plaats van de alternatieve inhoud van het OBJECT element, wordt echter een leeg inline frame weergegeven. Voor Internet Explorer 5.5 Service Pack 1 geldt hetzelfde als voor versie 4.0 t/m 5.5, tenzij de Security update Q321232 van 15 mei 2002 geïnstalleerd is. In het laatste geval is de werking hetzelfde als bij Internet Explorer 5.5 Service Pack 2.
  • Netscape Navigator 4 geeft het filmpje zelf goed weer, maar toont ook de alternatieve inhoud. In Netscape Navigator 6.0 en hoger en in Mozilla is de ondersteuning correct. Indien geen afmetingen worden opgegeven, houdt Netscape Navigator 4 50x50 pixels aan, in Netscape Navigator 6 is dit 240x200 pixels, terwijl in Mozilla niets zichtbaar is.
  • Voor Opera 4.0 en hoger geldt dat meestal alleen het logo van de plug-in te zien is.

Wanneer je er verzekerd van wilt zijn dat QuickTime filmpjes in alle browsers goed worden weergegeven, dan is er slechts één oplossing: een combinatie van de elementen OBJECT en EMBED. Ten behoeve van Microsoft Internet Explorer geef je met behulp van het OBJECT element aan dat de QuickTime ActiveX control gebruikt moet worden. Als alternatieve inhoud van het OBJECT element neem je EMBED element op, dat ervoor zorgt dat andere browsers de QuickTime plug-in kunnen gebruiken. Je moet bij deze oplossing wel voor lief nemen dat je gebruik maakt van een element, dat niet tot HTML 4.0 behoort.


Bij het OBJECT element legt het CLASSID attribuut vast dat voor de weergave van het object gebruik gemaakt moet worden van de QuickTime ActiveX control. Het CODEBASE attribuut legt vast waar het QuickTime ActiveX control gevonden kan worden. Het TYPE attribuut maakt aan de browser bekend om wat voor type object het gaat. De waarden van deze drie attributen zijn voor alle filmpjes hetzelfde.
De attributen WIDTH, HEIGHT bepalen de afmetingen van het object (filmpje en bedieningspaneel). Deze attributen moet je opnemen, omdat sommige browsers anders het object niet of niet volledig weergeven.
Het PARAM element gebruik je om aan te geven om welk QuickTime filmpje het gaat.

<P><OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="136" HEIGHT="176" TYPE="video/quicktime" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
<PARAM NAME="src" VALUE="test.mov">
...
</OBJECT></P>

Van de weergave van dit voorbeeld is een schermafdruk in Microsoft Internet Explorer gemaakt.

QuickTime filmpje

Bekijk in een nieuw venster of het QuickTime filmpje wordt weergegeven.

Bij het EMBED element bepaalt het SRC attribuut welk filmpje ingesloten moet worden. Met de attributen WIDTH en HEIGHT worden de afmetingen van het object vastgelegd. Het TYPE attribuut maakt weer aan de browser bekend om wat voor type object het gaat. Het is belangrijk dit attribuut altijd op te nemen, omdat sommige browsers het object alleen kunnen insluiten als het juiste type is opgegeven.

<EMBED SRC="test.mov" WIDTH="136" HEIGHT="176" TYPE="video/quicktime"></EMBED>

Bekijk in een nieuw venster het QuickTime filmpje met behulp van de QuickTime plug-in kan weergeven.

Om het QuickTime filmpje door alle browsers te laten weergeven, moet je het EMBED element als alternatieve inhoud van het OBJECT element opnemen:

<P><OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="136" HEIGHT="176" TYPE="video/quicktime" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
<PARAM NAME="src" VALUE="test.mov">
<EMBED SRC="test.mov" WIDTH="136" HEIGHT="176" TYPE="video/quicktime"></EMBED>
</OBJECT></P>

Bekijk in een nieuw venster of de browser het QuickTime filmpje kan weergeven.

QuickTime filmpjes kunnen alleen worden weergeven als de QuickTime player geïnstalleerd is. Indien dat niet het geval is, wordt in Microsoft Internet Explorer gevraagd of dat alsnog moet gebeuren. Ten behoeve van browsers die gebruik maken van het EMBED element, kun je het PLUGINSPAGE attribuut opnemen om aan te geven waar de plug-in verkregen kan worden.

<P><OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="136" HEIGHT="176" TYPE="video/quicktime" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
<PARAM NAME="src" VALUE="test.mov">
<EMBED SRC="test.mov" WIDTH="136" HEIGHT="176" TYPE="video/quicktime" PLUGINSPAGE="http://www.apple.com/quicktime/download/"></EMBED>
</OBJECT></P>


Voor QuickTime filmpjes bestaan er een aantal mogelijkheden om de weergave te regelen. Voor het OBJECT element doe je dat door het opnemen van extra PARAM elementen, terwijl je aan het EMBED element een aantal plug-in specifieke attributen moet toevoegen. Voor een uitgebreid overzicht van de verschillende mogelijkheden kun je op de site van QuickTime terecht.
In het volgende voorbeeld zijn enkele van deze mogelijkheden toegepast. Voor het OBJECT element is met de parameter "autoplay" vastgelegd of het filmpje al dan niet direct bij het openen van het document afgespeeld moet worden en met de parameter "volume" wat het geluidsniveau moet zijn. Om dezelfde mogelijkheden te benutten bij de alternatieve inhoud voeg je aan het EMBED element de attributen AUTOPLAY en VOLUME toe.

<P><OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="136" HEIGHT="176" TYPE="video/quicktime" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
<PARAM NAME="src" VALUE="test.mov">
<PARAM NAME="autoplay" VALUE="false">
<PARAM NAME="volume" VALUE="25">
<EMBED SRC="test.mov" WIDTH="136" HEIGHT="176" TYPE="video/quicktime" PLUGINSPAGE="http://www.apple.com/quicktime/download/" AUTOPLAY="false" VOLUME="25"></EMBED>
</OBJECT></P>

Bekijk het QuickTime filmpje in een nieuw venster.


Macromedia Flash animaties

Voor het insluiten van Macromedia Flash animaties heb je de beschikking over de elementen EMBED en OBJECT. Bij beide elementen kun je gebruik maken van een zogenaamde Netscape plug-in, bij het OBJECT element daarnaast ook van een ActiveX control.

Het insluiten van Macromedia Flash animaties met behulp van het EMBED element wordt door alle gangbare browsers ondersteund, behalve door de nieuwste versies van Microsoft Internet Explorer. Omdat Microsoft Internet Explorer 5.5 Service Pack 2 en hoger geen Netscape plug-ins meer ondersteunt, moet nu een oplossing gekozen worden waarbij via het OBJECT element gebruik gemaakt wordt van de Macromedia Flash ActiveX control (het EMBED element kan overigens wel weer gebruikt worden wanneer de Macromedia Flash ActiveX control eenmaal geïnstalleerd is op het systeem van de bezoeker; hoewel de kans daarop groot is, omdat het control meestal gelijk met Microsoft Internet Explorer geïnstalleerd wordt, kun je er als auteur nooit zeker van zijn).

Wat betreft het OBJECT element geldt dat de oplossing met behulp van een ActiveX control alleen ondersteund wordt door alle versies van Microsoft Internet Explorer. Voor de oplossing met de Netscape plug-in geldt het volgende:

  • Microsoft Internet Explorer versie 4.0 t/m 5.5 ondersteunt het object, maar in enkele subversies alleen als het TYPE attribuut is opgenomen, terwijl soms met het TYPE attribuut de plug-in weer niet gevonden wordt. Microsoft Internet Explorer 5.5 Service Pack 2 en hoger ondersteunt geen Netscape plug-ins meer. In plaats van de alternatieve inhoud van het OBJECT element, wordt echter een leeg inline frame weergegeven. Voor Internet Explorer 5.5 Service Pack 1 geldt hetzelfde als voor versie 4.0 t/m 5.5, tenzij de Security update Q321232 van 15 mei 2002 geïnstalleerd is. In het laatste geval is de werking hetzelfde als bij Internet Explorer 5.5 Service Pack 2.
  • Netscape Navigator 4 geeft de animatie zelf goed weer, maar toont ook de alternatieve inhoud. In Netscape Navigator 6.0 en hoger en in Mozilla is de ondersteuning correct. Indien geen afmetingen worden opgegeven, houdt Netscape Navigator 4 50x50 pixels aan, in Netscape Navigator 6 is dit 240x200 pixels, terwijl in Mozilla niets zichtbaar is.
  • Opera 4.0 crasht als geprobeerd wordt een Flash object te openen, terwijl er in hogere versies niets wordt weergegeven.

Wanneer je er verzekerd van wilt zijn dat Macromedia Flash animaties in alle browsers goed worden weergegeven, dan is er net als bij QuickTime filmpjes slechts één oplossing: een combinatie van de elementen OBJECT en EMBED. Ten behoeve van Microsoft Internet Explorer geef je met behulp van het OBJECT element aan dat de Macromedia Flash ActiveX control gebruikt moet worden. Als alternatieve inhoud van het OBJECT element neem je EMBED element op, dat ervoor zorgt dat andere browsers de Macromedia Flash plug-in kunnen gebruiken.

Voor het OBJECT element legt het CLASSID attribuut vast dat voor de weergave van het object gebruik gemaakt moet worden van de Macromedia Flash ActiveX control. Het CODEBASE attribuut legt vast waar het Macromedia Flash ActiveX control gevonden kan worden. Het TYPE attribuut maakt aan de browser bekend om wat voor type object het gaat. De waarden van deze drie attributen zijn voor alle animaties hetzelfde.
De attributen WIDTH, HEIGHT bepalen de afmetingen van het object. Deze attributen moet je opnemen, omdat sommige browsers anders het object niet of niet volledig weergeven.
Het PARAM element gebruik je om aan te geven om welke Flash animaties het gaat.

Als alternatieve inhoud voor het OBJECT element neem je het EMBED element op. Het SRC attribuut bepaalt welke animatie ingesloten moet worden. De betekenis van de attributen WIDTH, HEIGHT en TYPE is hetzelfde als bij het OBJECT element. Het PLUGINSPAGE attribuut gebruik je om aan te geven waar de plug-in verkregen kan worden.

Voor Macromedia Flash animaties bestaan er een aantal mogelijkheden om de weergave te regelen. Voor het OBJECT element doe je dat door het opnemen van extra PARAM elementen, terwijl je aan het EMBED element een aantal plug-in specifieke attributen moet toevoegen. Voor een uitgebreid overzicht van de verschillende mogelijkheden kun je op de site van Macromedia terecht.
In het volgende voorbeeld zijn enkele van deze mogelijkheden toegepast. Voor het OBJECT element is met de parameter "play" vastgelegd of de animatie al dan niet direct bij het openen van het document afgespeeld moet worden en met de parameter "loop" of de animatie continue moet blijven doorlopen. De parameter "quality" bepaalt de kwaliteit van de weergave. Om dezelfde mogelijkheden te benutten bij de alternatieve inhoud voeg je aan het EMBED element de attributen PLAY, LOOP en QUALITY toe.

<OBJECT CLASSID="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" WIDTH="128" HEIGHT="96" TYPE="application/x-shockwave-flash" CODEBASE="http://download.macromedia.com/pub/shockwave/
cabs/flash/swflash.cab#version=6,0,23,0">
<PARAM NAME="movie" VALUE="test.swf">
<PARAM NAME="play" VALUE="true">
<PARAM NAME="loop" VALUE="true">
<PARAM NAME="quality" VALUE="high">
<EMBED SRC="test.swf" WIDTH="128" HEIGHT="96"
TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer" PLAY="true" LOOP="true" QUALITY="high"></EMBED>
</OBJECT>

Vanwege de lengte is in bovenstaande voorbeeldcode de waarde van het CODEBASE attribuut onderbroken door een harde overgang naar een volgende regel. In werkelijkheid moet je dit uiteraard niet doen.

Van de weergave van dit voorbeeld is een schermafdruk in Mozilla gemaakt.

Macromedia Flash animatie

Bekijk in een nieuw venster of de Macromedia Flash animatie wordt weergegeven.


Geluidsfragmenten

Voor het opnemen geluidsfragmenten in een HTML-document wordt tot nu toe in vrijwel alle gevallen gebruik gemaakt van het niet in HTML 4.0 opgenomen EMBED element. HTML 4.0 biedt de mogelijkheid dat ook te doen met behulp van het OBJECT element. Voor de weergave van een geluidsfragment moet de browser beschikken over de juiste plug-in of in het geval van Microsoft Internet Explorer van de juiste ActiveX control.

Het insluiten van geluidsfragmenten met behulp van het EMBED element wordt door alle gangbare browsers ondersteund. Alleen de nieuwste versies van Microsoft Internet Explorer kunnen er problemen mee hebben als een plug-in (bijvoorbeeld de QuickTime Media Player) zich geassocieerd heeft met het betreffende type geluidsbestand. Dat wil vooral nogal eens het geval zijn met midi-bestanden. De oorzaak van deze problemen is dat Microsoft Internet Explorer 5.5 Service Pack 2 en hoger geen Netscape plug-ins meer ondersteund. Als alternatief kun je een oplossing kiezen, waarbij door Microsoft Internet Explorer via het OBJECT element gebruik gemaakt wordt van een ActiveX control.
Ten behoeve van Opera 4 en 5 is het noodzakelijk dat je aan het EMBED element het TYPE attribuut toevoegt.

Wat betreft het OBJECT element geldt het volgende:

  • Geluidsfragmenten die ingesloten worden via het DATA attribuut en niet geassocieerd zijn met speciale plug-in, worden in veel situaties weergegeven in een externe versie van de Windows Media Player. Indien geluidsfragmenten wel geassocieerd zijn met een plug-in worden ze in Microsoft Internet Explorer versie 4.0 t/m 5.5 meestal correct weergegeven. Microsoft Internet Explorer 5.5 Service Pack 2 en hoger ondersteunt geen Netscape plug-ins meer. In plaats van de alternatieve inhoud van het OBJECT element, wordt echter een leeg inline frame weergegeven. De ondersteuning is wel correct als gebruik gemaakt wordt van een ActiveX control. Voor Internet Explorer 5.5 Service Pack 1 geldt hetzelfde als voor versie 4.0 t/m 5.5, tenzij de Security update Q321232 van 15 mei 2002 geïnstalleerd is. In het laatste geval is de werking hetzelfde als bij Internet Explorer 5.5 Service Pack 2.
    De oplossing waarbij via het CLASSID attribuut een ActiveX control wordt gebruikt, wordt door alle versies van Microsoft Internet Explorer correct ondersteund.
  • Netscape Navigator 4 geeft het geluidsfragment zelf goed weer, maar toont ook de alternatieve inhoud. In Netscape Navigator 6.0 en hoger en in Mozilla is de ondersteuning correct. Indien geen afmetingen worden opgegeven, houdt Netscape Navigator 4 50x50 pixels aan, in Netscape Navigator 6 is dit 240x200 pixels, terwijl in Mozilla niets zichtbaar is.
  • Voor Opera 4.0 en hoger geldt dat afhankelijk van de geïnstalleerde plug-in een geluidsfragment niet ondersteund wordt, de plug-in niet gevonden wordt, of dat alleen het logo van de plug-in te zien is.

Voor geluidsfragmenten is het EMBED element in veel gevallen een goede oplossing. Met name in de nieuwste versies van Microsoft Internet Explorer wordt de (correcte) weergave echter sterk beïnvloed door de plug-in waarmee ze al dan niet geassocieerd is. Als auteur ben je echter niet op de hoogte op de situatie op het systeem van de bezoeker. Wanneer je wilt dat geluidsfragmenten in alle browsers goed worden weergegeven, kan het daarom verstandig zijn te kiezen voor een combinatie van de elementen OBJECT en EMBED. Ten behoeve van Microsoft Internet Explorer geef je met behulp van het OBJECT element aan dat bijvoorbeeld de Windows Media Player of de QuickTime ActiveX control gebruikt moet worden. Als alternatieve inhoud van het OBJECT element neem je EMBED element op, dat ervoor zorgt dat andere browsers een plug-in kunnen gebruiken.

Achtereenvolgens wordt nu ingegaan op de oplossing met een plug-in via het EMBED element, de oplossing met een ActiveX control via het OBJECT element en de combinatie. De oplossing met een plug-in via het OBJECT element blijft, gezien de beperkte en weinig correcte ondersteuning, verder buiten beschouwing.


Van het EMBED element moet altijd SRC opgenomen worden, om te specificeren welk geluidsfragment moet worden afgespeeld. In veel gevallen zijn ook de attributen WIDTH en HEIGHT noodzakelijk, om te voorkomen dat het bedieningspaneel niet of niet volledig te zien is. Neem deze attributen daarom altijd op, ook al werk je zelf met een plug-in waarvoor ze niet nodig zijn. Voor de LiveAudio plug-in zijn de noodzakelijk waarden voor de attributen WIDTH en HEIGHT respectievelijk "144" en "60". Voor de meeste andere plug-ins voldoen deze waarden ook, al is de weergave soms wat minder fraai (bijvoorbeeld bij de Windows Media Player Control). Het TYPE attribuut maakt aan de browser bekend om wat voor type object het gaat. Voor het geval de bezoeker geen geschikte plug-in heeft geïnstalleerd, kun je aan de browser kenbaar maken waar deze gevonden kan worden. Dat doe je door het PLUGINSPAGE attribuut aan het EMBED element toe te voegen. In dit voorbeeld wordt verwezen naar de QuickTime Player.

<EMBED SRC="test.wav" WIDTH="144" HEIGHT="60" TYPE="audio/wav" PLUGINSPAGE="http://www.apple.com/quicktime/download/"></EMBED>

<EMBED SRC="test.mid" WIDTH="144" HEIGHT="60" TYPE="audio/midi" PLUGINSPAGE="http://www.apple.com/quicktime/download/"></EMBED>

Bekijk in een nieuw venster de weergave van geluidsfragmenten in de typen wav of midi.

Alleen door Microsoft Internet Explorer wordt de oplossing met een ActiveX control ondersteund. Het CLASSID attribuut van het OBJECT element legt vast van welk ActiveX control gebruik gemaakt moet worden. In het volgende voorbeeld is dat de Windows Media Player, maar het had ook de QuickTime Player kunnen zijn. Het CODEBASE attribuut legt vast waar het ActiveX control gevonden kan worden.
De attributen WIDTH, HEIGHT bepalen de afmetingen van het object. Het is verstandig deze attributen altijd op te nemen. Het TYPE attribuut maakt aan de browser bekend om wat voor type object het gaat.
Het PARAM element gebruik je om aan te geven om welke geluidsfragment het gaat. Bij de Windows Media Player ActiveX control is de naam van de parameter "filename".

<OBJECT CLASSID="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" WIDTH="300" HEIGHT="45" CODEBASE="http://activex.microsoft.com/activex/controls/
mplayer/en/nsmp2inf.cab" TYPE="application/x-oleobject">
<PARAM NAME="filename" VALUE="test.wav">
De browser ondersteunt het OBJECT element niet, of kan het geluidsfragment niet insluiten.
</OBJECT>

Vanwege de lengte is in bovenstaande voorbeeldcode de waarde van het CODEBASE attribuut onderbroken door een harde overgang naar een volgende regel. In werkelijkheid moet je dit uiteraard niet doen.
Voor een geluidsfragment van het type "midi" is de code hetzelfde, met uitzondering uiteraard van de waarde van het VALUE attribuut element van het PARAM element.

Bekijk in een nieuw venster de weergave van geluidsfragmenten in de typen wav of midi.

Om tot het beste resultaat te komen in de verschillende browsers kun je de hiervoor beschreven oplossingen combineren.

<OBJECT CLASSID="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" WIDTH="300" HEIGHT="45" CODEBASE="http://activex.microsoft.com/activex/controls/
mplayer/en/nsmp2inf.cab" TYPE="application/x-oleobject">
<PARAM NAME="filename" VALUE="test.wav">
<EMBED SRC="test.wav" WIDTH="144" HEIGHT="60" TYPE="audio/wav" PLUGINSPAGE="http://www.apple.com/quicktime/download/"></EMBED>
</OBJECT>

Ook hier geldt dat vanwege de lengte in bovenstaande voorbeeldcode de waarde van het CODEBASE attribuut is onderbroken door een harde overgang naar een volgende regel. In werkelijkheid moet je dit niet doen.

Bekijk in een nieuw venster de weergave van geluidsfragmenten in de typen wav of midi.


Voor geluidsfragmenten bestaan er verschillende mogelijkheden om de weergave te regelen. Bij het OBJECT element doe je dat door het opnemen van extra PARAM elementen, terwijl je aan het EMBED element een aantal plug-in specifieke attributen moet toevoegen. Veel gebruikte mogelijkheden zijn die om te bepalen of geluidsfragment al dan niet direct bij openen van het HTML-document afgespeeld moet worden (de verschillende plug-ins en controls gaan daar niet op uniforme wijze mee om), hoe vaak dat achter elkaar dat moet en met welk geluidsniveau.

In het volgende voorbeeld is vastgelegd dat het geluidsfragment direct bij openen en daarna continue moet worden afgespeeld. Bij het OBJECT element gebruik je daarvoor de parameters "autostart" en "loop". Aan het EMBED element voeg je het LOOP attribuut toe en, omdat je niet weet welke plug-in de gebruiker heeft geïnstalleerd, de attributen AUTOSTART en AUTOPLAY op te nemen.

<OBJECT CLASSID="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" WIDTH="300" HEIGHT="45" CODEBASE="http://activex.microsoft.com/activex/controls/
mplayer/en/nsmp2inf.cab" TYPE="application/x-oleobject">
<PARAM NAME="filename" VALUE="test.wav">
<PARAM NAME="autostart" VALUE="true">
<PARAM NAME="loop" VALUE="true">
<EMBED SRC="test.wav" WIDTH="144" HEIGHT="60" TYPE="audio/wav" PLUGINSPAGE="http://www.apple.com/quicktime/download/" AUTOSTART="true" AUTOPLAY="true" LOOP="true"></EMBED>
</OBJECT>

Bekijk het resultaat in een nieuw venster.

De hoogte van het geluidsniveau kun je niet beïnvloeden in de Windows Media Player ActiveX control. Wil je dat toch, dan moet je kiezen voor een andere ActiveX control. In het volgende voorbeeld is dat de QuickTime Player.
Bij het OBJECT element gebruik je nu de parameter "volume" en aan het EMBED element voeg je het VOLUME attribuut toe. Het geluidsniveau geef je aan met een getal tussen "0" en "100": hoe hoger het getal, hoe harder. De standaardwaarde is "50". Wees voorzichtig met waarden boven de "50", want niet elke gebruiker zal het op prijs stellen als het geluidsfragment opeens uit de speakers knalt.

<OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="136" HEIGHT="16" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab" TYPE="audio/wav">
<PARAM NAME="src" VALUE="test.wav">
<PARAM NAME="autoplay" VALUE="false">
<PARAM NAME="volume" VALUE="25">
<EMBED SRC="test.wav" WIDTH="144" HEIGHT="60" TYPE="audio/wav" PLUGINSPAGE="http://www.apple.com/quicktime/download/" AUTOSTART="false" AUTOPLAY="false" VOLUME="25"></EMBED>
</OBJECT>

Bekijk de weergave in een nieuw venster.


Hoewel lang niet alle bezoekers er prijs op zullen stellen, kiezen webauteurs er nogal eens voor geluidsfragmenten op te nemen, welke automatisch en onzichtbaar op de achtergrond worden afgespeeld bij het openen van een HTML-document. Om het object onzichtbaar te maken zet je de waarden van de attributen WIDTH en HEIGHT van zowel het OBJECT als het EMBED element op "0". Voor het automatisch afspelen neem je voor het OBJECT element de parameter "autostart" op en voeg je aan het EMBED element de attributen AUTOSTART en AUTOPLAY toe; steeds met de waarde "true".

<OBJECT CLASSID="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" WIDTH="0" HEIGHT="0" CODEBASE="http://activex.microsoft.com/activex/controls/
mplayer/en/nsmp2inf.cab" TYPE="application/x-oleobject">
<PARAM NAME="filename" VALUE="test.mid">
<PARAM NAME="autostart" VALUE="true">
<PARAM NAME="loop" VALUE="true">
<EMBED SRC="test.mid" WIDTH="0" HEIGHT="0" TYPE="audio/midi" PLUGINSPAGE="http://www.apple.com/quicktime/download/" AUTOSTART="true" AUTOPLAY="true" LOOP="true"></EMBED>
</OBJECT>

Bekijk de weergave in een nieuw venster.


  Inhoud Handleiding HTML   Trefwoordenregister   Inhoud Objecten

Laatste wijziging 23 juli 2002
Copyright © 1995-2002 Hans de Jong