Allgemein
22. März 2024

Finalisierungs-Checkliste für Webflow Websites

Webflow Experte - Sönke Sproll lacht
Sönke Sproll
Webflow Experte
Raketenlaunch
Inhaltsverzeichnis

Der Design-Prozess Deiner Webflow Website ist abgeschlossen, und der große Moment der Veröffentlichung rückt näher. In diesem Blogbeitrag stelle ich Dir eine umfassende Checkliste zur Verfügung, die Dir helfen wird, Deine Website technisch optimal auf den Launch vorzubereiten. Mit dieser Checkliste kannst Du sicherstellen, dass alles reibungslos funktioniert und die Seite bestmöglich über Suchmaschinen gefunden wird.

Die einzelnen Punkte werden unter der Lauch-Checkliste nochmals genauer ausgeführt.

Finalisierungs- /Lauch-Checkliste (Kurzfassung)

Bild-Optimierung

  • Check der Bildgrößen
  • Komprimierung zu WebP:
  • Alt-Texte geben

SEO

  • Strukturierte Daten einfügen
  • 301 Redirects einrichten
  • Meta Title und Description setzen
  • Headline Hierarchie beachten
  • Language Code angeben
  • Google Indexierung beantragen
  • XML Sitemap erstellen und einreichen
  • Irrelevante Seiten ausschließen
  • Subdomain Indexing ausschalten
  • HTML Tags korrekt zuweisen

Pagespeed

  • Minimiere Javascript, CSS und HTML
  • Unbenutzte Klassen und Animationen löschen

Formulare

  • Styling für Success und Error States
  • E-Mail-Einstellungen überprüfen
  • Mail Formatierung anpassen
  • Überprüfung der Feld-Namen und von ‘required’

Sonstiges

  • Cookiebanner integrieren
  • Schriftarten lokal einbinden
  • Linkprüfung durchführen
  • Favicon / Webclip einrichten
  • Style Guide aktualisieren
  • Rechtliche Seiten prüfen
  • Geräte- und Browserkompatibilität testen
  • Auftragsverarbeitungsvertrag mit Webflow abschließen

Einzelne Punkte ausführlicher beschrieben

Bild-Optimierung

  • Check der Bildgrößen: Achte darauf, dass Deine Bilder nicht größer sind als benötigt. Ein kleines Logo muss keine 2000px breit sein.
  • Komprimierung zu WebP: Über WebApps wie https://squoosh.app/ oder direkt im Webflow Assets Panel kannst Du Deine Bilder zu WebP komprimieren, wodurch diese deutlich weniger Speicherplatz verbrauchen.
  • Alt-Texte geben: Gebe Deinen Bildern für SEO und Barrierefreiheit aussagekräftige Alt-Texte.

SEO

  • Strukturierte Daten einfügen: Nutze Schema-Markup für Unternehmen, Jobs und Artikel, um Suchmaschinen detaillierte Informationen zu bieten.
  • 301 Redirects einrichten: Leite alte URLs dauerhaft auf neue um, um SEO-Wert und Nutzerführung zu erhalten. Nützlich wenn Du z. B. eine neue Seitenstruktur hast.
  • Meta Title und Description setzen: Definiere präzise Titel und Beschreibungen, die die Inhalte jeder Seite zusammenfassen. Achte darauf, dass diese in einem suchmaschinenfreundlichen Format bereitgestellt werden.
  • Headline Hierarchie beachten: Verwende nur eine H1 pro Seite. Strukturiere die restlichen H2, H3… sinnvoll.
  • Language Code angeben: Setze Sprachkennzeichnungen (z.B. de, en), um Suchmaschinen die Zielsprache zu verdeutlichen.
  • Google Indexierung beantragen: Melde Deine Seite in der Google Search Console an, um sie indexieren zu lassen.
  • XML Sitemap erstellen und einreichen: Lass von Webflow eine Sitemap generieren und reiche diese bei Google Search Console ein.
  • Irrelevante Seiten ausschließen: Verwende robots.txt oder Webflow-Einstellungen, um nicht relevante Seiten von der Indexierung auszuschließen.
  • Subdomain Indexing ausschalten: Deaktiviere die Indexierung von .webflow.io Subdomains.
  • HTML Tags korrekt zuweisen: Ordne HTML-Elemente den passenden Tags zu (z.B. Nav für die Navbar, Main für den Hauptwrapper).

Pagespeed

  • Minimiere Javascript, CSS und HTML: Reduziere den Code auf das Wesentliche, um Ladezeiten zu verkürzen. Dies kannst Du direkt in den Webflow Einstellungen machen
  • Unbenutzte Klassen und Animationen löschen: Lösche Deine unbenutzten Klassen und Animationen in Webflow

Formulare

  • Styling für Success und Error States: Gestalte die Rückmeldungszustände sinnvoll, um Nutzerführung zu verbessern. Achte auch darauf, dass diese zum Rest Deiner Seite passen.
  • E-Mail-Einstellungen überprüfen: Stelle sicher, dass die korrekte Kontakt-E-Mail in Webflow hinterlegt ist.
  • Mail Formatierung anpassen: Passe das Erscheinungsbild und den Text von E-Mails an, um Professionalität zu gewährleisten.
  • Überprüfung der Feld-Namen und von ‘required’: Stelle sicher, dass die Namen der Formularfelder klar und eindeutig sind und prüfe, ob Pflichtfelder korrekt als 'required' markiert sind, um eine vollständige und korrekte Dateneingabe zu gewährleisten.

Sonstiges

  • Cookiebanner integrieren: Stelle sicher, dass ein Cookiebanner für die Einwilligung zur Datenspeicherung angezeigt wird. Wie Du ein kostenloses Banner aufsetzen kannst, findest Du hier: Webflow Cookie Banner mit Finsweet
  • Schriftarten lokal einbinden: Lade Fonts lokal herunter und binde sie direkt in die Website ein, um Ladezeiten und externe Abhängigkeiten zu reduzieren.
  • Linkprüfung durchführen: Überprüfe alle Verlinkungen auf Funktionalität und Relevanz.
  • Favicon / Webclip einrichten: Füge ein Favicon hinzu, das in Browser-Tabs angezeigt wird.
  • Style Guide aktualisieren: Halte den Style Guide auf dem neuesten Stand, um Designkonsistenz zu gewährleisten.
  • Rechtliche Seiten prüfen: Stelle sicher, dass Seiten wie Impressum, Datenschutz und AGBs aktuell und korrekt sind.
  • Geräte- und Browserkompatibilität testen: Überprüfe die Website auf verschiedenen Geräten und in unterschiedlichen Browsern, um Benutzerfreundlichkeit zu sichern.
  • Auftragsverarbeitungsvertrag mit Webflow abschließen: Den Auftragsverarbeitungsvertrag mit Webflow abzuschließen ist notwendig, um die Einhaltung der Datenschutzvorschriften bei der Verarbeitung personenbezogener Daten durch Webflow zu gewährleisten.

Häufige Fragen zu Webflow Finalisierungs- / Launch-Checkliste

Welche drei Punkte sind vor Launch einer Webflow Website am wichtigsten?

Vor dem Launch einer Website ist es essenziell, sicherzustellen, dass die Seite fehlerfrei auf allen Geräten und Browsern funktioniert. Dies beinhaltet umfassende Tests auf verschiedenen Plattformen, um eine einheitliche Benutzererfahrung zu garantieren. Ebenso wichtig sind gute SEO-Grundlagen, wie das Setzen von Meta-Tags, die Optimierung der Seitenstruktur und das Einfügen strukturierter Daten, um die Sichtbarkeit in Suchmaschinen zu verbessern. Darüber hinaus muss die Website den Datenschutzvorschriften entsprechen, was den Einsatz eines korrekt konfigurierten Cookie-Banners, eine transparente Datenschutzerklärung und sichere Datenverarbeitungsverfahren einschließt. Diese Schritte tragen dazu bei, das Vertrauen der Nutzer zu stärken und rechtliche Probleme zu vermeiden.

Worauf muss ich auf SEO vor dem Launch achten?

Vor dem Launch Deiner Website solltest Du besonders auf die in der SEO-Checkliste genannten Punkte achten. Die Metatitel und -beschreibungen sind dabei von entscheidender Bedeutung, da sie den ersten Eindruck in den Suchergebnissen vermitteln und die Klickrate beeinflussen können. Ebenso wichtig ist die korrekte Anwendung der Headline-Hierarchie, die sicherstellt, dass Deine Inhalte gut strukturiert sind und Suchmaschinen die Hauptthemen Deiner Seite leicht erkennen können. Achte zudem darauf, dass die Inhalte auf der Seite relevant, gut recherchiert und ansprechend geschrieben sind, um sowohl Besucher als auch Suchmaschinen zu überzeugen.

Wie füge ich strukturierte Daten zu meiner Webflow-Website hinzu?

Du fügst strukturierte Daten über den Custom Code Bereich in den Einstellungen der Seiten hinzu.

Bereit für ein erfolgreiches Webflow Projekt?

Erstgespräch
Pfeil nach oben Icon
Webflow Experte - Sönke Sproll

Noch kein Webflow Experte?

Erhalte exklusiven Zugang zu Fachwissen, Insider-Content und Ressourcen über Webflow in unserem Newsletter.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Alter Mann als Webflow Experte

Noch kein
Webflow Experte?

Erhalte exklusiven Zugang zu Fachwissen, Insider-Content und Ressourcen über Webflow in unserem Newsletter.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.