Als ich vor fast zehn Jahren meine ersten Experimente mit Scrollreportagen machte, war das ein gigantischer Aufwand. Mit objektorientierten Funktionen musste man die Kommunikation zwischen Javascript und der Flash-Sprache Actionscript regeln.

Mittlerweile sind die Scrollreportagen nicht nur weit bekannt, sondern technisch auch viel einfacher zu erstellen. Das liegt auch an jQuery: Das extrem populäre Javascript-Modul liefert einfache Methoden, um unabhängig von Browsertypen die Höhe des Anzeigefensters, die Position eines Elements oder die aktuelle Scrollmenge auszulesen.
$( window ).height()
$(this).offset();
$(window).scrollTop();
Der Rest ist einfachste Mathematik. Außerdem spart man sich komplizierte Schleifen, um durch alle Multimedia-Container zu zirkeln, ihre Position zu prüfen und zu starten. In jQuery hat man mit einer Zeile eine Funktion an eine Klasse gehängt.
$(".klasse").each(function(){
Durch HTML5 kann man außerdem auf Flash verzichten und die Multimedia-Elemente viel zuverlässiger starten, stoppen oder auf 0 zurücksetzen:
this.play();
this.pause();
this.currentTime=0;
Einziger Nachteil gegenüber Flash: Da nicht alle Browser die gleichen Codecs für den HTML5-Video-Tag und den HTML5-Audio-Tag unterstützen, muss man Videos in MP4 und WebM einbinden, Audio in MP3 und OGG.

Für ein Projekt habe ich nun ein sehr einfaches Template für so eine Reportage gebaut. Es steht zur freien Verfügung und ist mit zahlreichen Kommentaren im Quelltext gut erklärt. Wer ein bisschen Ahnung von HTML und Javascript hat, kann damit seine eigene Scrollreportage bauen.
Die Besonderheit bei dem Template ist, dass die einzelnen, visuell getrennten Abschnitte automatisch je nach Anzeigegerät so weit auseindergezogen werden, dass immer nur ein Abschnitt sichtbar ist. Sobald ein Abschnitt zentral liegt (zur Demo rot eingefärbt), werden alle Multimedia-Elemente, die sich darin befinden, automatisch gestartet.

Dieses Minimal-Beispiel kann relativ einfach mit jQuery-Plugins zu vollformatigen Slides erweitert werden, die beim Scrollen Einrasten. Auch Bewegungs-Parallaxe ist per Plugin möglich. Hier ein Überblick über diese Plugins.

Die technischen Hürden sind aber wie immer bei neuen Entwicklungen nicht das größte Problem. Scrollreportagen wie Snow Fall sind eigentlich in der Rezeption ein Desaster: Für den Rezipienten sind die Multimedia-Elemente so attraktiv, dass er das Scrollrad missbraucht, um den Text zu überspringen. Dadurch geht die Immersion in die Geschichte, die bei sequentiellen Medien wie Film oder Ton besonders hoch ist, kaputt. Das Problem hat bisher noch niemand gelöst - obwohl man es möglicherweise bewältigen kann, z.B. durch ultrakleine Zerteilung und Verknüpfung von Text und Multimedia. Dieses Problem war auch der Grund, warum ich mich 2006 der Audio-Slideshow zugewandt habe.

Update:

Hier noch ein schönes Template für Fullpanel-Reportagen (mit vollformatigem Video). Geht sehr einfach mit dem jQuery-Plugin Onepage-Scroll.