Slideshow – Kurzerklärung

Slideshow – die Diashow fürs Web


In einer Slideshow (deutsch Diashow) werden Fotos und Grafiken auf einer Internetseite präsentiert. Die Bildershow läuft automatisch ab oder der Nutzer steuert sie selbst. Diashows lassen sich mit Audiokommentaren, Musik und Ähnlichem unterlegen. In der Regel werden sie in Javascript programmiert. Die Diashow wird als Designelement verwendet und kann ebenso Inhalte transportieren.

Slideshow – allgemeine Charakteristik

Animation

Im Gegensatz zu einem Video werden bei einer Diashow statische Bilder gezeigt. Bewegungen treten maximal beim Übergang eines Bildes zum nächsten auf.

Anmerkung: Es gibt auch Diashows mit Videos. Dort werden Videoausschnitte hintereinander abgespielt.

Steuerung

  • Automatisch: Hierbei laufen die Bilder hintereinander ab. Der Nutzer kann den Vorgang nicht beeinflussen.
  • Halbautomatisch: Die Bilder laufen automatisch ab, aber der Nutzer kann den Vorgang pausieren. Auch darf er zwischen den Grafiken und Fotos vor- und zurückspringen.
  • Manuell: Der Nutzer bestimmt, welches Bild er wie lange sehen will.

Technische Realisierung

Diashows fürs Web werden auf zwei Arten in die Internetseite eingebunden.

Videoslideshow

Im ersten Schritt wird aus Grafiken und Fotos, die in der Slideshow vorkommen sollen, ein Video erstellt.

Tipp:Am einfachsten ist es, eine Videoslideshow aus einer Powerpoint-Präsentation zu generieren. Dies geschieht über die Export-Funktion des Programms.

Im nächsten Schritt wird die Videoslideshow wie jedes andere Video in die Website an der gewünschten Stelle eingebunden.

 

Vorteile:

 
  • einfach umzusetzen
  • Ton möglich
  • viele Effekte realisierbar (in Abhängigkeit vom Videoprogramm)
 

Nachteile:

 
  • Bilder können nicht ergänzt oder gelöscht werden, ohne gesamtes Video zu ändern
  • nur wie ein Video steuerbar
  • hoch aufgelöste Videos benötigen viel Speicherplatz
  • lange Ladezeiten

Javascript

Per Javascript wird eine Bibliothek, in der die Bilder und Grafiken abgespeichert sind, angesteuert. Mit dem richtigen Code können so die Bilder auf der Internetseite angezeigt werden. Auch Übergänge, Buttons zur Steuerung, Anzeigezeit, Filter usw. werden mithilfe von Javascript erzeugt.

Tipp: Bei Content Management Systemen gibt es je nach System eine Vielzahl an Slideshow-Plugins. Die meisten sind sogar kostenfrei. 

Vorteile:

 
  • Bilder können einfach ergänzt und geändert werden
  • umfangreiche Steuermöglichkeiten (Anzeigezeit der Bilder, Sprung zu bestimmten Bild usw.)
  • wenig Speicherplatz (nur für Bilder)
  • kurze Ladezeiten (da nur einzelne Bilder geladen werden)
 

Nachteile:

 
  • Programmieraufwand, außer es werden Plugins genutzt
  • Einbindung von Ton komplizierter
  • begrenzte Anzahl an Effekten

Designelement und Content

Designelement

Eine Web-Diashow ist ein beliebtes Mittel, um die Optik einer Internetseite aufzuwerten. Gerade auf Startseiten wird sie häufig im Header genutzt, um etwa Momentaufnahmen aus dem Unternehmen, besondere Shop-Angebote oder Beispielarbeiten zu zeigen.

Aufgrund der Bewegung beim Bildübergang erzeugt sie Aufmerksamkeit. Außerdem wecken die richtigen Bilder Emotionen beim Betrachter und stimmen auf die Inhalte der Seite ein.

Slideshow Bsp
Der Webshop Everbuying nutzt eine große Diashow auf der Startseite, um auf besondere Produkthighlights aufmerksam zu machen. (Bildquelle: Screenshot / everbuying.net) 

Content

In einer Diashow lassen sich Inhalte aller Art anschaulich aufbereiten. Sie kann wie eine Powerpoint-Präsentation genutzt werden. Des Weiteren zeigt die Diashow eine Galerie auf einfache und komfortable Art an.

Slideshow BspBeim ZDF Wahltool werden in einer Slideshow die Wahlergebnisse anschaulich präsentiert. (Bildquelle: Screenshot / wahltool.zdf.de)

Sechs Empfehlungen für die Gestaltungen einer Slideshow

  • Auf das Wesentliche fokussieren.
  • Aufwendige Übergangsanimationen lenken ab – weniger ist mehr.
  • Gesprochene Kommentare auch als Untertitel realisieren, da nicht immer Tonausgabe am Computer möglich.
  • Ausreichende Anzeigezeit der einzelnen Bilder, damit Betrachter Inhalt erfassen kann.
  • Content-Diashow halbautomatisch oder manuell anlegen.
  • Die Diashow idealerweise im Corporate-Design erstellen.