So erreichen Sie einen parallaktischen Effekt

Aufgrund der einfachen Umsetzung und des überzeugenden Ergebnisses besteht eine der beliebtesten Techniken darin, mit einem Bild und der Funktion „Fixieren“ einen parallaktischen Effekt und die Illusion von Bewegung zu erzeugen.

Dies wirkt visuell sehr ansprechend, lässt jedes Design deutlich aufwändiger erscheinen und kann einfach mit anderen Elementen wie Texten kombiniert werden. Fügen Sie einige Scroll-Animationen hinzu und Sie erhalten eine schön gestaltete, in sich stimmige Seite.

Erstellen Sie zuerst ein Bild, das ein Gefühl für das Umfeld aufbaut, in dem wir uns bewegen (auch im übertragenen Sinne; es könnte sich um alles von einem mittelalterlichen Gemälde bis hin zu einem spontan aufgenommenen Foto handeln). Nachdem Sie das Bild platziert haben, klicken Sie einfach auf die Option „Fixiert“

Der Grundgedanke ist, einen Kontext mit markanter Optik zu schaffen, um die Aufmerksamkeit des Besuchers zu lenken. Während die Inhalte der Website Informationen liefern, wirkt der fixierte Hintergrund wie ein Fenster in die echte Welt. Der Kontext wechselt von Umgebung/Stimmung hin zu Informationen und wieder zurück, was das Interesse aufrechterhält.

In diesem Beispiel geht es um die Seite eines Reiseveranstalters, der sich auf Wandern und Camping, Versorgung und Kontakteknüpfen spezialisiert. Das erste der beiden Hintergrundbilder zeigt die Vorbereitung einer Reise, das andere die Schönheit der Natur. Der dazwischenliegende Bereich trennt diese beiden Aspekte voneinander. 

Es ist ratsam, zwischen den beiden fixierten Hintergründen ausreichend Platz für einen sauberen Übergang zu lassen. Dort können, nachdem die Aufmerksamkeit des Besuchers erneuert ist, weitere Informationen angeboten werden.

Bitte melden Sie uns Mängel, die Ihnen in dieser Dokumentation auffallen, damit wir sie schnellstmöglich beheben können!

Diese Website verwendet Cookies. Einige davon sind für die Funktion der Website erforderlich, andere unterstützen uns dabei, sie zu verbessern. Mit der Nutzung dieser Website erklären Sie sich damit einverstanden, dass diese Cookies gespeichert werden. Weitere Informationen finden Sie in unserer Datenschutzerklärung.

X