HTML5-Präsentationen

Deck.js statt Powerpoint

Caleb Troughton hat mit Deck.js eine kleine Software geschrieben, mit der sich mit ein wenig HTML ansehnliche Präsentationen umsetzen lassen, die einfach im Browser wiedergegeben werden können.

Artikel veröffentlicht am 23. August 2011, 16:01 Uhr, Jens Ihlenfeld

Einfache Präsentationen mit HTML, CSS und Javascript (Bild: Caleb Troughton)

Moderne HTML-Präsentationen verspricht Caleb Troughton mit Deck.js. Die einzelnen Folien bestehen aus einfachem HTML-Code, wobei jede Folie einfach in ein HTML-Element mit der Klasse "slide" gekapselt wird. Das Deck.js Modul Core kümmert sich um die Organisation der Folien und weist ihnen jeweils einen Status zu, für den entsprechender CSS-Code hinterlegt werden kann. Darüber werden auch die Übergänge zwischen den Folien definiert.

Zudem unterstützt Deck.js Erweiterungen für weitere Anpassungen. Zugleich aber ist Deck.js dadurch sehr modular, denn viele Funktionen hat Troughton seinerseits über Erweiterungen umgesetzt. Die Core-Version unterstützt beispielsweise nur die Navigation mit den Pfeiltasten. Die Erweiterung deck.goto erlaubt ein direktes Anspringen einzelner Folien, deck.hash eine interne Verlinkung von Folien und deck.menu gibt eine Übersicht aller Folien. Hinzu kommt deck.navigation: Die Erweiterung blendet Pfeile zur Navigation mit der Maus ein. Das Modul deck.status zeigt die Zahl der Folien und die aktuelle Position in der Präsentation an. Dabei enthält jede Erweiterung den kompletten Javascript-, CSS- und HTML-Code, der für die jeweilige Funktion benötigt wird.

Natürlich lassen sich auch Bilder, Videos und Zitate einbetten.

Deck.js ist Open Source, der Code ist bei Github zu finden.