Parallax Scrolling – oft auch nur Parallax genannt – ist einer der jüngsten Webdesign-Trends. Viele Parallax-Webseiten sind jedoch nicht oder nur wenig für Suchmaschinen optimiert. Hier möchten wir Ihnen zeigen, wie Sie Ihre Parallax-Seite bezüglich Suchmaschinenoptimierung fit machen.
Was ist Parallax?
Parallax stammt ursprünglich aus der Videospielindustrie und wurde als Effekt eingeführt, der den Spielern visuelle Tiefe vermitteln soll. Im Webdesign wird Parallax als eine Technik definiert, die 3D-Effekte vortäuscht. Dieser Effekt wird über mehrere sich unterschiedlich schnell bewegende Ebenen erreicht.
Diese Listen enthalten Beispiele von innovativen Parallax-Webseiten:
- 20 Best Websites with Parallax Scrolling of 2013
- Parallax Scrolling: 30 schicke Beispiele des Webdesign-Trends
- 35 Stunning Parallax Scrolling WordPress Themes For Agencies, Designers, Apps and Portfolio 2014
Parallax & SEO
Viele Parallax-Beispiele sind One-Page-Webseiten, also Webseiten, die nur aus einer Seite bestehen. Das hat eigentlich nichts mit Parallax zu tun, denn Parallax macht keine Einschränkungen bezüglich der Seitenanzahl. Das Problem der One-Page-Webseiten besteht darin, dass nur eine einzige Seite der Domain im Google Index eingetragen ist, was aus SEO-Sicht nicht optimal ist.
Eine Parallax-Seite kann das Suchmaschinen-Ranking ausserdem durch die folgenden Kriterien verschlechtern:
- Keyword-Optimierung: Eine einzige Seite kann nicht für viele Keywords optimiert werden, dazu sind mehrere Landing Pages notwendig.
- Ladezeiten: Viele Parallax-Seiten laden langsam, weil sie viel JavaScript-Code enthalten.
- Smartphone-Optimierung: Eine Parallax-Seite kann auf mobilen Geräten nicht immer korrekt angezeigt werden. Mit steigenden Besucherzahlen von mobilen Endgeräten und Googles Fokus auf die mobile Benutzerfreundlichkeit sollte dies nicht vernachlässigt werden.
- Browser-Kompatibilität: Es benötigt viele Tests, um sicherzustellen, dass die Parallax-Seite in allen gängigen Browsern korrekt funktioniert. Werden diese Tests nicht gemacht, kann eine Seite für einige Besucher nicht benutzbar sein.
Mit den folgenden zwei Vorgehensweisen vermeiden Sie die grössten SEO-Probleme bei Parallax-Webseiten:
SEO Best Practice: One-Page-Webseiten in Sektion unterteilen
Mit der «pushState»-Funktion in jQuery können One-Page-Webseiten in mehrere Sektionen unterteilt werden, die jeweils über eine eigene URL und Meta Daten verfügen. Somit kann eine Seite mehrmals und für unterschiedliche Inhalte und Keywords indexiert werden. Die URLs können zudem für die interne Verlinkung verwendet werden.
SEO Best Practice: «Hybride» Webseiten erstellen
Hybride Webseiten wie zum Beispiel Spotify wenden Parallax nur auf der Homepage an und verlinken von dort auf weitere Seiten, die «statisch» sind und ohne Parallax auskommen. Damit können die Besucher mit einer schönen Startseite beeindruckt werden und für detaillierte Informationen auf Keyword-optimierte Seiten gelenkt werden.
Wenn Sie also Parallax auf Ihrer Webseite implementieren möchten, wählen Sie gezielt eine Seite aus (z.B. die Homepage oder eine Produktseite) und verlinken Sie diese intern. So können Sie eine schicke Parallax-Seite und Suchmaschinenoptimierung kombinieren.