{"id":9037,"date":"2017-10-13T22:13:19","date_gmt":"2017-10-13T20:13:19","guid":{"rendered":"https:\/\/waltersblog.ch\/2017\/10\/13\/slider-website\/"},"modified":"2017-10-13T22:13:19","modified_gmt":"2017-10-13T20:13:19","slug":"slider-website","status":"publish","type":"post","link":"https:\/\/walterlernt.ch\/blog\/slider-website\/","title":{"rendered":"8 Probleme, die Slider verursachen"},"content":{"rendered":"<p><img decoding=\"async\" src=\"https:\/\/walterlernt.ch\/blog\/wp-content\/uploads\/2022\/08\/chair.jpg\" alt=\"\" \/><a href=\"https:\/\/www.walterlernt.ch\/blog\/\" target=\"_self\" rel=\"noopener\"><\/a>\t\t\t<\/p>\n<h2>Erster Slide<\/h2>\n<p>Dies ist ein Beispiel-Slider, nur um zu zeigen, wie schlecht Slider sind!<\/p>\n<p>\t\t\t<a href=\"https:\/\/www.walterlernt.ch\/blog\/\" target=\"_self\" role=\"button\" rel=\"noopener\"><br \/>\n\t\t\t\t\t\t\tZum Blog<br \/>\n\t\t\t\t\t<\/a><br \/>\n\t\t\t<img decoding=\"async\" src=\"https:\/\/walterlernt.ch\/blog\/wp-content\/uploads\/2022\/08\/photography-1.jpg\" alt=\"\" \/><a href=\"https:\/\/www.walterlernt.ch\/blog\/\" target=\"_self\" rel=\"noopener\"><\/a>\t\t\t<\/p>\n<h2>Der zweite Slide<\/h2>\n<p>Rechtsb\u00fcndiger Text, der sowieso nicht gelesen wird und nur st\u00f6rt. Unten ein Knopf, den man dr\u00fccken k\u00f6nnte.<\/p>\n<p>\t\t\t<a href=\"https:\/\/www.walterlernt.ch\/blog\/\" target=\"_self\" role=\"button\" rel=\"noopener\"><br \/>\n\t\t\t\t\t\t\tZum Blog<br \/>\n\t\t\t\t\t<\/a><br \/>\n\t\t\t<img decoding=\"async\" src=\"https:\/\/walterlernt.ch\/blog\/wp-content\/uploads\/2022\/08\/danger-1.jpg\" alt=\"\" \/><a href=\"https:\/\/www.walterlernt.ch\/blog\/\" target=\"_self\" rel=\"noopener\"><\/a>\t\t\t<\/p>\n<h2>Wow, noch ein Slide!<\/h2>\n<p>Und der Text hat einen Hintergrund. Sieht man den? Er ist leicht transparent&#8230;<\/p>\n<p>\t\t\t<a href=\"https:\/\/www.walterlernt.ch\/blog\/\" target=\"_self\" role=\"button\" rel=\"noopener\"><br \/>\n\t\t\t\t\t\t\tZum Blog<br \/>\n\t\t\t\t\t<\/a><br \/>\n\t\t\t\t<a href=\"\/\" aria-label=\"previous\" role=\"button\"><br \/>\n<\/a><br \/>\n\t\t\t\t<a href=\"\/\" aria-label=\"next\" role=\"button\"><br \/>\n<\/a><\/p>\n<h2>Slider sind schlecht<\/h2>\n<p>Die Benutzerfreundlichkeit leidet und somit der Erfolg der Website. Alle, die sich detaillierter damit auseinander setzen kommen auf das gleiche Resultat: <strong>Slider sind f\u00fcr den Header-Bereich einer Home-Seite keine gute Idee.<\/strong><\/p>\n<p>Wir Web-Experten machen in solchen Situationen sogenannte User Tests. Daraus k\u00f6nnen sehr viele Schl\u00fcsse gezogen werden.<\/p>\n<p>Auch Artikel, die auf den ersten Blick sich anh\u00f6ren wie &#8220;Slider sind gar nicht so schlecht, wie alle Experten sagen&#8221; sind meistens mehr Clickbait und wenn man genauer hinschaut, sieht man, dass auch diese Autoren Slider im Headerbereich von Home-Seiten schlecht finden. Produkte-Slider oder Bildslider in anderen Bereichen von Websites sollen durchaus Sinn machen.<\/p>\n<p>Trotz all den Argumenten gegen Slider, geht der Trend nur langsam zur\u00fcck. Viele Website-Besitzer w\u00fcnschen sich von Anfang an einen Slider. Warum wohl?<\/p>\n<p>In diesem Beitrag m\u00f6chte ich dir die Haupt-Probleme von Slidern pr\u00e4sentieren. Ich hoffe dies kann auch mal in deiner Slider-Diskussion bei der Entscheidung helfen.<\/p>\n<p>Wenn du ein hartgesottener Slider-Fan bist, dann ist dieser Artikel nicht f\u00fcr dich.<\/p>\n<p>Bevor wir die vielen negativen Punkte durch gehen, zuerst die Vorteile: Wann sind Slider gut und machen Sinn?<\/p>\n<h2>Haben Slider auch Vorteile?<\/h2>\n<h3>Website-Besitzer lieben Slider<\/h3>\n<p>Tja, leider ist das so. Wenn ein Webdesigner unbedingt einen Kunden zufrieden stellen will, dann gibt es ein paar einfache Tricks:<\/p>\n<ul>\n<li>Slider einbauen mit Bildern der Firma und der Produkte<\/li>\n<li>Logo etwas gr\u00f6sser<\/li>\n<li>Eine &#8220;\u00dcber mich&#8221;- und &#8220;Philosophie&#8221;-Seite mit ganz viel Text<\/li>\n<\/ul>\n<p>Website-Besitzer sehen gerne ihr eigenes Logo und eigene Bilder. Sie lesen auch gerne Texte \u00fcber sich selber.<\/p>\n<p>Leider tun das die Besucher in der Regel nicht.<\/p>\n<h2>Und jetzt zu den Nachteilen von Slidern&#8230;<\/h2>\n<h3>\u00dcbersicht<\/h3>\n<ol>\n<li><a href=\"\/#punkt1\">Website-Besucher ignorieren Slider<\/a><\/li>\n<li><a href=\"\/#punkt2\">99% der Interaktionen mit Slidern finden auf dem ersten Slider statt<\/a><\/li>\n<li><a href=\"\/#punkt3\">Websites mit Slider laden langsamer<\/a><\/li>\n<li><a href=\"\/#punkt4\">Slider verschlechtern die Position in Suchmaschinen<\/a><\/li>\n<li><a href=\"\/#punkt5\">Der Content rutscht nach unten<\/a><\/li>\n<li><a href=\"\/#punkt6\">Wir k\u00f6nnen nicht lesen, wenn sich da oben etwas bewegt<\/a><\/li>\n<li><a href=\"\/#punkt7\">Es ist der falsche Moment<\/a><\/li>\n<li><a href=\"\/#punkt8\">Slider nehmen dem Besucher die Kontrolle weg<\/a><\/li>\n<\/ol>\n<h3>1. Website-Besucher ignorieren Slider<\/h3>\n<p>Kennst du die Grafiken, die darstellen, worauf die Augen des Besuchers fixieren?<\/p>\n<p>\t\t\t\t<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/walterlernt.ch\/blog\/wp-content\/uploads\/2022\/08\/heatmap-300x200.jpg\" alt=\"Heat Map\" itemprop=\"image\" height=\"200\" width=\"300\" title=\"heatmap\"  \/><br \/>\n\t\tHeat Map als Beispiel<\/p>\n<p>Das ist ein Heat Map. Es stellt dar, worauf die Augen fixieren, wenn eine Website gelesen wird.<\/p>\n<p>Besucher \u00fcberspringen Slider, genau wie l\u00e4stige Werbebanner \u00fcbersprungen werden.<\/p>\n<h3>2. 99% der Interaktionen mit Slidern finden auf dem ersten Slider statt<\/h3>\n<p>Der erste Slide wird schon oft einfach \u00fcbersprungen. Es geht aber noch schlimmer: Schon vor Jahren war bekannt, dass\u00a0Besucher <a href=\"https:\/\/erikrunyon.com\/2013\/01\/carousel-stats\/\" target=\"_blank\" rel=\"noopener\">nicht mit den Slides interagieren<\/a>, die hinter dem ersten Slide versteckt sind.<\/p>\n<p>Warum weitere Slides anh\u00e4ngen, wenn die nicht angeschaut werden und nur weitere Nachteile bringen?<\/p>\n<h3>3. Websites mit Slider laden langsamer<\/h3>\n<p>Weil wir mehrere grosse Bilder haben, m\u00fcssen all beim Seitenaufruf geladen werden. Das bedeutet die Dateimenge w\u00e4chst. Und das macht eine Website langsam.<\/p>\n<p>5 grosse Bilder laden langsamer als 1 grosses Bild.<\/p>\n<p>Nicht selten sehe ich sogar Slider mit Hintegrundbildern, die 5MB pro Bild \u00fcberschreiten. Das ist enorm! Selber bemerkt man es kaum, denn nach dem ersten Laden sind die Bilder im Browsercache f\u00fcr zuk\u00fcnftige Nutzung gespeicht. So wirkt die Website beim 2. Laden schneller.<\/p>\n<h3>4. Slider verschlechtern die Position in Suchmaschinen<\/h3>\n<p><a href=\"https:\/\/searchengineland.com\/google-now-counts-site-speed-as-ranking-factor-39708\" target=\"_blank\" rel=\"noopener\">Langsam ladende Websites sind ein Nachteil in der Suchmaschinen-Optimierung<\/a>. Slider verlangsamen Websites, also verschlechtern sie auch das Ranking.<\/p>\n<p>Der Inhalt der Slider gilt als versteckter Inhalt und wird deshalb bei der Desktop-Suche weniger ber\u00fccksichtigt als statischer Inhalt.<\/p>\n<p>Dazu kommt, dass ich in fast keinem Fall direkt zu einem Slider verlinken kann.<\/p>\n<h3>5. Der Content rutscht nach unten<\/h3>\n<p>Ein grosses Bild nimmt viel Platz. Der interessante Content rutscht nach unten, wird abgeschnitten und im d\u00fcmmsten Fall nicht einmal gesehen.<\/p>\n<p>In vielen <a href=\"https:\/\/www.walterlernt.ch\/2016\/02\/20\/user-tests\/\">User-Tests<\/a> habe ich das schon erlebt, wie Besucher gar nicht gemerkt haben, dass unten noch mehr Content zu lesen w\u00e4re \u2013 w\u00e4re da nicht ein Slider im Weg. Das passiert besonders oft, wenn durch die Bildschirm- oder Fenstergr\u00f6sse genau nach dem Slider der Rand (oft &#8220;Fold&#8221; genannt) kommt und kein abgeschnittener Content zu sehen ist.<\/p>\n<h3>6. Wir k\u00f6nnen nicht lesen, wenn sich da oben etwas bewegt<\/h3>\n<p>Eine menschliche Alarm-Funktion bremst uns. Bewegung lenkt uns ab.<\/p>\n<p>Wir sind so gebaut: Farben und Details nehmen wir im \u00e4usseren Blickwinkel kaum wahr. F\u00fcr Bewegung sind wir dort aber sehr empfindlich. Eine kleine Bewegung zieht schon unsere Aufmerksamkeit an.<\/p>\n<p>Fr\u00fcher war es ein wildes Tier, das uns m\u00f6glicherweise fressen wollte.<\/p>\n<p>Heute sind es Slides, die pl\u00f6tzlich zur Seite fahren. <strong>Wenn sich im peripheren Blickfeld etwas bewegt, dann k\u00f6nnen wir nicht lesen. <\/strong>Wir werden unterbrochen.<\/p>\n<p>Menschen haben also ein Slider-Warn-System.<\/p>\n<h3>7. Es ist der falsche Moment<\/h3>\n<p>Wenn ich einen Physiotherapeuten suche, dann will ich nicht als erstes Bilder von seiner Praxis sehen. Auch nicht gekaufte Bilder von wundersch\u00f6nen Patienten mit Orchideen hinter dem Ohr. Oder runden Steinen auf dem R\u00fccken.<\/p>\n<p>Ich will wissen, wer der Therapeut ist, wo er ist und vor allem, <strong>wie er mir helfen kann<\/strong>.<\/p>\n<p>Sp\u00e4ter habe ich vielleicht Lust auf ein paar sch\u00f6ne Bilder.<\/p>\n<p>\t\t\t\t<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/walterlernt.ch\/blog\/wp-content\/uploads\/2022\/08\/massage-2717431_1920-300x200.jpg\" alt=\"Massage\" itemprop=\"image\" height=\"200\" width=\"300\" title=\"massage-2717431_1920\"  \/><br \/>\n\t\tSchreckliches Bild f\u00fcr Wellness-Websites<\/p>\n<h3>8. Slider nehmen dem Besucher die Kontrolle weg<\/h3>\n<p>Wer mag Dia-Shows mit Bildern, die nach einer gewissen Anzahl Sekunden wechseln. Richtig, niemand. Alle wollen die Kontrolle haben. Solange Benutzer die Kontrolle haben, f\u00fchlen sie sich wohl. Bilder, die von selber wechseln verschlechtern fast immer die Benutzerfreundlichkeit.<\/p>\n<h3>Ja, ich weiss, grosse Firmen nutzen Slider<\/h3>\n<p>Einige sehr grosse und bekannte Firmen nutzen Slider auf ihren Websites. Das ist nicht wirklich ein starkes Argument f\u00fcr Slider.<\/p>\n<p>Grosse, erfolgreiche Firmen behandeln zum Teil auch Mitarbeiter schlecht oder hinterziehen Steuern.<\/p>\n<h2>Okay, okay, Slider sind schlecht. Aber was ist besser?<\/h2>\n<h3>Ein einfacher Verbesserungsvorschlag<\/h3>\n<p>Stell dir einen Slider mit nur einem Slide vor:<\/p>\n<ul>\n<li>Ein visuell ansprechendes, aussagekr\u00e4ftiges Bild<\/li>\n<li>Ein knackiger Text<\/li>\n<li>Eine Call-To-Action \u2013 zum Beispiel ein Knopf mit Aufruf<\/li>\n<\/ul>\n<p>Das beste Bild, mit dem besten Text und der wirksamsten Aufforderung.<\/p>\n<p>Ich bin sogar sehr f\u00fcr die <strong>visuelle Darstellung von Kernaussagen<\/strong>\u00a0und grafisch attraktiven Websites. Aber bitte nur eine Kernaussage. Das zeigt auch, dass man Priorit\u00e4ten setzen kann und weiss was man will.<\/p>\n<p>Ein Slider stinkt nach &#8220;Jede Abteilung hat das Recht, einen Slide f\u00fcr unsere Website zu gestalten.&#8221;.<\/p>\n<p><strong>Slider sind eine schlechte Idee.<\/strong><\/p>\n<h2>Mein Kunde bedroht mich und will einen Slider<\/h2>\n<p>Solltest du in dieser Situation stecken, empfehle ich mit aller Kraft dagegen zu k\u00e4mpfen. Sei mutig. Wunden heilen.<\/p>\n<p>Stehst du immer noch an und will der Kunde unbedingt einen Slider, dann versuch bitte den Schaden zu minimieren:<\/p>\n<h3>Achte auf kurze Ladezeiten<\/h3>\n<p>Optimiere die Bilder, versuch so wenig Slides wie m\u00f6glich zu haben und optimiere auch den Rest der <a href=\"https:\/\/www.walterlernt.ch\/2017\/10\/11\/website-performance-und-seo\/\">Website f\u00fcr Performance<\/a>.<\/p>\n<h3>Gib dem Besucher die Kontrolle<\/h3>\n<p>Nimm den Auto-Plau raus. Kn\u00f6pfe f\u00fcr Play und Pause minimieren den Schaden. Slides sollen nur wechseln, wenn der User dies w\u00fcnscht.<\/p>\n<p>Die Navigations-Elemente sollen offensichtlich sein. Drei kleine Punkte unter den Bildern oder Pfeile, die nur erscheinen, wenn der Mauszeiger \u00fcber dem Bild ist, reicht nicht.<\/p>\n<h3>Halte die Wechsel-Frequenz tief<\/h3>\n<p>Oder eben, nur manuell. Setzt sich hier ein Kunde durch und verlangt automatisch wechselnde Bilder, dann halte die Frequenz tief. Weniger Wechsel bedeutet weniger Verwirrung und Ablenkung.<\/p>\n<h3>Weniger Slides<\/h3>\n<p>Je weniger desto besser. Wie erw\u00e4hnt wird die Ladezeit verk\u00fcrzt, es wird aber auch die Verwirrung reduziert.<\/p>\n<h2>Mehr zur Slider-Diskussion:<\/h2>\n<ul>\n<li>Yoast:\u00a0<a href=\"https:\/\/yoast.com\/opinion-on-sliders\/\" target=\"_blank\" rel=\"noopener\">Sliders suck and should be banned from your website<\/a><\/li>\n<li>Beantin:\u00a0<a href=\"http:\/\/beantin.se\/sliding-banner-content-slider-carousel-rotator\/\" target=\"_blank\" rel=\"noopener\">That Big Sliding Banner? Yeah, it&#8217;s Rubbish.<\/a><\/li>\n<li>Wider Funnel:\u00a0Rotating offers: The scourge of home page design<\/li>\n<li>VWO:\u00a0<a href=\"https:\/\/vwo.com\/blog\/image-slider-alternatives\/\" target=\"_blank\" rel=\"noopener\">Image Carousels \u2013 Why You Shouldn\u2019t Use Them and How to Use Them the Right Way (If You Have To)<\/a><\/li>\n<li>CXL:\u00a0<a href=\"https:\/\/conversionxl.com\/blog\/dont-use-automatic-image-sliders-or-carousels\/\" target=\"_blank\" rel=\"noopener\">Don\u2019t Use Automatic Image Sliders or Carousels<\/a><\/li>\n<li>Fahad Muhammad: <a href=\"https:\/\/instapage.com\/blog\/6-reasons-why-image-sliders-are-bad-for-conversions\" target=\"_blank\" rel=\"noopener\">6 Reasons Why Image Sliders Are Bad for Conversions<\/a><\/li>\n<li>Envato:\u00a0<a href=\"https:\/\/medium.com\/envato\/design-debate-are-image-carousels-ux-assets-or-liabilities-3b10f2fe221f\" target=\"_blank\" rel=\"noopener\">Design debate: are image carousels UX assets or liabilities?<\/a><\/li>\n<li>Search Engine Land:\u00a0Homepage Sliders: <a href=\"https:\/\/searchengineland.com\/homepage-sliders-are-bad-for-seo-usability-163496\" target=\"_blank\" rel=\"noopener\">Bad For SEO, Bad For Usability<\/a><\/li>\n<li>MosterPost:\u00a0<a href=\"https:\/\/www.templatemonster.com\/blog\/sliders-and-carousels\/\" target=\"_blank\" rel=\"noopener\">How Not to Ruin The Site with Carousel?<\/a><\/li>\n<li>MH Themes:\u00a0<a href=\"https:\/\/www.mhthemes.com\/blog\/why-sliders-are-not-great\/\" target=\"_blank\" rel=\"noopener\">Why website sliders aren\u2019t as great as most people think<\/a><\/li>\n<li>Orbit Media Studios:\u00a0<a href=\"https:\/\/www.orbitmedia.com\/blog\/rotating-sliders-hurt-website\/\" target=\"_blank\" rel=\"noopener\">Do Rotating Sliders Help or Hurt Your Website? [Research Roundup]<\/a><\/li>\n<\/ul>\n<h3 class='uabb-testimonial-author-name testimonial-author-name'>Lee Duddell<\/h3>\n<p>\t\t\t\t\t\t\t\tWhatUsersDo\t\t\t\t\t\t\t<\/p>\n<p>They are next to useless for users and often \u2018skipped\u2019 because they look like advertisements. Hence, they are a good technique for getting useless information on a homepage\u2026 Use them to put content that users will ignore on your homepage. Or, if you prefer, don\u2019t use them. Ever.<\/p>\n<h3 class='uabb-testimonial-author-name testimonial-author-name'>Adam Fellwoes<\/h3>\n<p>\t\t\t\t\t\t\t\tDigerati\t\t\t\t\t\t\t<\/p>\n<p>Almost all of the testing I\u2019ve managed has proven that content delivered via carousels are missed by most users. Few interact with them and many comment that they look like adverts \u2013 we\u2019ve witnessed the banner blindness concept in full effect.<\/p>\n<h3 class='uabb-testimonial-author-name testimonial-author-name'>Craig Kistler<\/h3>\n<p>\t\t\t\t\t\t\t\tSignet\t\t\t\t\t\t\t<\/p>\n<p>In all the testing I have done, homepage carousels are completely ineffective\u2026\u00a0In test after test the first thing the visitor did when coming to a page with a large carousel is scroll right past it and start looking for triggers that will move them forward with their task.<\/p>\n<p>Quelle der Zitate:\u00a0<a href=\"https:\/\/www.orbitmedia.com\/blog\/rotating-sliders-hurt-website\/\" target=\"_blank\" rel=\"noopener\">https:\/\/www.orbitmedia.com\/blog\/rotating-sliders-hurt-website\/<\/a><\/p>\n<h2>Kurs-Tipp: Suchmaschinen-Optimierung<\/h2>\n<p>Deine Website k\u00f6nnte im Google-Ranking besser positioniert sein. Das bringt dir mehr Kunden und mehr Umsatz.<\/p>\n<p>In unserem Kurs <em>SEO Starter<\/em> zeigen wir wie das geht.<\/p>\n<p>\t\t\t<a href=\"https:\/\/www.walterlernt.ch\/strategie\/seo\/\" target=\"_self\" role=\"button\" rel=\"noopener\"><br \/>\n\t\t\t\t\t\t\t\t\t\t\tDetails und Anmeldung<br \/>\n\t\t<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Slider sind eine schlechte Idee. In diesem Beitrag erkl\u00e4re ich die 8 Hauptprobleme.<\/p>\n","protected":false},"author":1,"featured_media":83188,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[264,263],"tags":[177],"class_list":["post-9037","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design-kreativitaet","category-wordpress-webdesign","tag-slider"],"_links":{"self":[{"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/posts\/9037","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/comments?post=9037"}],"version-history":[{"count":0,"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/posts\/9037\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/media\/83188"}],"wp:attachment":[{"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/media?parent=9037"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/categories?post=9037"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/walterlernt.ch\/blog\/wp-json\/wp\/v2\/tags?post=9037"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}