Zum Inhalt springen
Zur Hauptnavigation springen
Zum Footer springen
  • 10+ Jahre Erfahrung 

  • 900+ erfolgreiche Projekte

  • 300+ ★★★★★ Bewertungen

  • 20+ Experten, europaweit tätig

  • 2400+ Follower auf Youtube

Webdesign-SEO – 17 Tipps, ohne die gar nichts geht!

zuletzt aktualisiert am 03. März 2024
Entwurf eines Webseiten-Layouts mit Notizen und Skizzen
Inhaber & Geschäftsführer von ithelps Digital. Seit 2013 beschäftigt er sich intensiv mit den Themen SEO & Online-Marketing.

Du willst wissen, wie Webdesign und SEO in Kombination die Sichtbarkeit deiner Website massiv erhöhen? In diesem Artikel erfährst du alles darüber!


Das Wichtigste in Kürze:

  1. Webdesign-SEO ist entscheidend für die Sichtbarkeit einer Website in Suchmaschinen und beinhaltet die Integration von SEO-relevanten Faktoren in das Webdesign, um die Website suchmaschinenfreundlicher zu gestalten.
  2. Die Kombination aus modernem Webdesign und gezielter Suchmaschinenoptimierung (SEO) ist notwendig, um Produkte oder Dienstleistungen optimal zu präsentieren und Interessenten in Kunden zu verwandeln.
  3. Wichtige Webdesign-SEO-Kriterien umfassen sprechende URLs, einen überzeugenden "Above-the-Fold"-BereichBenutzerfreundlichkeit und technische Aspekte wie Mobile Friendlyness und schnelle Ladezeiten.
  4. Strukturierte Daten und eine optimierte SERP Snippet-Gestaltung erhöhen die Präsenz in den Suchergebnissen und können die Click-Through-Rate (CTR) deutlich steigern.
  5. Neben Webdesign-SEO spielen auch andere SEO-Maßnahmen wie Keyword-Recherche, SEO-Texte und eine umfangreiche Linkbuilding-Strategie eine wichtige Rolle für eine erfolgreiche Suchmaschinenoptimierung.

Eine neue Webseite mit modernem Webdesign – das ist der Wunsch vieler Unternehmer. Doch, was hilft dir die beste und schönste Website, wenn sie keine oder kaum Besucher hat und du keine Kunden damit generierst?

Genau. Nichts.

Webseiten haben zum einen die Aufgabe, dein Produkt oder deine Dienstleistung bestmöglich zu präsentieren und zum anderen müssen sie Interessenten in Kunden verwandeln. Diese Aufgaben können sie jedoch nur erfüllen, wenn sie in den Suchmaschinen gefunden werden und dort Besucher generieren.

Dies ist der Grund, warum eine Website ein gutes, funktionales Webdesign und SEO gleichermaßen braucht. Zeitgemäßes Webdesign unterstützt die Suchmaschinenoptimierung deiner Website und trägt dazu bei, dass sie in Google gefunden wird.

Wenn du mehr darüber erfahren möchtest, wie du deine Website suchmaschinenfreundlicher gestalten kannst, dann lies dir den Artikel aufmerksam durch. Du wirst einige Goldnuggets darin finden.

Was ist SEO-Webdesign bzw. Webdesign-SEO?

Webdesign-SEO bezeichnet die Umsetzung von SEO-relevanten Faktoren bei der Erstellung einer Website, um diese suchmaschinenfreundlicher zu gestalten. Es geht beim Webdesign also nicht nur um die offensichtlichen grafischen Elemente, sondern auch und vor allem um die Umsetzung von Funktionen, strukturellen und technischen Kriterien, die Google und andere Suchmaschinen als sogenannte Rankingfaktoren vorgeben.

Manche der Maßnahmen sind sichtbar, wie ein überzeugender „Above-the-Fold“-Bereich, ein Inhaltsverzeichnis oder eine klare Überschriften-Struktur, andere sind für den User unsichtbar im Code der Website versteckt. Zusammen ergeben sie ein SEO-Webdesign, das neben anderen Maßnahmen der Suchmaschinenoptimierung (z. B. Keyword-Recherche, SEO-Texte oder Bilder-SEO) dafür sorgen, dass deine Webseiten im besten Fall bei Google auf den vorderen Positionen gefunden werden.

Diese SEO-Kriterien sollte deine Website bzw. deren Webdesign erfüllen:

OnPage Webdesign-SEO-Kriterien

  • „Sprechende“ URLs (Uniform Resource Locator)
  • Der „Above the Fold“-Bereich (Die 3-Sekunden-Regel) Internetnutzer sind ungeduldig, 3 Fragen beantworten
  • Usability und Benutzerfreundlichkeit
  • Menüstruktur
  • Inhaltsverzeichnis
  • Überschriften-Struktur
  • Citations

Technische Webdesign-SEO-Kriterien

  • Mobile Friendlyness
  • Schnelle Ladezeiten
  • Das SERP Snippet
    • URL
    • Title-TAG
    • Meta Description
  • robots.txt
  • HTTPS-Zertifikat
  • Sitemap bereitstellen
  • Strukturierte Daten (structured data)

Warum ist SEO-Webdesign so wichtig?

SEO-Webdesign ist deshalb so wichtig, weil es zum einen für das Ranking in Google erforderlich ist, und zum anderen, weil es einen maßgeblichen Einfluss auf das Nutzer-Verhalten (Conversion, Kauf, Verweildauer, etc.) hat.

Ein Webdesign, das auf die wichtigen Kriterien der Suchmaschinenoptimierung Rücksicht nimmt, geht auf die Bedürfnisse der Webseitenbesucher ein und sorgt so dafür, dass sich diese auf deiner Website wohlfühlen und innerhalb kürzester Zeit intuitiv damit zurechtkommen – was sich positiv auf die Verkaufszahlen, Newsletter-Einträge, Anzahl der Anfragen, etc. auswirkt.

Sehen wir uns jetzt daher die einzelnen Kriterien kurz an und besprechen, was du dabei beachten musst.

Die wichtigsten SEO-Webdesign-Maßnahmen

 „Sprechende“ URLs (Uniform Resource Locator)

Sprechende URLs sind kurz und aussagekräftig. Im Idealfall beinhalten sie das Fokus-Keyword. Dadurch sind sie für Google leicht einzuordnen und für die User einfach zu merken, zu teilen oder in die Adresszeile des Browsers einzutippen.

Beispiele sprechender URLs bei einem Dienstleistungsanbieter:

Beispiele sprechender URLs bei einem Webshop:

  • Domain (Startseite): https://www.firmenname.com
  • Kategorie-Seite: https://www.firmenname.com/kategorie
  • Produktseite: https://www.firmenname.com/kategorie/produktname

ithelps Expertentipp

Achte darauf, dass deine URLs nicht nur sprechend und keyword-reich sind, sondern auch konsistent über deine gesamte Website hinweg strukturiert sind. Eine konsistente Struktur erleichtert es sowohl Suchmaschinen als auch Nutzern, die Hierarchie und den Aufbau deiner Website zu verstehen.

Der „Above the Fold“-Bereich

Der „Above the Fold“-Bereich ist jener Bereich, den der User ohne zu Scrollen sieht, wenn er eine Webadresse besucht. Dieser Bereich ist aus Sicht der Suchmaschinenoptimierung besonders wichtig.

User, die durch einen Klick auf das SERP Snippet (später mehr darüber) in den Google Suchergebnissen oder einen anderen Link auf deine Webseite gelangen, haben 3 Fragen.

  • Bin ich hier richtig?
  • Was ist für mich drin?
  • Kann ich der Seite vertrauen?

Zur Beantwortung dieser Fragen hast du in der Regel 3-5 Sekunden Zeit. Gelingt dir das nicht, verlässt der User (dein potenzieller Kunde) die Seite wieder und ist mit hoher Wahrscheinlichkeit für immer verloren.

Aus diesem Grund solltest du dafür sorgen, die wichtigsten Informationen im „Above the Fold“-Bereich zu platzieren. Bei unserer Startseite sieht das z. B. so aus:

above the fold bereich einer webseite

Beachtest du diese SEO-Regel nicht, und die User verlassen deine Webseite nach einigen Sekunden wieder, sendet dies ein negatives Signal an Google und du wirst in den Suchergebnissen zurückfallen.

Usability und Benutzerfreundlichkeit

Usability und Benutzerfreundlichkeit sind aus demselben Grund wichtige Webdesign-SEO-Kriterien wie beim vorherigen Punkt. Es geht darum, die Nutzer so lange wie möglich auf der Website zu halten. Je länger, desto besser für deine Rankings. Jedes positive Signal, das Google registriert, wirkt sich dementsprechend positiv auf deine Positionen in den Suchmaschinen aus.

Hier einige Maßnahmen, die du ganz einfach umsetzen kannst:

Die Menüstruktur

Erstelle eine Menüstruktur, bei der sich die Nutzer intuitiv zurechtfinden. Achte dabei darauf, dass jede Unterseite mit maximal 3 Klicks erreichbar ist. Man nennt dies die Klicktiefe. Google liebt Seiten mit geringer Klicktiefe.

Hier die Menüstruktur der Website von IKEA:

menuestruktur von der ikea website

Das Inhaltsverzeichnis

Bei Blogartikel, die oftmals eine Vielzahl an Headlines und Subheadlines haben, hat sich ein Inhaltsverzeichnis als besonders benutzerfreundlich erwiesen.

Der Hintergrund: Google-User oder Nutzer anderer Suchmaschinen sind auf der Suche nach Informationen. Diese Informationen wollen sie schnell und ohne lange suchen zu müssen finden.

Bei einem Blogartikel mit 1500, 2000 oder gar 5000 Wörtern bzw. 10, 15 oder mehr Kapiteln mit dazugehörigen Subheadlines würde sich die Informationssuche als schwierig und langwierig erweisen.

Hilf deinen Lesern mit einem Inhaltsverzeichnis, wie dem folgenden aus unserem Blogbeitrag Die 10 WordPress-Plugins, die du 2024 brauchst:

inhaltsverzeichnis eines blogartikels

Die Überschriften-Struktur

Webseitenbesucher tendieren dazu, die Inhalte einer Website zu scannen, bevor sie eventuell tiefer darin eintauchen. Eine klare, hierarchisch sinnvolle Überschriften-Struktur hilft dem Leser, die wichtigsten Inhalte schon beim Überfliegen zu erfassen. Überschriften (Headlines oder H-TAGs) und Unter- oder Zwischenüberschriften (Subheadlines) gliedern die Inhalte und führen den Leser wie ein roter Faden von Beginn bis zum Ende durch die Webseite.

Überschriften werden als H-TAGs bezeichnet – wobei das H für Headline steht – und sind von H1 (Hauptüberschrift) bis H6 je nach Stellung in der Hierarchie durchnummeriert.

So sollte eine klare Überschriften-Struktur aussehen:

darstellung einer ueberschriftenstruktur

Dies ist die technische Umsetzung der Überschriften, also Bestandteils des Webdesigns und somit Aufgabe des Webdesigners. Überschriften spielen in der Suchmaschinenoptimierung eine weitere wichtige Rolle, nämlich beim Verfassen der Textinhalte einer Website – die sogenannten SEO-Texte.

Citations

Sorge dafür, dass deine Firmenangaben – Firmenname, Adresse, Öffnungszeiten, Telefonnummer, E-Mail-Adresse – auf deiner Homepage und allen Unterseiten klar ersichtlich sind. Das kann beispielsweise in Form einer Topbar gelöst werden, wie auf unserer Webpräsenz.

citations auf einer Webseite

Bei den Firmenangaben solltest du darauf achten, dass diese auf deiner Website, bei Google Business Profile, allen Firmenverzeichnissen, deinen Social-Media-Auftritten und überall sonst im Internet gleichlautend und auch gleich geschrieben sind. Das hilft Google, sie eindeutig zu identifizieren und deinem Unternehmen zuzuweisen.

Das waren die sichtbaren Webdesign-SEO-Maßnahmen. Kommen wir jetzt zu den technischen.

Mobile Friendlyness

Moderne Webseiten müssen mobile friendly sein. Das heißt, sie müssen auf Smartphones genauso fehlerfrei angezeigt werden und bedienbar sein, wie auf dem Desktop oder Tablet.

grafische darstellung von pc-bildschirm, tablet und smartphone

Darauf legt Google besonderen Wert, da ein Großteil der Google User mit dem Smartphone im Internet surft und nach Informationen sowie Produkten sucht.

Wenn du feststellen willst, ob deine Webseite mobile friendly ist, prüfe sie mit dem Google Developer Tool Mobile Friendly Test.

Schnelle Ladezeiten

Ein weiteres wichtiges Kriterium von Webdesign-SEO ist, dafür zu sorgen, dass die Seite schnell lädt. Die User hassen nichts mehr, als eine langsam ladende Webseite. Braucht die Seite länger als 3 Sekunden, bis sie angezeigt wird, klicken die User auf den Zurück-Button und sind für immer weg. Dieses schnelle Abspringen wertet Google außerdem als negatives Signal, was sich dementsprechend unvorteilhaft auf deine Rankings auswirkt.

screenshot der webseite von pagespeed insights

Die Ladegeschwindigkeit (Page Speed) kannst du mit dem Developer Tool „Google Pagespeed Insights“ checken und gleichzeitig macht dir das Tool Vorschläge, um die Page Speed zu verbessern.

Das SERP Snippet

Das SERP Snippet ist jener „Schnipsel“ einer Webseite, der in den Suchergebnissen angezeigt wird. Es besteht aus der URL, dem Title, der Meta-Beschreibung und eventuell noch anderen Elementen, wie beispielsweise dem Datum der Veröffentlichung oder Bewertungen.

Es handelt sich um Meta-Angaben, die im HTML-Code der Seite hinterlegt sind.

Als Beispiel das Snippet unserer Leistungsseite Webdesign:

serp snippet

Das SERP Snippet ist das Erste, was die User von deiner Webseite zu sehen bekommen. Aus diesem Grund sollte der Optimierung der einzelnen Elemente besondere Aufmerksamkeit geschenkt werden.

URL

Die URL (Uniform Resource Locator) haben wir zu Beginn schon besprochen. URLs sollten kurz und aussagekräftig sein, wie du in der Grafik sehen kannst.

serp snippet mit hervorgehobener seo url


Optimierte URLs sind aussagekräftig und beinhalten im Idealfall das Fokus-Keyword.

Title-TAG

Der Title muss die Aufmerksamkeit der Google-User auf sich ziehen – was du durch Symbole unterstützen kannst. Das Keyword sollte enthalten sein und es sollte klar erkennbar sein, worum es auf der Webseite geht. Der Title sollte nicht länger als 70 Zeichen oder 500 Pixel sein.

serp snippet mit hervorgehobenem seo title

Meta Description

Die Meta Description oder Meta-Beschreibung ist die Kurzbeschreibung der Seite. Sie muss in wenigen Worten beschreiben, was den User auf der Webseite erwartet. Gleichzeitig muss sie neugierig machen und zum Klicken animieren. Ich bringe meist auch das Fokus-Keyword und einige relevante Begriffe unter.

serp snippet mit hervorgehobener meta beschreibung

Expertentipp: Verwende bei der Erstellung deines SERP Snippets eines der im Netz angebotenen SERP Snippet Tools. Mein Favorit dafür ist das kostenlose Tool von SISTRIX.

robots.txt

Die robots.txt-Datei ist eine Textdatei, die im Root-Verzeichnis einer Domain hinterlegt wird und den Zugriff von Suchmaschinen auf die Website steuert. Es können bestimmte Bereiche der Website für bestimmte oder alle Suchroboter „blockiert“ werden. Google und andere Suchmaschinen geben an, die in der robots.txt festgelegten Anweisungen zu befolgen.

So sieht eine robots.txt aus:

screenshot einer robots txt

Sinn und Zweck der robots.txt ist unter anderem, das wertvolle Crawling-Budget dort hinzulenken, wo man es haben möchte, und nicht durch das Crawlen unwichtiger Website-Bereiche zu verschwenden.

HTTPS und SSL-Zertifikat

Im August 2014 ist Google dazu übergegangen, HTTPS (hyper-text-transfer-protocol-secure) als Ranking-Faktor einzuführen. Websites mit HTTPS-Protokoll haben seither einen Vorteil gegenüber Websites ohne SSL-Zertifikat.

In den Artikeln Warum und wie du WordPress auf HTTPS umstellen solltest [Anleitung] und Joomla auf https umstellen [Anleitung] erfährst du alles, was du über HTTPS und das SSL-Zertifikat wissen musst.

Sitemap bereitstellen

Die Sitemap ist so etwas wie das Inhaltsverzeichnis deiner Website. Die Aufgabe dieser Sitemaps ist, Suchmaschinen, wie zum Beispiel Google, aufzuzeigen, welche Webseiten von deren Web-Crawlern durchsucht und im Suchindex gelistet werden sollen.

Durch die Sitemap ist der Googlebot nicht gezwungen, wertvolles Crawling-Budget beim Durchforsten deiner gesamten Seite zu verschwenden. Er erkennt anhand der Einträge, welche Seiten oder Blogbeiträge neu oder aktualisiert sind und beschränkt sich auf diese.

Hier unsere Sitemap als Beispiel:

screenshot einer xml sitemap

Mehr zum Thema Sitemap.

Strukturierte Daten (structured data)

Strukturierte Daten sind Informationen bzw. Inhalte einer Website, die für Suchmaschinen besonders gekennzeichnet werden. Das erleichtert den Bots von Google und anderen Suchmaschinen die Einordnung der Daten. Strukturierte Daten helfen den Crawlern der Suchmaschinen, die Inhalte einer Website besser zu verstehen.

Der Vorteil: Google belohnen das Hinzufügen von strukturierten Daten durch eine erhöhte Präsenz in den SERPs. Den Suchergebnissen wird oftmals mehr Platz eingeräumt. Beispielsweise wird die Darstellung der sogenannten Rich Snippets in den SERPs mit Informationen zu Preis, Bewertung oder Verfügbarkeit aufgewertet. Dadurch steigt die Click-Trough-Rate (CTR) der Suchenden deutlich.

Bei unserem Snippet werden beispielsweise die Bewertungen eingeblendet:

serp snippet mit hervorgehobenen bewertungen

Mehr zum Thema Strukturierte Daten

Das Fazit zum SEO-Webdesign

Du hast jetzt einige der wichtigsten Maßnahmen eines guten SEO-Webdesigns kennengelernt. Ich habe dir gezeigt, welche offensichtlichen Kriterien erfüllt sein müssen und welche technischen Faktoren dabei zu beachten sind. Hier nochmals zur Erinnerung:

OnPage Webdesign-SEO-Kriterien

  • „Sprechende“ URLs (Uniform Resource Locator)
  • Der „Above the Fold“-Bereich (Die 3-Sekunden-Regel) Internetnutzer sind ungeduldig, 3 Fragen beantworten
  • Usability und Benutzerfreundlichkeit
  • Menüstruktur
  • Inhaltsverzeichnis
  • Überschriften-Struktur
  • Citations

Technische Webdesign-SEO-Kriterien

  • Mobile Friendlyness
  • Schnelle Ladezeiten
  • Das SERP Snippet
    • URL
    • Title-TAG
    • Meta Description
  • robots.txt
  • HTTPS-Zertifikat
  • Sitemap bereitstellen
  • Strukturierte Daten (structured data)

Wenn du diese Punkte bei der Entwicklung deiner Website und deren Webdesign beachtest, bist du bezüglich Suchmaschinenoptimierung schon gut aufgestellt.

Natürlich gibt es noch zahlreiche andere SEO- oder Rankingfaktoren, die es bei der Suchmaschinenoptimierung zu berücksichtigen gibt. Webdesign-SEO allein reicht noch nicht aus, um in den Suchmaschinen ganz weit vorne mitzuspielen. Es ist jedoch neben gutem SEO-Content, einer gelungenen OnPage-Optimierung und einer umfangreichen Linkbuilding-Strategie ein wichtiger Baustein deiner Suchmaschinenoptimierung.

Solltest du noch Fragen zum Thema Webdesign-SEO haben oder Unterstützung bei der Umsetzung brauchen, ruf uns unter  +43 1 353 2 353 an oder kontaktiere uns unter Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein.. Wir freuen uns darauf, von dir zu hören.

 


Alles klar?

Solltest du noch Fragen zum Thema haben oder dir eine professionelle Unterstützung wünschen, dann melde dich bei uns. Schreibe eine E-Mail an Diese E-Mail-Adresse ist vor Spambots geschützt! Zur Anzeige muss JavaScript eingeschaltet sein., rufe uns unter +43 1 353 2 353 an oder schicke uns deine Anfrage über unser Kontaktformular.




Beitrag teilen



SEO-Profi Sebastian Prohaska von ithelps

Masterclass: SEO verstehen & anwenden können

Start: 29.3.2024

Steigere deine Sichtbarkeit in nur 12 Wochen!
Lerne vom SEO-Profi alles über die Suchmaschinenoptimierung deiner Webseite, um eine nachhaltige und erfolgreiche Online-Präsenz zu bauen.