SMIL – Timed Interactive Multimedia Extensions for HTML

27. července 2004

•

Timed Interactive Multimedia Extensions for HTML, zkráceně HTML+TIME, je výsledkem spolupráce společností Microsoft, Macromedia, Compaq/Dec a Digital Renaissance. HTML+TIME je rozšířením SMILu do standardních prohlížečů, především Microsoft Internet Exploreru 5 a vyšších. Tento formát zapojuje časování a synchronizaci do dokumentů (X)HTML.

HTML+TIME 1.0 staví na specifikaci SMIL 1.0. Později se objevila specifikace HTML+TIME 2.0, která je podporována v MSIE 5.5. Tato specifikace staví na HTML+SMIL language profile podle W3C. HTML+TIME 2.0 zapojuje do prohlížeče některé moduly SMILu 2.0, zejména Timing and Synchronization module, Animation module, Media Object module a Integration module.

HTML+TIME se liší od SMILu v několika bodech:

některé prvky a atributy chybí, protože jsou zbytečné – zejména jde o vizuální část SMILu, kterou nahrazuje CSS
některé prvky jsou přidány
integrace do zdrojového kódu stránky se provádí odlišným způsobem

HTML+TIME úspěšně integruje SMIL do některých prohlížečů, což umožňuje jeho efektivní použití ve firemních sítích. V budoucnu lze snad předpokládat rozšíření HTML+TIME i do dalších produktů.

Specifikace HTML+TIME

HTML+TIME vypouští některé elementy z původní specifikace SMIL 1.0, z důvodu zbytečnosti:

smil – v HTML je nahrazen elementem html
layout – rozvržení je prováděno pomocí CSS
region – nahrazen CSS
root-layout – nahrazen CSS
text – text není v HTML tvořen objektem
anchor – obrázkové mapy nejsou podporovány

Dále mizí také řada atributů (zejména v XHTML), které jsou nahrazeny CSS – top, left, height, width, background-color, z-index a další. Zato se objevuje několik nových atributů určujících chování dokumentu (beginEvent, endWith, endEvent, repeatDur, viz dále). Mnoho původních (X)HTML prvků je ale doplněno o atributy SMILu, aby s nimi bylo možno manipulovat na časové ose (například p, div, span, h1-6, strong, em a další).

Nakonec byly původní SMIL elementy (už jich nezbylo moc) doplněny o namespace t (t:seq, t:par, t:media, t:img, t:video), jejich funkce však zůstala stejná. Rovněž atributy byly ve specifikaci HTML+TIME doplněny o namespace t (t:dur, t:src, t:begin, t:end), avšak pokud není použit, žádné problémy nenastávají, spíše naopak, při jeho použití některé věci špatně fungují.

Atributy (X)HTML prvků

Nyní se podíváme na význam nových atributů (X)HTML prvků. Z původních čistě (X)HTML atributů je nejdůležitějším atribut id, který umožňuje absolutní pojmenování prvku a pozdější odvolání na něj.

beginWith – hodnotou je id elementu, který se má zobrazit ve stejnou chvíli
endWith – hodnotou je opět id elementu, který se skryje ve stejnou chvíli
beginAfter – id elementu, se kterým se začne manipulovat po skončení manipulace s aktuálním elementem
beginEvent – hodnotou je id (form.onSubmit) nebo name (document.onLoad) události, závisle na ní se pak element zobrazí
endEvent – ukončení závislé na události
repeat – počet opakování zobrazení, hodnota „indefinite“ způsobí nekonečné opakování
repeatDur – doba opakování (sec), hodnota „indefinite“ způsobí nekonečné opakování

Pokud je hodnotou atributu čas v sekundách, je možné použít i desetinné číslo s desetinnou tečkou (0.5 = půl sekundy).

Integrace HTML+TIME 2.0 do (X)HTML

Dokument (X)HTML bude nutné doplnit o několik informací, zejména o deklaraci typu dokumentu:

<!DOCTYPE html PUBLIC „-//W3C//DTD HTML+SMIL //EN“ „htmlplussmil.dtd“>

Element head je doplněn o namespace (jmenný prostor):

Dále musíme použít procesní instrukci pro přidání definice HTML+TIME značek:

<?import namespace=“t“ implementation=“#default#time2″>

Nakonec zbývá přidat tabulku stylů, určující behavior HTML+TIME prvků:

Každý element ohraničující část kódu s HTML+TIME musí mít nastavenu třídu time. Výsledný dokument vypadá takto:

<!DOCTYPE html PUBLIC „-//W3C//DTD HTML+SMIL //EN“ „htmlplussmil.dtd“>
<html xmlns:t =“urn:schemas-microsoft-com:time“>
<?import namespace=“t“ implementation=“#default#time2″>
<style>
  .time {behavior: url(#default#time2);}
</style>
<body>
…HTML dokument
  <div class=“time“>
  …HTML+TIME
  </div>
…HTML dokument
</body>
</html>

Příklady HTML+TIME pro MSIE 5.5 a 6

Blikající text, ať už pomocí elementu blink nebo pomocí CSS, byl po čase z dobrého důvodu zavržen. Avšak pomocí HTML+TIME můžeme blikající text vytvořit nanovo (náhled):

<!DOCTYPE html PUBLIC „-//W3C//DTD HTML+SMIL //EN“ „htmlplussmil.dtd“>
<html xmlns:t =“urn:schemas-microsoft-com:time“>
<head>
  <?import namespace=“t“ implementation=“#default#time2″>
  <title>Nechutný blikající text</title>
  <style>
  .time, p {behavior: url(#default#time2)}
  </style>
</head>
<body>
  <div style=“width: 200px;height: 40px;“>
    <t:seq class=“time“ dur=“0.2″ repeatDur=“1000″>
      <p begin=“0″ dur=“0.1″>
      Nechutný blikající text
      </p>
    <t:seq>
  </div>
</body>
</html>

Celý vtip spočívá v tom, že „t:seq“, sekvence trvající 0.2 s a opakující se po dobu 1000 s, obsahuje odstavec textu, kterému je na časové ose vyhrazen úsek 0.1 s. Znamená to, že 0.1 sekundy je vidět text a dalších 0.1 sekundy vidět není.

HTML+TIME je možné aplikovat i na VML, pomocí jednotlivých sekvencí nebo prostřednictvím atributů:

<v:shape class=“time“ dur=“5s“ begin=“4s“ style=’width: 60; height: 60′ stroke=“true“ strokecolor=“black“ strokeweight=“1″ fill=“true“ fillcolor=“white“ coordorigin=“0 0″ coordsize=“60 60″>
<v:path v=“m 30,0l 60,15,60,45,30,60,0,45,0,15x e“ />
</v:shape>

XHTML+SMIL Profile

S MSIE 6 přišel nový profil pro integraci SMILu do prohlížečů, nazvaný XHTML+SMIL Profile, který integruje podmnožinu specifikace SMIL 2.0. Profil zahrnuje podporu animací, kontroly obsahu, mediálních objektů, časování, synchronizací a přechodů. Některé moduly SMIL 2.0 chybí, ale většinou jsou nahrazeny CSS. Dlužno říci, že MSIE6 sice XHTML+SMIL podporuje, avšak ne zcela korektně, mnohem lépe si vede s HTML+TIME.

Základní hlavičky XHTML+SMIL dokumentu vypadají následovně:

<!DOCTYPE html PUBLIC „-//W3C//DTD XHTML+SMIL //EN“ „http://www.w3.org/2001/SMIL20/WD/xhtmlplussmil.dtd“>
<html xmlns=“http://www.w3.org/1999/xhtml“ xmlns:smil=“http://www.w3.org/2001/SMIL20″>

Má SMIL smysl?

Svět multimediálních prezentací vypadá zbytečně zamotaně, což je způsobeno existencí mnoha profilů a technologií. Nejlepší bude shrnout vývoj popisovaných formátů v několika bodech:

1998 – Specifikace SMIL 1.0
- 1998 – Specifikace HTML+TIME – implementuje prvky SMIL 1.0 do některých prohlížečů (především MSIE5), některé elementy a atributy jsou nahrazeny CSS
2000 – HTML+SMIL language profile – profil vycházející z pracovního návrhu SMIL 2.0
- 2000 – HTML+TIME 2.0 – implementace většiny modulů SMIL 2.0
2001 – SMIL 2.0
- 2001 – Specifikace XHTML+SMIL Profile (Workig Draft) – později částečně podporována v MSIE6

Jazyk SMIL může najít uplatnění zejména ve firemních sítích, na samotném internetu se zatím moc často nepoužívá. Nutno podotknout, že multimediální zprávy MMS rovněž vycházejí z jazyka SMIL, takže je možné, že se jeho doménou stanou mobilní zařízení. SMIL přináší univerzální, výkonné a přitom nenáročné řešení, které je pro mobilní platformu mnohem důležitější než pro oblast PC.

Předchozí článek Píšeme pro web - o síle slov

Další článek gb.cz