SMIL – Synchronized Multimedia Integration Language

Slides:



Advertisements
Ähnliche Präsentationen
Web-Content-Management-Systeme
Advertisements

Inhalt – Technische Grundlagen
LASH. Geschichte 1996: FutureWave entwickelt das Animationsprogramm FutureSplash-Animator Macromedia übernimmt FutureWave –FutureSplash-Animator und -Player.
Datenbankzugriff im WWW (Kommerzielle Systeme)
SVG und X3D Referentin: Gergana Ivanova
NATURAL Web-Integration 1 / 27/28-Feb-98 TST NATURAL Web-Integration Arbeitskreis NATURAL Süd Theo Straeten SAG Systemhaus GmbH Technologieberater Stuttgart.
Zurück zur ersten Seite n Style Sheets sind im Prinzip Formatvorlagen für HTML-Dokumente n Über Style Sheets lassen sich zentrale Layout-Vorgaben für eine.
HTML - Einführung Richard Göbel.
DOM (Document Object Model)
Internetstruktur Das Internet besteht aus vielen Computern, die weltweit untereinander vernetzt sind.
XML-Schema HKI Proseminar Wintersemester 2010/11 Dozentin: Frau Kurz von Jan Kohl und Christian Lütticke.
HTML - Eine erste Annäherung
Eine Einführung in OpenOffice. Was? Freies Office-Paket mit offenem Quellcode Erste funktionierende Version im Oktober 2001 veröffentlicht Basiert auf.
Technik Gestaltung Navigation Daten. Übersicht Client Webbrowser InternetServer.
Proseminar Auszeichnungssprachen WS04/05 XML und Multimedia Referat von Benjamin Bornemann.
Erstellen einer Webseite Fortbildung am FPGZ Stephan Best.
Tobias Högel & Dennis Böck,
Seite Common Gateway Interface. Konzepte. Übersicht 1Einleitung 2Was ist CGI? 3Wozu wird CGI verwendet? 4Geschichtlicher Überblick 5Grundvoraussetzungen.
1 Grundlagen und Anwendung der Extensible Markup Language (XML ) Peter Buxmann Institut für Wirtschaftsinformatik Johann Wolfgang Goethe-Universität Frankfurt.
Was versteht man unter XML Schema?
FH-Hof HTML - Einführung Richard Göbel. FH-Hof Komponenten des World Wide Webs WWW Browser HyperText Transfer Protocol (HTTP) via Internet WWW Server.
Coccon das Web-XML-Publishing System Thomas Haller.
Vortrag HTML, XHTML, DHTML
Andre Schücker und Martin Gemeinholzer
Erste Schritte mit PHP 5 von Max Brandt, 22. September 2006.
HTML (I) am Cern in Genf von Sir Tim Berners-Lee entwickelt
Applets Java für’s Web.
Gegenstand EDV Thema: Informative Webseiten
LearningApps: Mehr Interaktivität für E-Learning im Web 2.0
Silverlight Eine Einführung. Agenda 1.Was ist Silverlight? 2.Die Silverlight Philosophie 3.Vorstellung des Szenarios 4.Einführendes Beispiel 5.Konzepte.
Web-HMI einbinden SPS-Technik mit Video, Multimedia und Entertainmentsystemen kombinieren I Peter Steib.
Seminar XML-Technologien: VoiceXML/SMIL 1 Was ist SMIL ? Synchronized Multimedia Integration Language Ausprache wie das englische Wort smile {smaIl} August.
2007 Office - Bestellung Backup Medium -Schritt für Schritt Anleitung- Hinweis: Die Bildausschnitte wurden mit Windows Vista Ultimate (Aero Oberfläche)
JavaScript.
Präsentation von Sonja Pathe
Transkription ausgeben
Content Management ist ein Prozess und umfasst die Erstellung, Verwaltung und kontrollierte Veröffentlichung von Inhalten. Content-Management- Systeme.
HTML-Editoren Eine Präsentation von Erik Kulisch.
Proseminar: „Webtechnologien für Ecommerce“
Wird ganz am Anfang der HTML-Datei geschrieben Doctype html public bedeutet, dass man sich auf die Öffentlichkeit der html-dtd bezieht Html ist die meist.
Windows Presentation Foundation, Vorlesung Wintersemester 2013/14 Prof. Dr. Herrad Schmidt WS 13/14 Kapitel 2 Folie 2 XAML (1) s.a.
PPS-Veranstaltung (Design einer eigenen WWW-Homepage) Navigationsmechanismen.
Dipl.-Päd. Irene Tatzgern, MA
ANDREAS LOHR, OLONDA S.R.O. Einfach anfangen mit HTML.
VU Semistrukturierte Daten 1
Ausgabe vom Seite 1, XML Eine Einführung XML - Eine Einführung.
PHP Basic.
Oliver Spritzendorfer Thomas Fekete
2 Internet- Technologie Seite 1 Prof. J. WALTER Kurstitel Stand: september 2002 Internet-Technologie Herzlich Willkommen Prof. J. Walter.
Einführung in PHP.
Vortrag: Frames & Javascript.
CSS Cascading Style Sheets
Multimedia in Java Thomas Witschel, Kerstin Steinert & Erik Reinhard.
HTML Hypertext Markup Language
prof. dr. dieter steinmannfachhochschule trier © prof. dr. dieter steinmann Folie 1 vom Montag, 30. März 2015.
BADI – Barrierefreie Aufbereitung Digitaler Inhalte
Semantic Web.
JavaScript Geschichte : Netscape entwickelt LiveScript (Syntax angelehnt an Java) - Umbenennung von Live Script in JavaScript - Mircrosoft.
Digitale Annotationen. Grundlage: John Bradley “Towards a Richer Sense of Digital Annotation: Moving Beyond a Media Orientation of the Annotation of Digital.
Webserver Apache & Xampp Referenten: Elena, Luziano und Sükran
Multimedia-Didaktik Erich Neuwirth Universität Wien
Text Encoding Initiative Universität zu Köln Daten- und Metadatenstandards Seminarleitung: Patrick Sahle Seminarleitung: Patrick Sahle Referentin: Anna.
XML Schema Universität zu Köln Historisch-Kulturwissenschaftliche Informationsverarbeitung WS2011/2012 Hist.-kult.wiss. Informationsverarbeitung (Teil.
Das World Wide Web Stephan Becker TIT05BGR SS06. Das World Wide Web Übersicht Hypertext & Hypermedia HTML Dokumentenidentifikation Dokumententransport.
Internet - Grundbegriffe Unterlagen zum Kurs "Wie erstelle ich eine Homepage?"
Cascading Style Sheets1 Sprache zum Formatieren von HTML-Elementen Vom W3-Konsortium vorgeschlagen Einfach, aber mächtigere als Formatierungsmöglichkeiten.
Das Internet Ein Netzwerk, das viele Rechner miteinander verbindet
Entwicklungsgeschichte
Geoinformation IV GIS und Multimedia Synchronisationssprache SMIL
 Präsentation transkript:

SMIL – Synchronized Multimedia Integration Language Was ist SMIL - Möglichkeiten und Grenzen Werkzeuge zum Erstellen und Vorführen von SMIL-Präsentationen Einsatzempfehlungen Ein PHP-Skript zum Erstellen von SMIL-Präsentationen ohne SMIL-Kenntnisse

Ein HTML-Dokument wird vom Web-Server mit dem Hypertexttransferprotokoll (http) zum Client übertragen. Das übertragene HTML-Dokument wird dabei schrittweise auf dem Bildschirm sichtbar, ohne dass der zeitliche Ablauf der Übertragung oder der Präsentation der einzelnen Objekte kontrolliert werden kann. Dies ist bei traditionellen HTML-Seiten, die aus Texten und Bildern bestehen, auch gar nicht erforderlich. Texte und Bilder einer HTML-Seite erscheinen nach ihrer vollständigen Übertragung auf dem Bildschirm. Ihre Präsentation ist an keinen festen zeitlichen Ablauf gebunden. Dies ist bei multimedialen Präsentationen anders. Text, Ton und statische oder laufende Bilder werden in einer vorher genau definierten zeitlichen Folge präsentiert. Bei einem Film ist es ist wichtig, dass der Ton zusammen mit dem entsprechenden Bild wahrgenommen werden kann, usw.. Um dies zu erreichen, müssen Multimediaobjekte kontinuierlich und nach einem klar definierten zeitlichen Schema übertragen werden. Die genaue zeitliche Steuerung und Kontrolle der Übertragung ist für eine Multimediapräsentation also eine entscheidende Determinante. Um dieses Problem zu lösen, wurde SMIL entwickelt. Über die zeitliche Steuerung und Kontrolle der Übertragung und des Ablaufs eine Multimediapräsentation hinaus, kann SMIL auch zur Kontrolle des Layouts der Präsentation verwendet werden. Vereinfacht ausgedrückt: SMIL dient der Positionierung, Synchronisation und Präsentation von Multimediaobjekten. Was ist SMIL? Die "Synchronized Multimedia Integration Language" (SMIL) ist eine vom W3C standardisierte Sprache zur kombinierten Präsentation multimedialer Daten wie Audio, Video, Text und Grafik. www.w3.org/AudioVideo/ SMIL ist eine XML-Applikation. Sie befähigt Autoren, genau festzulegen, welches Objekt wann und wo angezeigt bzw. abgespielt werden soll. SMIL trennt streng zwischen Inhalt und Struktur (SMIL-Präsentationen enthalten keine Inhalte, sondern nur Verweise auf Objekte) Kurz vor Veröffentlichung: Version 2.0

Möglichkeiten von SMIL? Ähnlich den Anmerkungen eines Theaterdirektors, der die Darsteller auf- und abtreten lässt, ohne selbst an der Darstellung mitzuwirken Ein SMIL-Dokument enthält Metadaten und Steuerungsinformationen, nicht aber den tatsächlichen Mediengehalt Möglichkeiten von SMIL? Erstellen von interaktiven audiovisuellen Präsentationen auf relativ einfache Weise Integration verschiedener, zeitlich aufeinander abgestimmter Elemente (Audio- und Videofiles, Texte, Bilder etc.) Effekte wie Überlappung, Überblendung, Bewegung HTML sehr ähnlich und ebenso leicht zu erlernen und zu editieren. Die Dateien können auch von Skriptsprachen erstellt werden. Testsuite: www.w3.org/2001/SMIL20/testsuite/s2animation.html

Vorteile SMIL bietet gegenüber anderen Technologien Vorteile: Trennung von Struktur und Inhalten Zusammenfassung von unterschiedlichen Objekten, die auch nicht auf einem Server liegen müssen (eng mit Streamingtechnologie verbunden) einfache Textdateien – einfaches Editieren Anpassung an Browser möglich (unterschiedliche Bandbreiten, Sprachen, etc.) exakte Synchronisation der Objekte

Vorteile Hauptvorteil: SMIL wurde unter Aufsicht des W3C von vielen Personen und Firmen entwickelt, darunter RealNetworks, Apple, Netscape, Philipps, GMD, INRIA usw. Damit ist SMIL ein nicht-proprietärer Standard!

Beispiele SOJA: www.helio.org/products/smil/demo/ INRIA: cgi-serv.inrialpes.fr/PDMS//docs_mm.htm Real: Enjoy New York with a SMILe INRIA: Étude de données météorologiques

Grenzen von SMIL junger Standard: Browser bzw. Plugins unterstützen noch nicht vollständig, z.B. RealPlayer + Text, ohne PlugIn derzeit nur vom Internet Explorer ausführbar einzelne Objekte der Präsentation bleiben betriebssystemabhängig je nach Präsentationswerkzeug: nicht barrierefrei relativ geringer Befehlsumfang

Syntax von SMIL-Dokumenten SMIL ist XML-basiert und daher HTML sehr ähnlich. Dies macht SMIL einfach zu schreiben, zu lesen und zu verstehen. Es gibt allerdings einige Unterschiede zwischen SMIL und HTML: SMIL ist "case sensitive"; alle Tags müssen klein geschrieben werden; SMIL ist vollständig XML-basiert, d.h. alle Elemente müssen abgeschlossen werden. (Elemente, die kein Ende-Tag besitzen, erhalten am Ende einen Forward-Slash /)

Struktur von SMIL-Dokumenten <head> <meta name="title" content="SMIL-Vortrag" /> ... <layout> <root-layout background-color="#FFFFFF" width="100" height="200" id="window" /> <region id="text_region" top="5" /> </layout> </head> <body> <text region="text_region" src="text.html" dur="10s" /> </body> </smil>

Wichtige Sprachelemente par Container für parallel anzuzeigende Objekte <par> <img id="a" dur="6s" begin="0s" src="bild1.jpg" /> <img id="b" dur="4s" begin="0s" src="bild2.jpg" /> <img id="c" dur="5s" begin="2s" src="bild3.jpg" /> </par> (Beginnzeiten sind relativ zum Container par)

Wichtige Sprachelemente seq Container für nacheinander anzuzeigende Objekte <seq> <img id="a" dur="6s" begin="0s" src="bild1.jpg" /> <img id="b" dur="4s" begin="0s" src="bild2.jpg" /> <img id="c" dur="5s" begin="2s" src="bild3.jpg" /> </seq> (Beginnzeiten der Objekte sind relativ zum Vorgänger, hier: 1. und 2. Bild hintereinander, dann 2 Sekunden Pause, dann 3. Bild)

Wichtige Sprachelemente excl Container für Objekte, von denen immer nur eines anzuzeigen ist <excl> <img id="a" dur="6s" src="bild1.jpg" begin="0s;x.activateEvent" /> <img id="b" dur="4s" src="bild2.jpg" begin="y.activateEvent" /> </excl> (Bild 1 wird am Anfang gezeigt und immer dann, wenn Objekt x aktiviert wird, Bild 2 nur dann, wenn Objekt y aktiv ist)

Wichtige Sprachelemente switch Container für Objekte, von denen eines in Abhängigkeit von den vorliegenden Bedingungen angezeigt wird <switch> <par system-bitrate="75000"> <audio src="song1.rm" /> <video src="video1.rm" /> </par> <par system-bitrate="20000"> <audio src="song2.rm" /> <video src="video2.rm" /> </par> </switch>

Wichtige Sprachelemente anchor Definieren eines Hot Spot Links <video src="video1.mov" region="videoregion"> <anchor href="rtsp://lumiere.rz.hu-berlin.de/hildebrandt/regine1.mov" coords="20,40,80%,100%" begin="5s" end="10s" /> </video> (Koordinaten definieren ein Rechteck für den Hotspot, als Werte können Pixel und Prozent angegeben werden, hier: der Hotspot steht für 5s zur Verfügung)

Integration von SMIL HTML Der SMIL-Standard beschreibt die Synchronisation multimedialer Objekte, nicht jedoch die Integration in Webseiten. Die Einbindung kann auf zwei Wegen geschehen: Überführung in ein Dokument, das von einem PlugIn interpretiert werden kann (siehe RZ-Mitteilungen Nr. 20) Nutzung des HTML+TIME-Konzeptes

HTML+TIME TIME = Timed Interactive Multimedia Extensions Erweiterung von HTML für den Internet Explorer, Angabe von Erscheinungszeitpunkt, Dauer und Wiederholungsanzahl zu jedem Objekt, Unterstützung von Bewegung und Interaktion <html xmlns:t="urn:schemas-microsoft-com:time"> <head> <style> .time { behavior: url(#default#time2) } </style> <?IMPORT namespace="t" implementations="#default#time2"> </head> <body> <p id="example" class="time" begin="0" dur="5">Test</p> </body> </html> http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dntime/html/htmltime.asp

Integration von SMIL XML Angabe von Codierung und XML-Namespace <?xml version="1.0" encoding="ISO-8859-1"?> <smil xmlns="http://www.w3.org/SMIL20/Language"> <head> <layout> ... </smil>

Integration von SMIL SVG <rect y="45" width="10" height="10" fill="red"> <animate attributeName="x" from="0" to="90" dur="10s" repeatCount="indefinite"> </rect> (Deklaration eines Rechtecks mit Hilfe von SVG, Hinzufügen einer Bewegung mit SMIL) Weitere Beispiele: http://www.kevlindev.com/tutorials/basics/animation/svg_smil/index.htm

Integration von SMIL PHP Erstellung von SMIL-Dateien durch ein PHP-Skript Beispiel

Werkzeuge Editoren GRiNS 2.0 SMILGen von Real* GoLive6 von Adobe* sowie jeder ASCII-Editor *-Qualität nicht geprüft Player Real Player SOJA (Smil Output in Java Applets) Quicktime Player GRiNS Player for SMIL 2.0 Schmunzel von SunTREC * Internet Explorer 6 (HTML+TIME)

Tendenzen Firmen ergänzen SMIL-Standard <smil xmlns:qt="http://www.apple.com/quicktime/resources/smilextensions" qt:autoplay="true"> <head> <layout> ... </smil> Quelle: http://developer.apple.com/techpubs/quicktime/qtdevdocs/REF/QT41_HTML/QT41WhatsNew-6.html

Einsatzempfehlungen Flash, PowerPoint, Director usw. = Multimedia-Äquivalent zu Microsoft Word, speichern Binärformate ab, schwer von außen änderbar Vergleichstabelle

SMIL ohne SMIL-Kenntnisse http://www.hu-berlin.de/tmp/smil/projekt.php

Tutorials und Literatur www.w3.org Wolfgang Keitz: Das SMIL-Textbuch: http://v.hdm-stuttgart.de/~keitz/skripte/SMILStart.htm Frank Goetz: SMIL – Multimedia im Internet mit Realsystem G2 SMIL-Tutorial: http://www.helio.org/products/smil/tutorial/