Webdesign und SEO: Warum schöne Websites schlecht ranken

Du kennst die Situation vermutlich. Ein Unternehmen lässt seine Website neu bauen. Im Abnahmetermin sind alle begeistert: große Bilder, viel Weißraum, sanfte Animationen. Drei Monate später sitzt dieselbe Runde wieder zusammen, diesmal schweigend, und schaut auf eine Kurve, die nach unten zeigt. Weniger Sichtbarkeit, weniger Anfragen.

Die naheliegende Erklärung lautet: Webdesign und SEO vertragen sich eben nicht. Diese Erklärung ist bequem und sie ist falsch. Die beiden Disziplinen geraten fast nie miteinander in Konflikt. In Konflikt gerät Design, das einen Eindruck hinterlassen soll, mit Design, das eine Aufgabe löst.

In diesem Beitrag gehe ich sieben Muster durch, die in beinahe jedem Projekt auftauchen. Sie sehen gut aus, sie sind schnell gebaut, und sie kosten Sichtbarkeit und Conversions. Zu jedem Muster bekommst du Zahlen, eine Alternative und einen Weg, das Problem an deiner eigenen Seite zu prüfen. Wenn gerade ein Relaunch ansteht, lohnt sich die Liste doppelt: Nach dem Livegang wird jeder dieser Punkte teurer.

Die Schnittstelle von Webdesign und SEO: wo sie wirklich verläuft

Fangen wir mit einer Klarstellung an, weil sie viel Verwirrung auflöst: Google bewertet keine Schönheit. Es gibt kein Ranking-Signal für gelungene Typografie und keinen Bonus für ein mutiges Farbkonzept. Wer sagt, gutes Design bringe automatisch bessere Rankings, macht es sich zu einfach.

Design wirkt trotzdem auf Rankings, aber nur über drei Wege. Wenn du diese drei kennst, weißt du bei fast jeder Gestaltungsfrage, woran du bist.

• Technik. Was kostet die Gestaltung an Ladezeit und Reaktionsfähigkeit? Große Bilder, zusätzliche Skripte und Effekte schlagen sich direkt in den Core Web Vitals nieder, also in den Messwerten, mit denen Google die Nutzungsqualität einer Seite bewertet.
  
• Struktur. Was findet die Suchmaschine, was ist sinnvoll verlinkt, was ist als Überschrift ausgezeichnet? Überschriftenebenen, Navigationspunkte und Linktexte sind Designentscheidungen mit unmittelbarer SEO-Wirkung.

• Verhalten. Finden Menschen, wofür sie gekommen sind? Wer auf deiner Seite nicht fündig wird, geht zurück zu Google und klickt das nächste Ergebnis an. Ob Google dieses Verhalten direkt als Ranking-Signal verwendet, ist unter Fachleuten umstritten. Für dein Geschäft ist die Frage nebensächlich: Der Interessent ist weg.

Der dritte Weg ist der wichtigste und der am meisten unterschätzte. Dazu gehört ein Grundsatz von Jakob Nielsen, einem der Begründer der Usability-Forschung und Mitgründer der Nielsen Norman Group. Er ist als Jakobs Gesetz bekannt:

Nutzer verbringen die meiste Zeit auf anderen Websites als deiner. Sie erwarten deshalb, dass deine Seite so funktioniert wie all die anderen, die sie kennen.
Jakob Nielsen, Nielsen Norman Group

Jede Abweichung von einem vertrauten Muster ist damit eine Bitte an deine Besucher, etwas Neues zu lernen. Manchmal ist diese Bitte gerechtfertigt. Meistens nicht.

Meine Designerin hat das neulich auf einen Punkt gebracht, der mir seither nicht mehr aus dem Kopf geht:

Insgesamt stelle ich immer häufiger fest, dass die besten Designmuster und Layouts aus den 90er-Jahren stammen, und viele Experten bestätigen das ebenfalls. Damals lag der Fokus vor allem darauf, ein Problem zu lösen, und nicht darauf, einen Eindruck zu hinterlassen. Da jedoch die heutigen Marketingrealitäten bei vielen Projekten die Emotionen der Kunden in den Vordergrund stellen, muss man ein Gleichgewicht zwischen bewährten, funktionierenden Mustern und einer visuell ansprechenden Gestaltung finden.

Genau um dieses Gleichgewicht geht es. Nicht um die Rückkehr zu grauen Kästen. Am Ende des Artikels komme ich darauf zurück.

Menschen lesen deine Website nicht, sie überfliegen sie

Bevor wir zu den einzelnen Mustern kommen, brauchst du eine Beobachtung, die alle sieben erklärt. Sie stammt aus „Don’t Make Me Think“ von Steve Krug, und sie ist der wichtigste Satz, den man über Websites wissen kann: Menschen lesen Webseiten nicht. Sie scannen sie.

Niemand arbeitet eine Seite Zeile für Zeile ab. Der Blick springt über Überschriften, hervorgehobene Begriffe, Links und alles, was optisch heraussticht, und sucht nach dem Einen, das zum aktuellen Ziel passt. Sobald etwas halbwegs Passendes auftaucht, wird geklickt. Nicht die beste Option gewinnt, sondern die erste plausible.

Krug vergleicht das mit einem Plakat an der Autobahn, an dem man mit Tempo 120 vorbeifährt. Es hat keine zwei Sekunden Zeit, und es bekommt keine zweite Chance. Genau so betrachten Menschen deine Startseite.

Daraus folgt der Satz, an dem sich alles Weitere aufhängt: Visuelle Hierarchie ist keine Dekoration, sie ist Navigation. Wer sie nach Geschmack statt nach Bedeutung baut, nimmt den scannenden Besuchern ihr einziges Werkzeug weg.

Die folgenden sieben Muster tun genau das, jedes auf seine eigene Weise. Deshalb kosten sie Conversions. Und weil einige von ihnen zusätzlich Technik und Struktur belasten, kosten sie obendrein Rankings.

Sieben Designmuster, die Rankings und Conversions kosten

1. Der Slider im Hero-Bereich

Der Slider ist selten eine Designentscheidung. Er ist ein Verhandlungsergebnis. Der Vertrieb will sein Angebot oben, das Personalmarketing seine Stellenanzeige, die Geschäftsführung das Jubiläum. Ein Slider löst diesen Streit, indem er ihn vertagt: Jeder bekommt eine Folie, niemand muss sich entscheiden.

Die bekannteste Messung dazu stammt von Erik Runyon, der auf der Website der University of Notre Dame Klicks auf Slider ausgewertet hat: Bei 3,7 Millionen Besuchen klickte rund ein Prozent überhaupt auf eine Folie, und 84 Prozent dieser Klicks entfielen auf die erste. Die Folien zwei bis fünf teilen sich also einen Bruchteil eines Prozents.

Diese Auswertung ist von 2013, und die Frage nach aktuelleren Daten ist berechtigt. Das Baymard Institute untersucht das Thema fortlaufend und kommt heute zum selben Ergebnis. Aus den laufenden Erhebungen: Noch etwa ein Drittel der großen Shops in den USA und Europa setzt auf der Startseite einen Slider ein, Tendenz seit Jahren fallend. Bei knapp der Hälfte davon ist die Umsetzung fehlerhaft. Und in Baymards eigenen Nutzertests schneidet eine feste Anordnung genauso gut ab wie ein perfekt umgesetzter Slider, ist aber deutlich einfacher richtig zu bauen. Der Grund dafür ist bekannt: Slides sehen aus wie Werbung und werden deshalb übersehen, ein Effekt, den man aus der Werbeforschung als Banner Blindness kennt.

Dazu kommt die technische Seite, und die trifft direkt ein Ranking-Signal. Google misst, wie schnell das größte sichtbare Element im ersten Bildausschnitt erscheint. Dieser Wert heißt Largest Contentful Paint, kurz LCP, und bei den meisten Seiten ist genau das Hero-Bild dieses Element. 

Ein Slider macht daraus den ungünstigsten Fall: mehrere große Bilder statt einem, dazu zusätzlicher Programmcode. Werden die Folien nachträglich per Skript geladen, kann der Browser sie beim ersten Durchsehen der Seite nicht erkennen und lädt sie zu spät. Laut dem Web Almanac 2025 sind 73 Prozent dieser gemessenen Elemente auf Mobilgeräten Bilder. An dieser Stelle entscheidet sich also sehr viel.

Was du stattdessen tust: ein fester Hero-Bereich mit einer Aussage, einem Bild und einem Weg. Wenn mehrere Themen unbedingt nach oben müssen, stelle sie nebeneinander statt hintereinander. Baymard weist ausdrücklich darauf hin, dass wichtige Inhalte nie ausschließlich in einem Slider stehen sollten, weil ein großer Teil der Besucher sie nie zu Gesicht bekommt.

So prüfst du es: Lass dir bei PageSpeed Insights anzeigen, welches Element auf deiner Startseite gemessen wird. Ist es das Slider-Bild, hast du deinen Hebel gefunden. Zusätzlich lohnt sich ein Blick in dein Analyse-Werkzeug: In Google Analytics oder Matomo lässt sich das Anklicken einzelner Folien mitzählen. Nach zwei Wochen siehst du schwarz auf weiß, ob die Folien drei bis fünf überhaupt jemanden erreichen.

2. Logo rechts, Navigation hinter dem Hamburger-Menü

Ein aufgeräumter Kopfbereich wirkt souverän. Also wandert das Logo nach rechts, weil das ungewöhnlich aussieht, und die Navigation verschwindet auch auf dem Desktop hinter drei Strichen, dem sogenannten Hamburger-Menü. Mobil kennt das ja jeder.

Die Nielsen Norman Group hat verborgene Navigation quantitativ getestet: 179 Personen, sechs Websites. Das Ergebnis ist deutlich. Wird die Navigation versteckt, halbiert sich ihre Auffindbarkeit nahezu. Die Teilnehmenden brauchten im Schnitt 2,5 Sekunden länger pro Aufgabe und empfanden dieselbe Aufgabe als 15 Prozent schwieriger. Der wichtigste Befund für unser Thema: Auf dem Desktop wiegt das schwerer als auf dem Smartphone. Auf dem kleinen Display ist das Symbol eine Notwendigkeit, auf dem großen ist es eine freiwillige Verknappung.

Diese Untersuchung stammt aus dem Jahr 2015, die Forscher haben sie 2016 vertieft ausgewertet. Eine öffentlich zugängliche Studie in vergleichbarem Umfang ist seither nicht erschienen, sie gilt bis heute als Referenz. Aus der vertieften Auswertung stammt ein praktischer Hinweis, der wenig kostet: Wer auf das Symbol nicht verzichten will, sollte das Wort „Menü“ danebenschreiben. Das allein verbessert die Auffindbarkeit spürbar.

Beim Logo kommt Jakobs Gesetz dazu. Menschen erwarten es links oben, und sie erwarten, dass ein Klick darauf zur Startseite führt. Diese Erwartung stammt aus tausenden anderen Websites. Sie zu brechen bringt keinen Vorteil, es schadet eher.

An dieser Stelle hört man oft ein SEO-Argument, das schlicht nicht stimmt. Es lautet: Google finde Links im Hamburger-Menü schlechter oder gewichte sie geringer, weil sie beim Aufruf der Seite nicht sichtbar sind. Das ist nicht der Fall. Diese Links stehen ganz normal im Quelltext der Seite und werden gefunden wie jeder andere Link auch. Das Problem ist nicht die Suchmaschine, sondern der Mensch: Niemand klickt auf ein Menü, das er nicht sieht. Interne Verlinkung lebt davon, dass sie tatsächlich benutzt wird. Ein Menü, das verborgen bleibt, führt niemanden.

Was du stattdessen tust: Auf dem Desktop bleibt die Navigation sichtbar. Das Logo steht links oben und verlinkt auf die Startseite. Auf oberster Ebene reichen fünf bis sieben Punkte. Wenn du mehr brauchst, ist nicht das Menü das Problem, sondern die Struktur dahinter.

So prüfst du es: Bitte fünf Personen, die das Projekt nicht kennen, um eine konkrete Aufgabe. Zum Beispiel: Finde heraus, ob dieses Unternehmen auch Wartung anbietet, und fordere dafür ein Angebot an. Beobachte, wo sie stocken. Wenn mehrere an derselben Stelle suchen, liegt es an der Navigation und nicht an den Testpersonen.

3. Wichtige Inhalte in Tabs und Akkordeons

Akkordeons machen lange Seiten kurz. Aus zwei Bildschirmseiten Text werden fünf aufgeräumte Zeilen. Das sieht nach Ordnung aus und fühlt sich nach guter Arbeit an.

Zu diesem Muster hält sich hartnäckig ein SEO-Argument, das überholt ist. Man liest bis heute, Google werte eingeklappte Inhalte ab. Das stimmte einmal: 2014 erklärte John Mueller von Google, versteckter Inhalt sei für die Seite offenbar nicht entscheidend und werde entsprechend geringer gewichtet. Mit der Umstellung auf die mobile Bewertung von Websites hat Google diese Haltung geändert und das mehrfach bestätigt, zuletzt im März 2020: Inhalte in Tabs und Akkordeons erhalten das volle Gewicht. Wer heute noch mit der Indexierung gegen Akkordeons argumentiert, argumentiert mit einer Regel von gestern.

Das eigentliche Argument ist ein anderes, und es ist stärker. Google liest den Inhalt vollständig, aber Menschen öffnen ihn nicht. Wer eine Seite überfliegt, sucht. Er klickt nicht fünfmal auf Verdacht, um herauszufinden, ob sich hinter einer Zeile die Antwort verbirgt.

Was du stattdessen tust: Nimm eine einfache Regel. Akkordeons sind gut für Inhalte, die man nachschlägt: häufige Fragen, Versandbedingungen, technische Datenblätter. Sie sind ungeeignet für alles, was überzeugt, zum Beispiel dein Hauptargument, dein Alleinstellungsmerkmal und die Antwort auf die Suchanfrage, mit der jemand gekommen ist. Diese Inhalte stehen im Fließtext.

So prüfst du es: Lass in Google Analytics oder Matomo mitzählen, wie oft die einzelnen Akkordeons geöffnet werden. Öffnet ein Element fast niemand, hast du zwei Möglichkeiten: Der Inhalt ist wichtig, dann gehört er ausgeklappt. Oder er ist verzichtbar, dann kann er weg.

4. Kreative Menüpunkte statt der Wörter, die Menschen suchen

„Leistungen“ klingt nach Baumarkt. „Unsere Welt“ klingt nach Marke. Also heißt der Menüpunkt „Unsere Welt“, das Kontaktformular liegt unter „Sag Hallo“ und die Preisseite unter „Los geht’s“.

Das kostet dich gleich zweimal, und beides trifft genau die Stelle, an der Webdesign und SEO zusammenkommen.

Erstens verrät der Text eines Links, worum es auf der Zielseite geht. Suchmaschinen werten das aus. „Unsere Welt“ sagt darüber nichts, und damit verschenkst du eine der wenigen Stellen, an denen du in eigenen Worten erklären kannst, was eine Seite behandelt.

Zweitens sucht dein Besucher nach dem Wort, das er im Kopf hat. Steht dort ein anderes, entsteht genau die Denkpause, die Krugs Buchtitel verbietet.

Was du stattdessen tust: Benenne Menüpunkte nach den Begriffen, die in deiner Keyword-Recherche auftauchen. Das ist keine Kapitulation vor der Langeweile, sondern Arbeitsteilung. Die Marke lebt in Bildsprache, Tonalität und Text. Das Menü ist ein Wegweiser, und Wegweiser sollen lesbar sein.

5. Überschriften nach Optik statt nach Struktur

In modernen Baukästen wählt man die Überschriftenebene meistens danach aus, wie groß der Text aussehen soll. H2 wirkt zu klobig, also nimmt man H4. Die Folge sind Seiten ohne H1, Seiten mit fünf H1, eine H3 über einer H2 und Absätze, die nur fett formatiert sind und gar keine Überschrift.

Die Gliederung ist aber das Gerüst, an dem sich alle entlanghangeln: Suchmaschinen, Screenreader und vor allem die Besucher, die deine Seite überfliegen. Wer die Ebenen nach Schriftgröße vergibt, baut ein Gerüst, das mit dem Inhalt nichts zu tun hat. Dann gibt es nichts mehr zu überfliegen, und man ist wieder beim Plakat an der Autobahn, auf dem alles gleich groß steht.

Was du stattdessen tust: Trenne die beiden Entscheidungen. Die Ebene ergibt sich aus der Bedeutung, die Größe legt das Design fest. Eine H2 darf klein aussehen, eine H3 darf groß aussehen. Das sind wenige Zeilen CSS und der einzige Weg, der beide Seiten zufriedenstellt.

So prüfst du es: Lass dir die Überschriftenstruktur deiner Seite anzeigen und lies nur die Überschriften. Ergeben sie für sich genommen eine sinnvolle Zusammenfassung, stimmt das Gerüst. Wir haben dafür ein kostenloses Werkzeug gebaut, das dir die Struktur und typische Fehler direkt im Browser anzeigt: den SEO Heading Checker.

6. Scroll-Effekte, die Inhalte erst freigeben

Hier ist eine Einschränkung wichtiger als die Kritik: Dezente Bewegung ist gutes Handwerk. Eine kurze Einblendung lenkt den Blick genau dorthin, wo er hingehört, und gliedert eine lange Seite in Abschnitte.

Läuft sie über CSS mit den Eigenschaften transform und opacity, übernimmt ein spezialisierter Teil des Browsers die Darstellung, und sie kostet praktisch keine Leistung. Wer Animation grundsätzlich verteufelt, verwechselt Werkzeug und Anwendung.

Teuer wird es an drei Stellen. Erstens bei Inhalten, die unsichtbar starten und erst durch ein Skript eingeblendet werden. Lädt dieses Skript spät oder gar nicht, ist der Text für Menschen schlicht weg. Steht er im oberen Bereich, verzögert der Effekt zusätzlich genau das Element, dessen Ladezeit Google misst.

Zweitens bei Skripten, die bei jeder Scroll-Bewegung das Layout neu berechnen. Drittens bei fertigen Effekt-Bibliotheken, die für eine simple Einblendung ein ganzes Programmpaket mitbringen.

Beides zusammen verschlechtert einen Wert namens INP, kurz für Interaction to Next Paint. Er misst, wie lange deine Seite braucht, bis sie nach einem Klick oder Tastendruck sichtbar reagiert, also die gefühlte Reaktionszeit. Google bewertet 200 Millisekunden oder weniger als gut. Schlecht wird der Wert, wenn der Browser gerade mit anderen Aufgaben beschäftigt ist: Er hat deinen Klick registriert, kommt aber nicht dazu, das Ergebnis anzuzeigen. Für den Besucher fühlt sich die Seite dann hakelig an.

Was du stattdessen tust: Bewegung darf begleiten, sie darf keine Voraussetzung sein. Der Inhalt steht im Quelltext und ist auch dann sichtbar, wenn kein Skript läuft. Im obersten Bildausschnitt wird gar nicht animiert. Und wenn jemand in seinem Betriebssystem eingestellt hat, dass er weniger Bewegung sehen möchte, sollte die Website das respektieren. Manche Menschen bekommen von Bewegungseffekten Kopfschmerzen oder Übelkeit.

So prüfst du es: Schalte JavaScript im Browser ab und lade die Seite neu. Was jetzt fehlt, ist nicht wirklich da. Zusätzlich zeigt dir PageSpeed Insights den INP-Wert aus echten Nutzerdaten.

7. Eleganter Kontrast, unlesbare Schrift

Hellgraue Schrift auf weißem Grund, dünne Schnitte, 14 Pixel: Auf dem kalibrierten Monitor im abgedunkelten Büro sieht das ruhig und teuer aus. Im Zug, bei Sonnenlicht, auf einem drei Jahre alten Telefon sieht es nach gar nichts aus.

Wer Text nicht lesen kann, liest ihn nicht. Das ist die ganze Conversion-Rechnung. Betroffen sind zuerst die Menschen mit schlechten Bedingungen oder eingeschränktem Sehvermögen, und das sind mehr, als die meisten Projekte annehmen.

Seit dem 28. Juni 2025 kommt in Deutschland ein zweites Argument dazu. Das Barrierefreiheitsstärkungsgesetz, kurz BFSG, verpflichtet viele Anbieter dazu, ihre digitalen Angebote barrierefrei zu gestalten. Es verweist über die Norm EN 301 549 auf die Richtlinien WCAG 2.1 in Stufe AA, und die verlangen für normalen Text ein Kontrastverhältnis von mindestens 4,5 zu 1. Aus einer Geschmacksfrage ist damit für einen großen Teil der Websites eine Pflicht geworden.

Was du stattdessen tust: Prüfe Kontraste, bevor die Farbpalette freigegeben wird. Das ist eine Entscheidung von fünf Minuten und später ein Umbau, der jede Komponente berührt.

So prüfst du es: Die Entwicklerwerkzeuge in Chrome und Firefox zeigen dir den Kontrastwert jedes Textes an, wenn du ihn auswählst. Einen Überblick über die ganze Seite bekommst du in der Kategorie Barrierefreiheit bei PageSpeed Insights.

Fünf Tests, mit denen du deine Website in einer Stunde prüfst

Für vier dieser fünf Tests brauchst du nichts als einen Browser. Sie funktionieren vor dem Launch genauso wie an einer Seite, die seit drei Jahren online ist. Sie sagen dir nicht, wie du etwas baust, aber sie zeigen dir zuverlässig, wo es klemmt.

1. Der 5-Sekunden-Test.
   Zeig jemandem deine Startseite, nimm sie nach fünf Sekunden weg und frag: Worum geht es hier, und was kann ich tun? Bleibt die Antwort vage, geht es deinen Besuchern genauso.
   
2. Der Kneif-Test.
   Mach einen Screenshot und stell ihn unscharf. Was jetzt noch heraussticht, ist deine tatsächliche visuelle Hierarchie. Ist das der Slider und nicht dein Leistungsversprechen, hast du dein Ergebnis.
   
3. Der Aufgaben-Test.
   Drei echte Aufgaben, fünf Personen, keine Hilfestellung. Steve Krug hat dazu den entlastendsten Satz der ganzen Disziplin geschrieben: Einen einzigen Nutzer zu testen ist hundert Prozent besser, als keinen zu testen.
   
4. Die Hero-Messung.
   PageSpeed Insights auf deine Live-Adresse. Du siehst in zwei Minuten, wie lange dein Hero-Bereich zum Erscheinen braucht und welches Element dafür verantwortlich ist.
   
5. Die Scroll- und Klickkarte.
   Ein Heatmap-Werkzeug zeigt dir, wie weit Menschen überhaupt scrollen. Alles, was systematisch niemand erreicht, ist entweder falsch platziert oder überflüssig.

Wichtig ist dabei die Reihenfolge: erst messen, dann diskutieren. Ein Slider verschwindet selten, weil jemand ihn hässlich findet. Er verschwindet, wenn Zahlen zeigen, dass ihn niemand benutzt.

Ästhetik gegen Funktion? Ein falscher Gegensatz

An dieser Stelle könnte der Eindruck entstehen, gutes Design sei sparsames Design und am besten wäre eine Seite aus grauen Kästen. Das Gegenteil stimmt, und es ist gut belegt.

Masaaki Kurosu und Kaori Kashimura testeten 1995 im Hitachi Design Center 26 Varianten einer Geldautomaten-Oberfläche mit 252 Teilnehmenden. Das Ergebnis ist als Aesthetic-Usability-Effekt bekannt: Der Zusammenhang zwischen empfundener Schönheit und empfundener Bedienbarkeit war stärker als der zwischen Schönheit und tatsächlicher Bedienbarkeit.

Schöne Oberflächen werden also für einfacher gehalten, als sie sind, und Menschen verzeihen ihnen kleine Fehler.

Schönheit ist damit kein Luxus, sondern ein Vertrauenssignal. Für eine Website, die Anfragen erzeugen soll, ist das bare Münze. Die Frage lautet deshalb nicht, ob du gestalten sollst, sondern wo du dein Gestaltungsbudget ausgibst.

• Gib es aus für Bildsprache, Typografie, Weißraum, Farbe, Details und kleine Interaktionen. Hier zahlt Gestaltung direkt auf Vertrauen ein.
  
• Gib es nicht aus für Navigation, Seitenstruktur, Überschriftenebenen und Kontraste. Das sind die tragenden Wände. Wer daran experimentiert, tauscht Orientierung gegen Originalität.

Damit sind wir wieder beim Satz meiner Designerin. Die Muster der 90er waren nicht schön, aber sie lösten Probleme. Die Aufgabe heute besteht nicht darin, sich für eine Seite zu entscheiden, sondern die bewährten Muster als Fundament zu nehmen und die Gestaltung darauf zu setzen statt dagegen.

Und noch eine Sache, die mehr entscheidet als jede Einzelmaßnahme: der Zeitpunkt. SEO gehört bereits in die Konzept-Phase, nicht in die Abnahme. Wenn Struktur, Menüpunkte und Seitentypen zusammen mit dem Layout entstehen, kostet all das nichts extra. Wird SEO erst nach dem Design oder gar nach der Entwicklung dazugeholt, wird daraus ein Umbau, und Umbauten sind teuer und ungeliebt.

Webdesign und SEO zusammenbringen: die wichtigsten Punkte

Schöne Websites ranken nicht schlechter, weil sie schön sind. Sie ranken schlechter, wenn Gestaltung Orientierung ersetzt: wenn fünf Folien eine Aussage verdrängen, wenn ein Menü hinter drei Strichen verschwindet, wenn das Hauptargument eingeklappt ist.

Der Merksatz für die nächste Designabnahme: Menschen überfliegen. Alles, was das Überfliegen erschwert, kostet dich Geld, erst Conversions und dann Rankings.

Wenn du eine Sache aus diesem Artikel mitnehmen willst, dann diesen Test: Öffne morgen früh deine wichtigste Seite, mach einen Screenshot, stell ihn unscharf und schau, was übrig bleibt. Das ist die Seite, die deine Besucher sehen.

Und wenn dabei mehr herauskommt, als du an einem Nachmittag lösen willst: Genau diese Verbindung aus Gestaltung und Sichtbarkeit ist unsere tägliche Arbeit. Wir planen Struktur, Design und SEO von Anfang an gemeinsam, bei einer neuen Website ebenso wie bei einem Relaunch. Sprich uns an, wenn du deine Seite einmal von beiden Seiten betrachtet haben möchtest.

Häufige Fragen zu Webdesign und SEO

Widersprechen sich Webdesign und SEO?

Nein. In Konflikt geraten sie nur, wenn Gestaltung ohne Rücksicht auf Struktur und Ladezeit entsteht. Beide Disziplinen wollen dasselbe: dass Menschen finden, wofür sie gekommen sind. Sie beschreiben es nur mit unterschiedlichen Wörtern.

Sind Akkordeons schlecht für SEO?

Für die Indexierung nicht. Google bewertet Inhalte in Tabs und Akkordeons mit vollem Gewicht. Schlecht sind sie für Conversions, sobald dein Hauptargument darin verschwindet, denn Menschen öffnen sie nur selten.

Braucht ein Webdesigner SEO-Kenntnisse?

Er braucht kein Zertifikat, aber er muss wissen, welche seiner Entscheidungen SEO-Entscheidungen sind: Überschriftenebenen, die Beschriftung der Menüpunkte, Bildgrößen im Hero-Bereich und alles, was per Skript entsteht. Wer diese vier Punkte kennt, vermeidet die meisten Probleme, ohne selbst SEO zu machen.

Welche häufigen Fehler im Webdesign sollte ich vermeiden?

Die sieben aus diesem Artikel decken den Großteil ab. Wenn du nur drei angehen willst, nimm den Slider im Hero-Bereich, die versteckte Navigation auf dem Desktop und wichtige Inhalte im Akkordeon. Sie kommen am häufigsten vor und kosten am meisten.

Was ist gutes Webdesign?

Gutes Webdesign löst die Aufgabe, mit der jemand auf die Seite kommt, und sieht dabei so aus, dass man dem Anbieter zutraut, diese Aufgabe zu lösen. Beides zusammen, nicht eines von beidem.