SEO-Checkliste für Web-Frontend-Entwickler

Bearbeiten

1. Semantisches HTML

[ ] Verwende semantische Tags (<header>, <main>, <article>, <section>, <footer>)
[ ] Korrekte Verwendung von <h1> bis <h6> (nur ein <h1> pro Seite)
[ ] Sinnvolle Dokumentstruktur ohne unnötige <div>-Schachtelungen
[ ] Code ist valide

2. Meta-Tags und Head-Bereich

[ ] <title> ist eindeutig und enthält relevante Keywords
[ ] <meta name="description"> vorhanden und beschreibt den Seiteninhalt kurz und präzise
[ ] Canonical-Tag korrekt gesetzt (<link rel="canonical" href="...">)
[ ] Optional: Open Graph & Twitter Cards für Social Media

3. Technische SEO

[ ] Sitemap vorhanden und in robots.txt referenziert
[ ] robots.txt korrekt konfiguriert
[ ] hreflang-Tags bei mehrsprachigen Seiten korrekt gesetzt

4. Mobile-First & Responsiveness

[ ] Viewport-Tag gesetzt: <meta name="viewport" content="width=device-width, initial-scale=1">
[ ] Layout passt sich an verschiedene Bildschirmgrößen an
[ ] Buttons/Links gut auf Touch-Geräten bedienbar

5. Performance & Core Web Vitals

[ ] LCP (Largest Contentful Paint) < 2.5s
[ ] FID (First Input Delay) < 100ms
[ ] CLS (Cumulative Layout Shift) < 0.1
[ ] Bilder optimiert (z. B. WebP, Lazy Loading)
[ ] Ressourcen minifiziert und gebündelt

6. JavaScript & Rendering

[ ] Inhalte sind auch ohne JS lesbar (Progressive Enhancement)
[ ] SSR oder SSG verwenden (z. B. mit Next.js, Nuxt.js)
[ ] Fallback-Inhalte bei clientseitig geladenem Content

7. Barrierefreiheit (Accessibility)

[ ] Bilder mit sinnvollen alt-Attributen versehen
[ ] ARIA-Roles nur wenn nötig, ansonsten native HTML-Tags
[ ] Tastaturnavigation möglich
[ ] Farbkontraste ausreichend

[ ] Navigationsstruktur mit <nav> und <ul> umgesetzt
[ ] Sprechende Linktexte verwenden (nicht „hier klicken“)
[ ] Kein JS-only Navigationsmenü ohne HTML-Fallback

9. Statuscodes & Fehlerseiten

[ ] Korrekte HTTP-Statuscodes bei Weiterleitungen (301/302)
[ ] Eigene 404-Seite vorhanden und benutzerfreundlich gestaltet
[ ] Kein “Soft 404” (Seite sieht wie 404 aus, liefert aber 200 zurück)

10. Strukturierte Daten (Schema.org)

[ ] JSON-LD Snippets für relevante Inhalte vorhanden (z. B. Produkte, Artikel)
[ ] Mit dem Google Rich Results Test validiert

11. Nützliche Tools