So gestalten Sie eine WordPress-Website neu (ohne Ausfallzeit)

Sieht Ihre Website noch so aus wie vor ein paar Jahren? Eine Website kann schnell veraltet wirken, und Sie stellen vielleicht fest, dass sie die Aufmerksamkeit der Besucher nicht mehr so fesselt wie früher.

Es geht nicht nur darum, ein neues Aussehen zu wollen; Sie möchten, dass Ihre Website ein leistungsstarkes Werkzeug ist, das Ihr Geschäft vorantreibt.

Ein Redesign ist ein strategischer Schritt, um Ihre Online-Präsenz aufzufrischen und sicherzustellen, dass Ihre WordPress-Site für Sie am härtesten arbeitet.

Wenn es richtig gemacht wird, kann ein Redesign Engagement, Konversionen und Markenbekanntheit steigern. Aber wie macht man das?

In diesem Tutorial zeige ich Ihnen, wie Sie Ihre WordPress-Website neu gestalten!

Hier sind die wichtigsten Erkenntnisse:

• Verwenden Sie Staging-Sites für Redesigns ohne Ausfallzeiten: Arbeiten Sie privat an Ihrem Redesign, während Ihre Live-Site online bleibt
• Duplicator Pro vereinfacht den gesamten Prozess: Erstellen Sie Backups und migrieren Sie Änderungen mühelos zu und von Ihrer Staging-Umgebung
• Legen Sie zuerst Leistungs-Benchmarks fest: Verfolgen Sie aktuelle Metriken mit MonsterInsights, um den Erfolg des Redesigns zu messen
• Erstellen Sie immer Katastrophenwiederherstellungspunkte: Sichern Sie Ihre ursprüngliche Website, bevor Sie live gehen, um bei Bedarf sofortige Rollbacks zu ermöglichen
• Vollständige Audits nach dem Start sind unerlässlich: Überprüfen Sie nach dem Redesign defekte Links, SEO-Probleme und Funktionsprobleme

Kurze Zusammenfassung: So gestalten Sie eine WordPress-Site neu

Inhaltsverzeichnis

Warum Ihre WordPress-Site neu gestalten?

Sie schieben das Redesign Ihrer Website vielleicht auf, weil Sie befürchten, dass es zu viel Zeit in Anspruch nimmt oder Ihre Website in den Wartungsmodus versetzt. Hier sind jedoch einige Situationen, in denen ein Redesign nützlich wäre.

• Veraltetes Design

Wenn Ihre Website veraltet aussieht, moderne Funktionen fehlen oder sie aktuellen Designstandards nicht entspricht, ist es möglicherweise Zeit für ein Redesign.

Ein aktualisiertes Website-Design kann das Erlebnis Ihrer Besucher verbessern und Ihre Website ansprechender und professioneller machen.

• Schlechte Benutzererfahrung

Wenn Benutzer Schwierigkeiten haben, Ihre Website zu navigieren, oder langsame Seitenladezeiten erleben, kann dies zu einer hohen Absprungrate und geringeren Konversionen führen.

Die Neugestaltung Ihrer WordPress-Site mit Schwerpunkt auf Benutzererfahrung (UX) kann helfen, diese Probleme zu lösen und Ihr Publikum zu fesseln.

• Nicht responsiv oder nicht mobilfreundlich

Viele Menschen nutzen ihre Mobilgeräte, um im Internet zu surfen. Das bedeutet, dass es wichtig ist, eine responsive Website zu haben, die sich an verschiedene Bildschirmgrößen anpasst.

Wenn Ihre aktuelle Website nicht mobilfreundlich ist oder keine Reaktionsfähigkeit aufweist, ist es möglicherweise Zeit, sie neu zu gestalten, um die Zugänglichkeit zu maximieren.

• Änderungen am Branding oder an der Botschaft

Wenn Ihr Unternehmen signifikante Änderungen erfahren hat oder Sie Ihre Botschaft überarbeiten möchten, kann ein Website-Redesign Ihnen eine neue Markenidentität verleihen. Diese Konsistenz in Branding und Botschaft stärkt Ihr Gesamtbild und hilft Ihnen, Ihre Zielgruppe zu erreichen.

• Suchmaschinenoptimierung (SEO) Verbesserungen

Suchmaschinen aktualisieren ihre Algorithmen häufig und SEO-Best-Practices ändern sich im Laufe der Zeit. Ein Website-Redesign bietet die Möglichkeit, Ihre Seitenstruktur zu optimieren, die Ladezeit von Seiten zu verbessern und SEO-freundliche Elemente zu implementieren, um Ihren organischen Traffic zu erhöhen.

• Neue Funktionen

Wenn sich Ihr Unternehmen weiterentwickelt, müssen Sie möglicherweise einen E-Commerce-Shop, einen Blog oder Social-Media-Feeds zu Ihrer Website hinzufügen. Mit einem Redesign können Sie diese neuen Funktionen nahtlos integrieren und sicherstellen, dass sie mit Ihrem Gesamtdesign und Benutzererlebnis übereinstimmen.

Was Sie tun sollten, bevor Sie Ihre WordPress-Website neu gestalten

Später zeigen wir Ihnen, wie Sie Ihre WordPress-Website komplett neu gestalten. Es gibt jedoch ein paar Schritte, die Sie vorher unternehmen sollten.

Bewerten Sie Ihr aktuelles Design

Bevor Sie Ihre Website neu gestalten, sollten Sie ihr aktuelles Design berücksichtigen. Sie sollten sich ihrer guten Funktionen bewusst sein und auch dessen, was Sie verbessern möchten.

Stellen Sie sicher, dass Sie notieren, was Ihnen an Ihrer ursprünglichen Website gefällt. Während des Redesigns möchten Sie diese Funktionen und Eigenschaften beibehalten.

Es ist jedoch wichtig, die Schwachstellen für ein gutes Redesign zu berücksichtigen. Durch die Behebung schlechter Layouts und Farbpaletten erhalten Sie eine Website, die gut funktioniert und ansprechend aussieht.

Überprüfen Sie Ihre aktuellen Benchmarks

Um zu sehen, ob ein Redesign effektiv war, müssen Sie Ihre aktuellen Website-Statistiken kennen.

Sie können Ihre aktuellen Benchmarks ganz einfach überprüfen, indem Sie MonsterInsights installieren. Dies ist ein Plugin, das Google Analytics mit Ihrem WordPress-Backend verbindet und alle Ihre Leistungsdaten an einem Ort zusammenfasst.

Sobald Sie MonsterInsights zu Ihrer Website hinzugefügt haben, finden Sie den Bericht Top-Beiträge/Seiten. Hier sehen Sie, wie viele Besucher Sie erhalten:

Wenn Sie Daten aus MonsterInsights speichern möchten, klicken Sie auf die Schaltfläche PDF-Bericht exportieren. Dies lädt eine Zip-Datei mit Ihren Seitenaufrufen, Benutzersitzungen, Absprungrate und mehr herunter:

Durch das Speichern dieser Statistiken können Sie leicht erkennen, ob sich das Redesign gelohnt hat. Sie können die Analysen vor und nach der Veröffentlichung des neuen Designs vergleichen. 

Möchten Sie sehen, was MonsterInsights noch kann? Lesen Sie unsere vollständige Rezension!

Haben Sie Ziele für das Redesign

Sobald Sie Ihre Leistungs-Benchmarks kennen, können Sie Ziele für das Redesign festlegen.

Mit einem guten Redesign können Sie:

• Ladezeit beschleunigen
• Konversionsraten erhöhen
• Absprungrate reduzieren
• Durchschnittliche Verweildauer auf der Seite erhöhen
• Benutzererlebnis verbessern
• Und mehr!

Sie könnten auch ein Rebranding mit neuen Farben, Logos oder Layouts ausprobieren. Stellen Sie sicher, dass Sie Ihre Leistungs-Benchmarks vor und nach dem Redesign aufzeichnen. Diese Metriken helfen Ihnen zu entscheiden, ob das Redesign erfolgreich war oder nicht.

Legen Sie ein Budget fest

Schließlich müssen Sie entscheiden, wie hoch Ihr Budget für das Projekt sein wird. Einige grundlegende Kosten für ein Redesign umfassen den Kauf eines neuen Themes oder die Beauftragung eines professionellen Webdesigners.

Wenn Sie Geld für andere Bereiche Ihres Unternehmens sparen möchten, empfehlen wir Ihnen, Ihr Redesign selbst durchzuführen. Mit einem guten Theme Builder benötigen Sie keine Programmierkenntnisse, um Ihre neue Website zu erstellen.

So gestalten Sie eine WordPress-Website neu

Sobald Sie sich entscheiden, das Design Ihrer Website zu verbessern, wissen Sie vielleicht nicht, wie Sie vorgehen sollen. Keine Sorge, ich führe Sie Schritt für Schritt durch!

• Schritt 1: Duplicator Pro installieren: Ein Backup- und Migrations-Plugin erleichtert die Migration Ihrer Website in einen Staging-Bereich für das Redesign.
• Schritt 2: Eine Kopie Ihrer Live-Website erstellen: Erstellen Sie ein vollständiges Backup Ihrer aktuellen Website und laden Sie es herunter.
• Schritt 3: Eine Staging-Site erstellen: Richten Sie eine sichere Testumgebung mit LocalWP oder den Staging-Tools Ihres Hosting-Anbieters ein.
• Schritt 4: Ihr Backup importieren: Laden Sie Ihr Website-Backup in die Staging-Umgebung hoch, um Ihre Live-Daten zu importieren.
• Schritt 5: Ihr neues Design erstellen: Verwenden Sie SeedProd oder andere Design-Tools, um Ihre neu gestaltete Website zu erstellen.
• Schritt 6: Ihre neue Website starten: Erstellen Sie Wiederherstellungspunkte für den Notfall und migrieren Sie dann Ihr abgeschlossenes Redesign auf den Live-Server.
• Schritt 7: Überprüfen Sie Ihre neu gestaltete Website: Prüfen Sie auf Fehler, defekte Links, SEO-Probleme und die allgemeine Funktionalität.

Schritt 1: Duplicator Pro installieren

Wenn Sie ein Redesign in Erwägung ziehen, möchten Sie keine komplett neue WordPress-Installation von Grund auf neu erstellen. Selbst wenn Sie Ihre gesamte Website überarbeiten, ist es wichtig, alle Ihre Beiträge, Seiten, Plugins und andere wichtige Details beizubehalten.

Um Datenverlust zu vermeiden, empfehle ich, eine Kopie Ihrer Live-Website zu erstellen und sie auf eine Staging-Site zu verschieben. Hier können Sie ein neues Design erstellen, ohne Ihre Live-Benutzer zu beeinträchtigen.

Das beste Werkzeug für diese Aufgabe ist Duplicator. Dieses WordPress-Plugin ist ein Kraftpaket für Backups, Migrationen und Klonen. Es lädt Ihre gesamte Website als einzelne Zip-Datei herunter, sodass Sie sie einfach verschieben können.

Sind Sie sich nicht sicher, ob Sie Duplicator während des Redesign-Prozesses benötigen? Sehen Sie, wie Rock Lobster Webdesign die Designeffizienz mit Duplicator steigert!

Wählen Sie zunächst ein Abonnement für Duplicator Pro. Es gibt eine kostenlose Version, aber Duplicator Pro bietet Drag-and-Drop-Migrationen. Dies kann Ihnen helfen, Ihr Redesign im Handumdrehen einzurichten.

Nachdem Sie Ihren Kauf abgeschlossen haben, kopieren Sie Ihren Lizenzschlüssel. Öffnen Sie dann das Dashboard Ihrer Live-WordPress-Site und installieren Sie Duplicator.

Gehen Sie als Nächstes zu Duplicator Pro » Einstellungen » Allgemein.

Fügen Sie Ihren Lizenzschlüssel ein und klicken Sie auf die Schaltfläche Aktivieren. Jetzt können Sie mit dem Redesign-Prozess beginnen!

Schritt 2: Erstellen Sie eine Kopie Ihrer Live-Website

Für den nächsten Schritt müssen Sie eine Kopie (oder ein Backup) Ihrer Website erstellen. Manuelle Backups können mühsam sein, aber Duplicator macht es auch für Anfänger einfach.

Duplicator sichert alle Ihre WordPress-Dateien, Themes, Plugins und Datenbanktabellen in einer Zip-Datei. Sobald Sie ein Backup erstellen, können Sie es problemlos auf einen völlig neuen Server verschieben.

Gehen Sie zunächst zu Backups » Neu hinzufügen.

Sie können dynamische Tags verwenden, um das Backup zu benennen. Wählen Sie unter Speicher die Option Lokal.

Bei der Neugestaltung möchten Sie möglicherweise bestimmte Teile Ihrer Website löschen. In diesem Fall können Sie die Archivdatei anpassen. Erweitern Sie einfach den Abschnitt Backup und deaktivieren Sie alle Komponenten, die Sie nicht einschließen möchten.

Um Ihre gesamte Website zu sichern, nehmen Sie keine Änderungen vor. Klicken Sie dann auf Weiter. 

Duplicator führt einen vollständigen Scan Ihrer Live-Website durch. Überprüfen Sie unbedingt alle Hinweise, bevor Sie das Backup erstellen.

Nachdem Ihr Backup erstellt wurde, können Sie es herunterladen.

Wenn Sie eine lokale Staging-Umgebung wie LocalWP verwenden möchten, installiert diese Software oft WordPress für Sie. In diesem Fall müssen Sie nur die Archivdatei herunterladen.

Wenn Sie Ihr Backup jedoch direkt mit einem FTP-Client oder cPanel auf einen Server hochladen, stellen Sie sicher, dass Sie auch das installer.php-Skript speichern. 

Schritt 3: Erstellen Sie eine Staging-Site

Bei der Vorbereitung auf eine große Aufgabe wie eine Neugestaltung ist eine Staging-Website wichtig. Dies ist eine geklonte Version Ihrer Website, mit der Sie Änderungen testen können, ohne die Funktionalität oder das Erscheinungsbild Ihrer Live-Website zu beeinträchtigen. 

Wenn Sie Ihre Live-Website neu gestalten, könnten Sie versehentlich Fehler an Ihr Publikum weitergeben.

Mit einer Staging-Website haben Sie einen sicheren und kontrollierten Bereich, um sicherzustellen, dass alles korrekt funktioniert, bevor Sie live gehen. Außerdem müssen Sie Ihre bestehende Website nicht in den Wartungsmodus versetzen, während Sie sie neu gestalten. 

Manchmal stellt Ihr Webhosting-Anbieter automatisch einen Staging-Bereich für Sie bereit. Sie können jedoch auch ganz einfach selbst oder mit einem WordPress-Staging-Plugin einen erstellen.

Für dieses Tutorial verwenden wir LocalWP, eine anfängerfreundliche lokale Entwicklungssoftware. Es richtet eine WordPress-Installation auf Ihrem persönlichen Computer ein und hostet sie. Außerdem ist die Nutzung kostenlos.

Um zu beginnen, laden Sie die Version von LocalWP herunter, die dem Betriebssystem Ihres Computers entspricht. Fügen Sie dann eine neue Website hinzu, indem Sie auf das Symbol + klicken.

Benennen Sie als Nächstes Ihre Staging-Website. Wenn Sie Entwickler sind, können Sie gerne eine benutzerdefinierte Version von PHP, Apache und MySQL einrichten. Alternativ erstellt die Option Bevorzugt eine einfache WordPress-Website.

Als letzten Schritt geben Sie einen WordPress-Benutzernamen, ein Passwort und eine E-Mail-Adresse ein. Sie verwenden diese Anmeldeinformationen, um auf das Dashboard Ihrer Staging-Website zuzugreifen.

Sie möchten Ihre Staging-Website möglicherweise auf demselben Server wie Ihre Live-Website hosten. Dies stellt sicher, dass es keine Fehler gibt, wenn Sie Änderungen zwischen den beiden Websites migrieren.

Um Ihnen dabei zu helfen, lesen Sie unser Tutorial zum Erstellen einer WordPress-Staging-Website. 

Schritt 4: Importieren Sie Ihr Backup

Nachdem LocalWP Ihre Staging-Website erstellt hat, handelt es sich um eine Standard-WordPress-Installation. Um sie wie Ihre Live-Website aussehen und sich anfühlen zu lassen, können Sie einfach Ihr gespeichertes Backup importieren.

Wählen Sie in Ihrer lokalen App Ihre Website aus und klicken Sie auf WP Admin. Dies öffnet das Dashboard für die lokale Website.

Installieren und aktivieren Sie hier Duplicator Pro als Plugin. Finden Sie dann die Seite Backups importieren und laden Sie die zuvor gespeicherte Archivdatei hoch.

Duplicator benachrichtigt Sie, wenn das Backup hochgeladen wurde. Klicken Sie auf Weiter , um die Installation zu starten.

Klicken Sie auf der nächsten Seite auf Installer starten.

Danach sehen Sie schrittweise Anleitungen zur Bereitstellung Ihrer Website-Installation.

Akzeptieren Sie die Nutzungsbedingungen und Hinweise. Klicken Sie dann auf Weiter.

Überprüfen Sie abschließend die Installationseinstellungen. Wenn sie korrekt aussehen, klicken Sie auf OK.

Duplicator ersetzt dann die lokale Standard-Website durch eine exakte Kopie Ihrer Live-Website! Sie können die Schaltfläche Admin-Login verwenden, um auf Ihr neues Dashboard zuzugreifen. 

Schritt 5: Erstellen Sie Ihr neues Design

Jetzt, da Sie eine Staging-Website haben, können Sie eine vollständige Neugestaltung vornehmen, während Ihre ursprüngliche Website noch online ist.

Obwohl Sie Ihre Website mit den integrierten WordPress-Editoren gestalten könnten, sind diese nicht sehr benutzerfreundlich oder flexibel. 

Um jeden Website-Typ einfach zu gestalten, empfehle ich die Verwendung von SeedProd. SeedProd ist der beste Website-Builder, da er über Drag-and-Drop-Bearbeitung, über 150 Landingpage-Vorlagen und sogar vorgefertigte Website-Themes verfügt.

Obwohl SeedProd als Landingpage-Builder begann, hat es sich weiterentwickelt, um jeden Teil Ihrer Website anzupassen. Mit seinem Theme Builder können Sie ganz einfach neue Seiten, Header, Footer und mehr gestalten.

Um all diese Funktionen zu nutzen, installieren und aktivieren Sie SeedProd auf Ihrer lokalen WordPress-Website. Gehen Sie dann zu SeedProd » Theme Builder » Theme Template Kits.

Dies gibt Ihnen viele verschiedene vorgefertigte Theme-Kits zur Auswahl. Anstatt jede Seitenvorlage manuell von Grund auf neu zu codieren, kann SeedProd den Designprozess beschleunigen.

Sie finden Websites für Portfolios, Online-Unternehmen, Blogs und vieles mehr.

Sobald Sie ein neues Theme ausgewählt haben, haben Sie Vorlagen für Ihre Homepage, Beiträge, Header und Footer. Um eines davon zu bearbeiten, klicken Sie auf Design bearbeiten.

Sie können dann den SeedProd-Seiteneditor verwenden, um Ihr Theme vollständig anzupassen. Ziehen Sie per Drag & Drop neue Blöcke auf die Seite, bearbeiten Sie Schriftarten, aktualisieren Sie Standardfarben und nehmen Sie alle anderen Änderungen vor.

Speichern Sie Ihre Änderungen, wenn Sie fertig sind. Veröffentlichen Sie dann jede Theme-Vorlage. Aktivieren Sie oben auf der Seite das neue SeedProd-Theme.

Wenn Sie eine ausführlichere Anleitung zum Erstellen einer Website mit SeedProd wünschen, lesen Sie diesen Beitrag darüber, wie Sie ein benutzerdefiniertes WordPress-Theme ohne Code erstellen. 

Schritt 6: Starten Sie Ihre neue Website

Sobald Sie Ihre neue Website vollständig neu gestaltet haben, ist es an der Zeit, Ihre Änderungen zu veröffentlichen!

Mit Duplicator müssen Sie lediglich ein Backup der Staging-Website erstellen. Laden Sie dann die Archivdatei des Backups herunter.

Bevor Sie dies auf Ihrer Live-Website importieren, sollten Sie einen Disaster-Recovery-Punkt festlegen. Im Grunde speichert dies ein Backup Ihrer Website direkt bevor Sie das Design aktualisiert haben. Wenn Sie kritische Fehler bemerken, die Sie während der Entwicklung übersehen haben, können Sie einfach zu diesem Backup zurückkehren.

Erstellen Sie dazu ein Backup Ihrer ursprünglichen Website. Stellen Sie sicher, dass Sie Lokal als Speicherort auswählen.

Fahren Sie mit der Erstellung des Backups fort. Klicken Sie nach Abschluss auf das blaue Haus-Symbol.

Klicken Sie auf Disaster Recovery festlegen.

Kopieren Sie zu diesem Zeitpunkt entweder den Wiederherstellungslink oder laden Sie die Launcher-Datei herunter. Wenn Sie diese an einem sicheren Ort speichern, können Sie sie verwenden, um Ihre Website sofort wiederherzustellen.

Jetzt ist es an der Zeit, Ihr Redesign zu importieren. Gehen Sie dazu auf die Seite Backups importieren und laden Sie die Zip-Datei Ihrer Staging-Site hoch. Dann führt Sie Duplicator durch den Import Ihres Backups auf die Website. 

Weitere Details finden Sie in unserem Tutorial So verschieben Sie eine lokale WordPress-Site auf einen Live-Server.

Schritt 7: Überprüfen Sie Ihre neu gestaltete Website

Selbst wenn Sie Ihre Staging-Site auf Fehler überprüft haben, könnten Sie etwas übersehen. Nachdem Sie Ihr Redesign live geschaltet haben, ist es wichtig, Ihre Website gründlich zu überprüfen, um sicherzustellen, dass sie gut aussieht und richtig funktioniert.

Um sicherzustellen, dass Ihre Suchmaschinenoptimierung (SEO) stimmt, sollten Sie eine vollständige SEO-Prüfung durchführen. All-in-One SEO ist das beste SEO-Plugin dafür, da es Ihnen eine anfängerfreundliche Liste von SEO-Vorschlägen für Ihre Website gibt.

Ich würde auch empfehlen, ein Support-Ticket-Formular zu erstellen. Auf diese Weise kann Ihr Publikum Fehler oder 404-Fehler melden, die ihre Erfahrung auf Ihrer Website beeinträchtigen.

Mit einem Plugin wie WPForms können Sie mit einer Support-Ticket-Vorlage beginnen und das Kontaktformular bearbeiten, um Ihre spezifischen Bedürfnisse zu erfüllen.

Hier sind einige weitere Aufgaben, die Sie direkt nach einem Redesign durchführen sollten:

• Prüfen Sie auf defekte Links und fügen Sie bei Bedarf Weiterleitungen hinzu
• Überprüfen Sie erneut Ihre leistungsstärksten Webseiten und Beiträge
• Stellen Sie sicher, dass Titel, Überschriften und Meta-Beschreibungen vor und nach der Migration konsistent geblieben sind
• Testen Sie die Ladezeit Ihrer Seiten
• Löschen Sie Plugins, die nicht aktiv genutzt werden
• Überprüfen Sie Ihre XML-Sitemap und beheben Sie Fehler
• Testen Sie Ihr Redesign für verschiedene Browser

Danach haben Sie ein wunderschönes Redesign, das neue Besucher anzieht und sie immer wieder auf Ihre Website zurückkehren lässt! 

Häufig gestellte Fragen (FAQs)

Fazit

Das ist alles! Sie haben gelernt, wie man eine WordPress-Website neu gestaltet.

Während Sie hier sind, könnten Ihnen diese WordPress-Tutorials und Plugin-Bewertungen gefallen:

• 15 beste WordPress-Themes zum Erstellen einer beeindruckenden Website
• So bereinigen Sie eine WordPress-Website (11 Expertentipps)
• So ändern Sie Ihr WordPress-Theme
• So erstellen Sie ein Cloud-WordPress-Backup
• 9 beste Plugins zum Klonen einer WordPress-Site
• So optimieren Sie Ihre WordPress-Datenbank

Sie müssen nicht viel Zeit damit verbringen, Ihre Website manuell in und aus einem Staging-Bereich zu verschieben. Laden Sie Duplicator Pro herunter, um mit Drag-and-Drop-Migrationen zu beginnen!