26. März 2020

6 Gründe, warum Du keinen Slider auf Deiner Webseite nutzen solltest

Grafik 6 Gründe gegen Slider

»Hey, das ist cool! – Oh, wo ist es hin? – Was ist das jetzt? – Hey, ich bin noch nicht fertig mit lesen! – Okay, kommt da jetzt noch was? – Jetzt geht das schon wieder von vorne los, ich will das eine Bild in der Mitte nochmal sehen! – Dann bleibts halt! – Tschüss!«

1. Sie sind ein SEO-Albtraum!

Über 1,2 Milliarden existierende Webseiten da draußen und auf nahezu jeder aktuellen davon befindet er sich … der Slider. Dabei sind doch allen immer Ihre Anzahl Webseitenbesuche, Klickraten und Rankings so wichtig.

Bereits in jedem mittelklassigen Suchmaschinen-Optimierungs-Workshop bekommt man folgende Dinge gelernt:

  • Immer nur höchstens EINE H1-Überschrift verwenden, die VOR jedem anderen Heading-Tag steht
  • KEINE Flash-Nutzung
  • auf GUTE Seitenladegeschwindigkeit achten und
  • KEINE oberflächlichen Inhalte verwenden

Ja, soweit so gut. Aber warum zum SEO-Teufel verwendet man denn dann diese Slider? Viele der Webseiten, die ich mir angesehen habe wurden mit jQuery, HTML5 oder AJAX erstellt. In den meisten Fällen waren die Überschriften im Slider mit einem h1-Tag versehen. Und was ein Slider nun mal so an sich hat ist, dass er aus mehreren verschiedenen Bildern besteht. Demzufolge ist es logisch, dass sich jedes Mal, wenn sich die Folie ändert, auch der h1-Tag ändert. Eine Seite mit fünf Folien im Slider enthält dementsprechend 5 h1-Tags, wodurch die Relevanz des Keywords stark abgewertet wird.

2. Sie machen Deine Webseite langsam!

Ein großes, buntes Bilderkarussell, selbstverständlich in der bestmöglichen Auflösung! Muss ja auch wirken, oder? Denkste! »Groß« ist nämlich hier das Stichwort! Je größer und hochauflösender die Bilder im Slider, desto langsamer die Seitenladegeschwindigkeit. Das ärgert nicht nur die Nutzer (vor allem die auf dem Dorf mit der Heuleitung), sondern auch die Suchmaschinen.

3. Sie nehmen zu viel Platz »above the fold« weg!

Bei einem 13’’-Bildschirm zum Beispiel hast Du ganze 1280×800 Pixel Platz, um Dein Unternehmen oder Dein Produkt zu beschreiben. Eine Seite ohne zu Scrollen und Du verwendest riesige Inhalte mit wenig Text, die ständig wechseln! Wäre es nicht viel sinnvoller diesen Platz sinnvoll zu nutzen, indem man eine statische, große und aussagekräftige H1-Schlagzeile verwendet und einen catchy Text dazu, der Dich, Dein Produkt oder Dein Unternehmen gut beschreibt? Und den sich der Nutzer in Ruhe durchlesen kann, ohne, dass er ständig verschwindet? Ich verrat Dir sogar die Antwort: JA!

Und was ist, wenn Du keine tausenden Pixel Platz hast, sondern nur einen Bruchteil davon? Die meisten Slider werden mobil entweder so klein, dass man die Inhalte darauf nicht mehr lesen kann (eben, weil Sie für die PC-Bildschirmbreite gedacht sind), oder sie werden so groß gezerrt, dass man nur einen Teil des Bildes sieht und der Slider gar nicht mehr in voller Größe wirken kann. Warum die mobile Ansicht so wichtig ist, erläutere ich Dir unter Punkt 6 noch einmal näher.

4. Sie befördern die Conversion Rate in den Keller!

Ich verweise hierbei auf meinen Einleitungstext. Entweder Du denkst Dir als Nutzer so: »Hey, cool! Das interessiert mich, ich würde gerne mehr darüber erfahren.« und dann ist aber auch schon wieder die nächste Folie am Start, bevor Du überhaupt alles realisieren konntest. Oder aber Du denkst Dir »Hm, nagut. Spricht mich jetzt nicht wirklich an. Ich scroll mal weiter.« und schon hat Deine Webseite einen schlechten »ersten Eindruck« durch den Slider erzeugt.

5. Sie erzeugen Orientierungslosigkeit beim Nutzer

Dieser Punkt geht einher mit dem darüber. Entweder interessierst Du Dich für das, was sich auf der Folie befindet oder eben nicht. Wenn Du wirklich einer der wenigen Nutzer bist, die sich im ersteren Fall noch die Mühe machen und versuchen auf die Folie davor zurückzugelangen stehst Du schon wieder vor dem nächsten Problem: jeder Slider und jedes Bilderkarussell funktioniert anders und hat verschiedene Aktionen im Falle einer Interaktion zugewiesen. Wo beim Klick auf den einen Slider eventuell nur die Folie wechselt, öffnet sich bei einem anderen ein komplett neuer Tab mit neuen Inhalten oder es erscheint eventuell das Slider-Bild in Vollbild-Größe. Bei manchen Slidern hilft es, zur Seite wegzuwischen, bei anderen hast Du nur winzig kleine Punkte am unteren Bildrand, bei denen Du es eventuell schaffst Dir das nächste Bild anzeigen zu lassen, wenn nicht sogar gerade in diesem Moment eine neue Folie auftaucht.

6. Mobile first!

Die Slider mögen zwar schön aussehen, Deine Seite dynamischer machen und platzfüllend auf dem großen PC-Display sein. Aber wirkt das alles denn auf dem kleinen Smartphone-Display immer noch genauso schön? Hier gilt die einfache Faustformel »mobile first«. Sprich: alles, was auf dem Smartphone-Bildschirm funktioniert, funktioniert auch auf dem PC-Bildschirm, umgekehrt jedoch nicht!

Deshalb ist es so wichtig, sowohl Webseiten, als auch generell Creatives auf den mobilen Bildschirm anzupassen. Und Slider sind nun einmal für die Ausnutzung der vollen PC-Bildschirmbreite gedacht. Dabei gehen statistisch gesehen die meisten Menschen mit dem Smartphone online.

https://initiatived21.de/app/uploads/2018/01/d21-digital-index_2017_2018.pdf

Gute Alternativen zu Slidern und Bilder-Karussells

Wahrscheinlich fragst Du Dich jetzt, was Du stattdessen auf Deiner Webseite verwenden solltest. Hier ein paar Vorschläge:

Hero-Sections

Sehen im Prinzip genauso aus, wie Slider, sliden jedoch nicht, was Dir und Deiner Conversion Rate auf Deiner Seite viele Vorteile bringt. Hierbei legst Du Wert auf die richtige Auswahl eines statischen Bildes, stimmst es mit einem Claim und einem Call-to-action-Button auf mobilen und festen Displays ab, beim Nutzer wird das Interesse geweckt, er kann Deiner klaren Message folgen und reagieren oder scrollt weiter runter, um mehr über Dein Produkt zu erfahren. Zusätzlich freuen sich die Suchmaschinen über klar definierten Content mit einem H1-Tag, eine schnellere Ladegeschwindigkeit und schließlich Interaktion auf Deiner Seite.

Side-by-Side-Sections

Ein einfaches Layout bestehend aus zwei Spalten. Eine enthält ein Bild oder sogar ein Video, das Dein Produkt darstellt. Die andere enthält eine passende Überschrift, etwas zusätzlichen Text und eine call-to-action-Schaltfläche, um den Kunden zum Weiterklicken oder sogar direkt zum Kauf zu animieren.

Dieses Layout stellt eine großartige Möglichkeit dar, Dein Produkt oder Unternehmen direkt in Bild und Text zu kommunizieren, ohne dabei zu viel Platz zu beanspruchen. Das Tolle an diesem Layout ist, dass sowohl ein Fokus auf dem Bild liegt, ohne aber den Nutzer mit dem Textteil zu überfahren.

Hast Du einen Slider auf Deiner Webseite? Hast Du jemals darüber nachgedacht, dass dieser vielleicht mehr schlecht als recht ist? Wie stehst Du zu dem Thema?

Quellen:
https://thrivethemes.com/why-sliders-suck/
https://searchengineland.com/homepage-sliders-are-bad-for-seo-usability-163496
https://www.widerfunnel.com/rotating-offers-the-scourge-of-home-page-design/
https://initiatived21.de/app/uploads/2018/01/d21-digital-index_2017_2018.pdf

Über den Autor

Inhalte mit Emotionen füllen – das ist ihr Job. Sharon ist das Distributionswunder im Team. Von der laufenden Konzeption, über die Verteilungsplanung bis hin zur endgültigen Veröffentlichung erledigt sie alle „Content“-Aufgaben, die anfallen. On top koordiniert sie das Community Management für unsere Kunden.