Die ultimative Webflow Pre-Launch Checkliste für deine Webseite
In dieser ausführlichen Checkliste findest du wichtige Schritte, um einen reibungslosen und erfolgreichen Launch deiner Webflow Webseite zu ermöglichen.
Wenn du das erste Mal eine Webseite für dich selbst oder einen Kunden erstellst, gibt es einige Schritte, die du vor der Veröffentlichung beachten solltest. Die folgende Design-Checkliste hilft dir dabei, den Prozess zu erleichtern und keinen wichtigen Schritt zu vergessen.
Projekt Setup
Kleine Projekteinstellungen die eine große Wirkung haben.
- Favicon & Webclip: Lade dein eigenes Favicon und Web Clip Icon hoch
- Zeitzone: Stelle eine Zeitzone für deine Webseite ein
- Sprachcode: Füge einen Sprachcode in deine Webseite ein, de = Deutsch, en = Englisch etc.
- Webflow Branding: Schalte das Webflow Branding aus
- Erweiterte Veröffentlichungsoptionen: Aktiviere SSL und minimiere HTML, CSS & JS
- Custom Fonts: Lade eigene Schriften als Webformat wie WOFF in das Projekt
Design
Basic Design Elemente aus dem Webflow Designer für den Aufbau deiner Webseite.
- Style Guide: Lege einen Styleguide für dein Projekt an (bei größeren Projekten empfohlen)
- Globale Headings: Lege Größen & Zeilenabstände deiner Überschriften fest
- Globale Farben: Lege die Farbwerte für dein Projekt fest
- Globale Buttons: Style deine Buttons und lege einen Hover-Effekte fest
- Sektionen & Container: Lege Sektionen und Container mit Margin und Padding an
- Navigation: Lege eine Navigation an und verlinke Unterseiten
- Footer: Lege einen Footer an und verlinke Unterseiten/Kontaktmöglichkeiten/Social-Media
- Symbole: Nutze für wiederverwendbare Elemente wie den Footer Symbole
- Weißraum: Überprüfe deine Webseite auf einheitliche und ausreichende Abstände
- Formular: Gestalte das Formular mit allen zugehörigen Zuständen und hinterlege eine Kontakt-E-Mail in den Projekteinstellungen
Usability
Durch eine verbesserte Usability finden sich Besucher leichter zurecht und bleiben länger auf deiner Webseite.
- Link-Check: Prüfe ob alle Links funktionieren
- Kontakt-Check: Prüfe ob alle Kontaktmöglichkeiten wie E-Mail-Telefon und Social Media richtig verlinkt sind
- 404-Fehlerseite: Personalisiere die Fehlerseite für deine Besucher und leite sie zurück zur Startseite
- Hover-Effekte und Interaktionen: Hinterlege bei interaktiven Elementen Hover-Effekte und erstelle Ladeanimationen
- Burger-Menü: Hinterlege eine passende Navigation für Tablet- und Mobilgeräte
- Responsives Verhalten: Überprüfe das responsive Verhalten deiner Webseite auf schmaleren Bildschirmen
- Browser-Text: Überprüfe die Darstellung deiner Webseite auf verschiedenen Browsern
Suchmaschinenoptimierung
Die Suchmaschinenoptimierung (SEO) hilft deiner Webseite besser von Suchmaschinen durchsucht zu werden und ermöglicht ein höheres Ranking.
- Webflow Domain Indizierung: Deaktiviere die Indizierung der Webflow Domain
- Website Sitemap: Aktiviere die automatische Generierung der Sitemap
- Google Search Console: Füge deine Google Search ID ein (Falls benötigt)
- Standard Domain: Setze die URL mit www. am Anfang als deine Standard Domain
- 301 Redirects: Richte Umleitungen für alte URLs ein (Falls benötigt)
- Headline Struktur: Achte bei jeder Seite auf den richtigen Einsatz der H1–H6 Überschriften
- Alt Tags: Hinterlege bei allen Bildern einen passenden Beschreibungstext
- Meta Titel & Beschreibung: Hinterlege für jede Seite passende Meta Titel und Beschreibung
- Open Graph Einstellungen: Hinterlege Titel, Beschreibung und ein Bild für Social Media-Plattformen
Barrierefreiheit
Ermöglicht den leichteren Zugang deiner Webseite für Menschen mit Beeinträchtigungen und Technologien wie Screen-Readern.
- Ausreichender Kontrast: Prüfe ob ein ausreichendes Kontrastverhältnis zwischen Vordergrund & Hintergrund besteht
- Lesbare Textgröße: Achte darauf dass deine Texte auf jedem Breakpoint klar und gut lesbar sind
- Alt Tags: (Siehe Alt Tags SEO)
- Beschreibende Link-Titel: Verwende eine eindeutige Beschreibung bei Texten für Links
Performance
Mit Webanalysen kannst du wertvolle Informationen über deine Webseite erhalten und diese in Zukunft verbessern.
- Analytic Tool: Integriere ein Analytic Tool deiner Wahl, um Besucherstatistiken zu erhalten
- Performance Tool: Teste die Ladegeschwindigkeit deiner Webseite
- Entferne unbenutzte CSS-Klassen und Interaktionen: Bereinige alle nicht verwendeten Styles mithilfe des Stylemanagers
- Bildgrößen: Optimiere die Dateigröße deiner Bilddateien für schnellere Ladezeiten
FAQ
Warum brauche ich eine Pre-Launch Checkliste?
Vor dem Livegang einer Website gibt es viele kleine Details, die leicht übersehen werden. Wie 301-Redirects, ARIA-Label oder Alt-Tags. Eine Checkliste kann dir helfen strukturiert durch den Go-Live Prozess zu gehen.
Welche Punkte sollte ich unbedingt prüfen?
Dazu gehören: funktionierende Formulare, 301-Weiterleitungen, Meta-Titel und -Descriptions, optimierte Bildgrößen, korrekte mobile Darstellung und eine optimierte Ladegeschwindigkeit.
Wie wichtig ist das Thema SEO beim Website-Launch?
Sehr wichtig. Ohne optimierte Meta-Titel, Beschreibungen und Alt-Texte kann es passieren, dass die Seite von Google schlecht gefunden wird. Ein sauberer Start spart später viel Arbeit.
Kann ich meine Seite nach dem Launch noch anpassen?
Natürlich! Eine Website ist ein sich ständig wachsendes und änderndes Projekt. Der Website-Launch ist nur der Startpunkt. Inhalte, SEO und Design können regelmäßig überprüft und optimiert werden, um die Seite langfristig zu verbessern.
Du benötigst Hilfe bei deinem Projekt?
Egal ob konkrete Anfrage oder erste Idee. Ich berate dich gerne kostenlos. Bei einem Erstgespräch können wir uns über dein Projekt und deine Wünsche austauschen. Anschließend überlege ich mir wirkungsvolle nächste Schritte oder sende dir ein unverbindliches Angebot zu.
Kostenlose Beratung
