Loading...

Parallax Effekt

Kreativität weckt Neugier

mehr erfahren
Zum Artikel

Parallax-Effekte für Ihre Webseite

Parallax Scrolling Effekt

Parallax Scrolling ist eine Pseudo-3D Technik, die in den frühen 80ern zunächst bei Computer-Spielen eingesetzt wurde. Beim Parallax Scrolling arbeitet man mit verschiedenen Ebenen, wobei sich die hinteren Ebenen langsamer bewegen als die vorderen Ebenen. Dadurch wurde in 2D-Spielen eine Illusion von Tiefe geschaffen. Wenn sich einzelne Ebenen einer Website unterschiedlich schnell bewegen, entsteht beim Betrachter der Eindruck von Tiefe. Man kennt den Effekt aus der physischen Welt, wenn man etwa beim Zugfahren aus dem Fenster schaut. Nahe Objekte wie Menschen oder Häuser scheinen sich dann deutlich schneller zu bewegen als weit entfernte Objekte wie ganze Wälder oder Berge. Überträgt man diesen Effekt in die virtuelle Welt des Webdesigns, nennt man das Parallax Scrolling. Es ist einer der großen Webdesign-Trends.


Parallax

Den Nutzer zum scrollen animieren

Jakob Nielsen zeigt in dem Artikel “Scrolling and Attention“, dass Nutzer 80% Ihrer Aufmerksamkeit Inhalten über dem Fold schenken und nur 20% unterhalb. Dies heißt jedoch nicht, dass Nutzer nicht scrollen, sondern lediglich, dass dem Inhalt über dem Fold mehr Aufmerksamkeit geschenkt wird. Die wichtigsten Inhalte sollten sich also nach wie vor im sichtbaren Bereich befinden. Der Inhalt im sichtbaren Bereich sollte das Interesse des Nutzers wecken, so dass er die Seite nicht direkt verlässt, sondern sich auch die weiteren Inhalte ansieht. Parallax Scrolling kann hier genau ansetzen und den Nutzer dazu animieren sich die komplette Seite anzusehen. Denn bemerkt der Nutzer den Effekt, den er durch das Scrollen auslöst, weckt dies Interesse und der Nutzer möchte wissen, welche Effekte er noch durch das Scrollen auslösen kann.

Rise

Wiedererkennungswert steigern

Durch den aufmerksamkeitssteigernden Effekt kann man einen Wow-Effekt beim Nutzer auslösen, der eher im Gedächtnis eines Betrachters bleibt. Dies kann den Wiedererkennungswert eine Seite enorm steigern. Durch detaillierte, animierte Bildwelten und die einfache Bedienung (Kontrolle) durch Scrollen entsteht ein hoher Joy of Use. Die Trinkmarke “Activate” verbindet zum Beispiel ihr Offline-Erlebnis mit der Webseite. So wird als Einstieg der besondere Verschluss der Flasche gezeigt, der beim Drehen dem Wasser Vitamine beisetzt. Scrollt man auf der Webseite runter, so dreht man virtuell den Verschluss auf und es werden kleine Kügelchen freigesetzt, die sich als Stilelement durch die ganze Seite ziehen.

Calm

Fazit

Aktuell wird Parallax Scrolling noch selten für direkte Verkaufszwecke verwendet. Dass dieser Effekt aber durchaus Sinn macht, zeigen einige gute Beispiele. Gerade eine lange Landingpage für ein erklärungsbedürftiges Produkt könnte durch die Technik aufgelockert und für den Nutzer interessanter gestaltet werden, so dass das Interesse des Nutzers bestehen bleibt. Aufpassen muss man in diesem Fall nur, dass der Effekt den Inhalt auch in den Fokus rückt und nicht nebensächliche Animationen in den Vordergrund geraten und der eigentliche Inhalt in den Hintergrund rückt.

css effekt