Hopp til innholdet

cjohansen.no

Multimediaobjekter og HTML

Gårsdagen dekket trauste gamle <img> til bilder. Men det er flere måter å sette inn et bilde på, og det er flere multimedia-objekter å sette inn enn bilder. Enter <object>!

Aktuelle elementer

Dagens innlegg dreier seg altså om <object>, samt partneren <param>, og det proprietære motstykket <embed>.

Bakgrunn

object gjorde entré i HTML 4.01 som en generisk løsning på problemer med å inkludere andre typer objekter i dokumenter. Fra før hadde vi tidligere omtalte <img> til bilder, <applet> til applets (spesifikt Java-applets) og <iframe> til inkluderte dokumenter.

Per idag er det kun <applet> av de tre som har blitt nesten borte, men jeg mistenker at det heller skyldes frafallet av Java-applets fremfor bedre markup. Grunnen er rett og slett at object har fått så stusselig støtte på tvers av nettleserene at den ikke har blitt tatt så bredt i bruk som tanken tilsa.

Geniale object

object er genial i sin løsning av inkluderte objekter, fordi den gjør det på en veldig elegant og fremoverkompatibel måte. Den sørger for at du har tilgang til å angi de tre tingene som teller når du skal inkludere et eksternt objekt:

  1. data eller classid for innhold/applikasjon
  2. type eller codetype for å angi typen på applikasjon/data
  3. Mulighet for å gi kjøretidskonfigurasjon gjennom <param>

I tillegg har den snacksy funksjonalitet som standby -attributtet som kan brukes til "ventetekst". Det eneste jeg har å utsette på designet av dette elementet er mengden attributter. Mange av disse verdiene kunne med hell vært elementer på linje med <param>. Med et standby-element ville man for eksempel kunne gitt bedre ventekonstruksjoner enn det et simpelt attibutt tillater.

Jeg har enda ikke nevnt den tøffeste egenskapen ved dette objektet: tilbakefallet. Du kan nemlig nøste flere object -elementer, slik at nettleseren kan begynne ytterst og stoppe når den treffer på noe den støtter/kan vise. La oss stjele et eksempel fra HTML-spesifikasjonen (noe modifisert): 

<object title="The Earth as seen from space" 
               classid="http://www.observer.mars/TheEarth.py"
              codetype="application/x-python">
    <object data="TheEarth.mpeg" type="application/mpeg">
        <object data="TheEarth.gif" type="image/gif">
            <object data="http://earth.google.com/" type="text/html">
                The <strong>Earth</strong> as seen from space.
            </object>
        </object>
    </object>
</object>

Logikken i eksempelet (fra nettleserens ståsted):

  1. Prøv å vise Python-appleten
  2. Hvis Python ikke er støttet, vis mpeg-videoen
  3. Hvis ingen passende spiller for mpeg-video finnes, prøv å vise en gif av verden
  4. Hvis gif ikke er støttet, prøv å vise hjemmesiden til Google Earth
  5. Hvis nettleseren ikke støtter inkluderte nettsider, viser den teksten i den innerste taggen.

Og det vakre med dette er at nettlesere som ikke har hørt om object går rett på siste mulighet - nemlig teksten. Det gjør den fordi det er standard måte å behandle ukjente elementer på (ignorer taggene og vis innhold som er forståelig).

Eksempelet over viser hvorfor denne løsningen er så mye mer robust også for bilder enn dagens img - alternativt innhold kan for eksempel være en gif i stedet for en transparent png, eller en fornuftig formattert tekst (i motsetning til mulighetene i alt).

Virkeligheten kaller!

Ok, tilbake til den virkelige verdenen og praktisk bruk. Jeg nevnte tidligere støtten ikke er så god. Prøv følgende eksempel i IE6, og du ser hva jeg mener. Nøstede object-elementer vises side om side. Ikke helt som ønsket.

Flash

Men, object har alikevel en bruk idag - nemlig til Flash. Flash har tidligere betydd ikke-validerende HTML fordi Netscape/Mozilla-nettlesere har krevd bruk av embed, som er den proprietære og onde tvillingbroren til object. Heldigvis er det ikke behov for den lengre. Følgende er gyldig HTML for å inkludere en Flash-film i et dokument: 

<object type="application/x-shockwave-flash"
              data="movie.swf" width="400" height="300">
    <param name="movie" value="movie.swf" />
</object>

Dette fungerer rett så bra, men (selvfølgelig) ikke uten en liten "hickup". IE6 streamer ikke filmen. Dermed er ikke dette spesielt brukanes for større filmer, noe A List Apart konkluderte med allerede for 5 år siden. For de som bruker Flash mye finnes blant annet SWFObject, en Javascript-løsning (det finnes flere også).

For en grundigere gjennomgang av forskjellige måter å sette inn Flash på, se en nyere artikkel fra A List Apart.

Publisert 18. desember 2007 under julekalender 2007 og html.

Muligens relatert

2006 - 2012 Christian Johansen Creative Commons Lisens