Digital Studio

Ratgeber

Website-Redesign: Was Sie behalten, verbessern und testen sollten

8 Min. LesezeitWeb + Redesign

Gläserne Website-Elemente werden um einen durchgehend beleuchteten Pfad neu angeordnet und veranschaulichen ein Redesign, das wichtige Verbindungen erhält.

Konzeptillustration von Digital Studio.

1. Legen Sie fest, was das Redesign verändern muss

Eine hilfreiche Checkliste für ein Website-Redesign erfüllt drei Aufgaben: Sie schützt, was Kunden bereits hilft, hält den Verbesserungsbedarf fest und definiert, wie die neue Website geprüft wird. Beginnen Sie mit der bestehenden Website und einigen konkreten Aufgaben Ihrer Besucher. Ein neuer Auftritt ist ein Teil der Arbeit. Anfragen, nützliche Inhalte und etablierte Links müssen den Wechsel ebenfalls überstehen.

Notieren Sie Probleme, die sich konkret zeigen lassen. Vielleicht können Besucher auf dem Smartphone keine Leistungen vergleichen, das Kontaktformular fragt Angaben ab, die Ihr Team nie verwendet, oder Mitarbeitende können die Öffnungszeiten nicht aktualisieren. Beschreiben Sie neben jedem Problem das gewünschte Verhalten. „Ein Besucher kann eine Leistung auswählen und eine Anfrage senden, ohne uns vorher nach dem Vorgehen fragen zu müssen“ gibt der prüfenden Person eine konkrete Aufgabe.

Unterscheiden Sie zwischen einer optischen Überarbeitung und Änderungen an Inhalten, Seitenstruktur und angebundenen Werkzeugen. All das kann zu einem Projekt gehören, erfordert aber jeweils eine ausdrückliche Entscheidung. Ist das eigentliche Problem ein veraltetes Angebot, reicht eine neue Schriftgestaltung nicht aus. Nutzen Sie den Leitfaden zum Website-Projektbriefing für die übergreifende Projektbeschreibung. Diese Checkliste konzentriert sich darauf, was eine bestehende Website durch das Redesign hindurch bewahren muss.

2. Entscheiden Sie, was bleibt, überarbeitet, zusammengeführt oder entfernt wird

Erstellen Sie ein Seitenverzeichnis, bevor Sie neue Layouts freigeben. Erfassen Sie jede bestehende Adresse, ihren Zweck, wichtige Inhalte und die Person, die Änderungen freigeben kann. Berücksichtigen Sie auch Seiten außerhalb des Hauptmenüs, herunterladbare Dokumente, Sprachversionen und Zielseiten von Kampagnen. Fragen Sie im Team nach, welche Links an Kunden verschickt werden. Nützliche Inhalte stehen nicht immer im Vordergrund der Navigation.

Treffen Sie für jeden Eintrag eine Entscheidung:

  • Behalten: Zweck und Informationen bleiben nützlich, auch wenn sich die Darstellung ändert.
  • Überarbeiten: Die Seite bleibt bestehen, aber ein klar benannter Teil ihres Inhalts muss freigegeben werden.
  • Zusammenführen: Eine andere Seite übernimmt die nützlichen Inhalte und erfüllt dasselbe Besucherbedürfnis.
  • Entfernen: Der Inhalt hat keinen sinnvollen Zweck mehr; seine Entfernung ist abgestimmt.

Bewahren Sie konkrete Informationen, die eine Entscheidung erleichtern: Leistungsgrenzen, Voraussetzungen, Liefer- oder Einsatzgebiete, praktische Anleitungen und Kontaktdaten. Kürzere Texte sind nicht automatisch verständlicher, wenn dadurch genau die Antwort entfällt, nach der ein Kunde gesucht hat. Sichern Sie die freigegebenen bisherigen Texte und Bilder, damit bei der Prüfung nicht nur das Aussehen, sondern auch der Inhalt verglichen werden kann.

Nutzen Sie vorhandene Anfragedaten oder Suchberichte, um Seiten zu erkennen, die besondere Aufmerksamkeit verdienen. Liegen nur wenige Daten vor, halten Sie diese Unsicherheit fest. Die interne Einschätzung, eine Seite „bringe nichts“, ist ein Anlass für eine Untersuchung, aber kein ausreichender Beleg für ihre Löschung.

3. Ordnen Sie jeder geänderten URL ein Ziel zu

Bei einem Redesign können bestehende Seitenadressen erhalten bleiben. Lassen Sie jede Änderung begründen: Die Zusammenlegung von Leistungen oder eine verständlichere Seitenstruktur kann dafür sprechen, eine neue Farbpalette hingegen nicht. Erfassen Sie für jede verschobene Seite die alte Adresse und den passenden Ersatz. Lassen Sie die gesamte vereinbarte Zuordnung durch die Entwicklung prüfen, nicht nur die Startseite.

Google empfiehlt dauerhafte serverseitige Weiterleitungen, etwa mit HTTP 301 oder 308, wenn sich die Adresse einer Seite dauerhaft ändert. Die praktische Abnahmeprüfung ist einfach: Wer die alte Adresse öffnet, gelangt zur richtigen Ersatzseite, die erfolgreich geladen wird.

Googles Leitfaden zu Websiteumzügen empfiehlt, Weiterleitungen direkt auf ihr endgültiges Ziel zu setzen und sachfremde Ziele zu vermeiden. Beispielsweise sollten nicht alle entfernten Seiten auf die Startseite weitergeleitet werden. Eine endgültig entfernte Seite ohne passenden Ersatz sollte eine korrekte Antwort mit dem Status 404 oder 410 liefern. Bitten Sie die Entwicklung, diese Entscheidung zu dokumentieren.

Aktualisieren Sie interne Links, Canonical-Verweise, gegebenenfalls Sprachverweise und die Sitemap entsprechend den geänderten Adressen. Google empfiehlt, Weiterleitungen mindestens ein Jahr lang beizubehalten, bei anhaltendem Nutzen für Besucher auch länger. Vereinbaren Sie, wer sie nach der Übergabe pflegt. Ein Weiterleitungsplan sichert die Kontinuität; er garantiert weder eine Position in den Suchergebnissen noch einen Zeitpunkt für die Indexierung.

4. Verfolgen Sie eine Anfrage bis zu Ihrem Team

Ein Formular erfüllt seinen Zweck erst dann vollständig, wenn die Angaben des Besuchers am vereinbarten Ziel ankommen und jemand damit weiterarbeiten kann. Erfassen Sie die bisherigen Felder, Empfänger, Bestätigungen und gegebenenfalls angebundene Buchungs- oder Kundenverwaltungssysteme. Entscheiden Sie, welches Verhalten erhalten bleibt und welches sich ändert. Ein neu aufgebautes Formular kann vertraut aussehen und die Angaben trotzdem an ein anderes Ziel senden.

Führen Sie eine kleine, gezielte Testreihe durch

Verwenden Sie eindeutig gekennzeichnete Testdaten. Senden Sie eine gültige Anfrage und prüfen Sie anschließend das tatsächliche Postfach oder den verknüpften Datensatz: Leistungsauswahl, Nachricht, Antwortadresse und gegebenenfalls vereinbarte Anhänge müssen korrekt ankommen. Testen Sie fehlende Pflichtangaben und eine ungültige E-Mail-Adresse. Prüfen Sie, ob die Erklärung dem Besucher hilft, den Fehler zu beheben.

Lassen Sie sich in einem kontrollierten Test vorführen, wie sich das System bei fehlgeschlagener Zustellung vereinbarungsgemäß verhält. Eine Erfolgsmeldung sollte dem vereinbarten Zustand einer erfolgreichen Übermittlung entsprechen; bei einem Fehler sollte ein hilfreicher nächster Schritt angeboten werden. Verwenden Sie keine echten Kundendaten, um die Fehlerbehandlung zu prüfen.

Folgen Sie außerdem Telefonlinks, E-Mail-Links und Buchungsschaltflächen von der jeweiligen Ausgangsseite aus. Wenn eine Leistungsseite bisher die ausgewählte Leistung an das Anfrageformular übergeben hat, prüfen Sie, ob das weiterhin geschieht. Diese kleine, aber hilfreiche Kontextinformation geht leicht verloren, wenn Seiten und Formulare getrennt neu aufgebaut werden.

5. Prüfen Sie das Design anhand echter Aufgaben

Prüfen Sie die funktionsfähige Vorschau mit den endgültigen Inhalten, nicht nur einen statischen Entwurf. Öffnen Sie die längste Leistungsseite, eine Seite mit mehreren Bildern und den wichtigsten Weg zur Anfrage. Führen Sie auf den vereinbarten Smartphones und in den vereinbarten Desktop-Browsern die anfangs erfassten Aufgaben aus. Prüfen Sie, ob die Navigation bedienbar bleibt, Texte in die vorgesehenen Bereiche passen, Bedienelemente reagieren und wichtige Angaben sichtbar bleiben.

Beziehen Sie Barrierefreiheit in diese Prüfung ein. Die Easy Checks der W3C WAI bieten erste Prüfungen für Überschriften, Bildalternativen, Kontrast, Textvergrößerung, Tastaturbedienung und Formulare. Versuchen Sie, ohne Maus zu navigieren, achten Sie auf eine sichtbare Markierung des Tastaturfokus und vergrößern Sie den Text, während Sie die Hauptaufgabe ausführen.

Diese Schritte dienen einer ersten Prüfung. Der W3C-Leitfaden zur Bewertung erklärt, dass ein Werkzeug allein nicht feststellen kann, ob eine Website die Standards für Barrierefreiheit erfüllt. Dafür ist eine fachkundige menschliche Bewertung erforderlich. Vereinbaren Sie mit Ihrem Dienstleister den erforderlichen Standard, den Prüfumfang und die Zuständigkeit. Erfassen Sie ungelöste Barrieren zusammen mit den übrigen Mängeln.

Bitten Sie zur Beurteilung der Geschwindigkeit um vergleichbare Prüfungen repräsentativer alter und neuer Seiten unter dokumentierten Bedingungen. Beobachten Sie, was während des Ladens von Bildern und Schriften geschieht und ob die wichtigste Aktion bereits nutzbar ist. Betrachten Sie einen Testwert als Hinweis für die Diagnose. Im Abnahmegespräch sollten konkrete Probleme, betroffene Seiten und die vereinbarten Korrekturen benannt werden.

6. Nutzen Sie eine Vorlage mit überprüfbaren Abnahmekriterien

Übernehmen Sie die folgende Vorlage in Ihr Projektdokument. Ersetzen Sie jedes Beispiel durch Ihre tatsächlichen Seiten, Werkzeuge und vereinbarten Testbedingungen. Ergänzen Sie jede Zeile um eine zuständige Person, einen Link zum Nachweis, das Ergebnis und das Prüfdatum. „Sieht gut aus“ verrät der nächsten prüfenden Person nicht, was untersucht wurde.

Beispielvorlage für die Abnahme eines Redesigns
BereichWas nachgewiesen werden muss
InhalteDie vereinbarten Leistungsdetails und Kontaktdaten stehen auf jeder freigegebenen Seite; für Überarbeitungen ist eine zuständige Person benannt.
Bestehende LinksJede Adresse in der Migrationsliste führt zum vereinbarten Ziel oder liefert die vereinbarte Antwort für entfernte Inhalte.
AnfragenEin gekennzeichneter Test kommt mit den vereinbarten Feldern am richtigen Ziel an; Eingabeprüfung und Fehlerzustände wurden geprüft.
BesucheraufgabenEine prüfende Person durchläuft den wichtigsten Nutzungsweg auf den benannten Geräten und Browsern einschließlich der vereinbarten Tastatur- und Zoomprüfungen.
VeröffentlichungDie freigegebenen Inhalte sind online, die kritischen Prüfungen auf der öffentlichen Domain sind bestanden und eine benannte Person kann die vorherige Version wiederherstellen.
VerantwortungDas Unternehmen verfügt über die vereinbarten Zugänge, festgelegte Wartungszuständigkeiten und Anleitungen für regelmäßige Aktualisierungen.

Ordnen Sie die Ergebnisse vor der Freigabe nach ihrer Bedeutung ein. Eine nicht zugestellte Anfrage, eine unerreichbare Leistungsseite oder eine blockierte wesentliche Aktion sollten die Veröffentlichung verhindern. Für eine kleine Korrektur von Abständen können eine zuständige Person und ein späterer Termin vereinbart werden. Treffen Sie diese Unterscheidung gemeinsam, damit keine Seite eine Liste unerledigter Arbeiten mit einem Abnahmeprotokoll verwechselt.

7. Planen Sie die Umstellung und einen praktikablen Weg zurück

Legen Sie vor der Veröffentlichung fest, welche Version freigegeben ist, wer die Umstellung vornimmt und wer sie prüft. Sichern Sie die aktuelle Website und die relevante Konfiguration so, dass sie wiederhergestellt werden können. Klären Sie, was die Wiederherstellung umfasst, wer sie durchführen kann und was mit Anfragen oder Inhalten geschieht, die während der Umstellung eingehen. Eine Sicherung ist nur dann nützlich, wenn das Team weiß, wie sie wiederhergestellt wird.

Vereinbaren Sie, ab wann Inhalte nicht mehr bearbeitet werden und wie spätere Änderungen übernommen werden. Das ist auch bei einer kleinen Website wichtig: Eine aktualisierte Telefonnummer oder Leistungsbeschreibung könnte sonst durch einen älteren Entwurf überschrieben werden. Wenn sich auch Hosting- oder Domaineinstellungen ändern, prüfen Sie ausdrücklich davon abhängige Dienste wie die geschäftliche E-Mail.

Wiederholen Sie unmittelbar nach der Umstellung die kritischen Prüfungen auf der öffentlichen Domain. Kontrollieren Sie alte Links, den wichtigsten Nutzungsweg und die tatsächliche Zustellung einer Testanfrage. Lassen Sie die Entwicklung prüfen, ob öffentliche Seiten die vorgesehenen Indexierungseinstellungen haben und ob vorübergehende Einschränkungen der Vorschau versehentlich in die veröffentlichte Website übernommen wurden. Die für Korrekturen verantwortliche Person sollte während des vereinbarten Veröffentlichungszeitraums erreichbar bleiben.

8. Schließen Sie das Projekt mit Nachweisen und klaren Zuständigkeiten ab

Vereinbaren Sie eine Nachprüfung mit einer benannten verantwortlichen Person. Prüfen Sie gemeldete Probleme, unerwartet fehlende Seiten und die Zustellung von Anfragen. Wenn Suchberichte verfügbar sind, bewerten Sie Veränderungen im Zusammenhang, statt die Entwicklung eines einzelnen Tages als Urteil über das Redesign zu verstehen. Bewahren Sie das Veröffentlichungsdatum und das Änderungsprotokoll auf, damit spätere Beobachtungen untersucht werden können.

Lassen Sie sich bei der Übergabe das endgültige Seitenverzeichnis, die Weiterleitungsliste, die Abnahmeergebnisse, die Zugangsregelungen und die Anleitungen für Aktualisierungen aushändigen. Klären Sie, welche laufenden Aufgaben enthalten sind und welche eine gesonderte Vereinbarung erfordern. Bevor Sie die Übergabe als abgeschlossen betrachten, sollte die Person, die die Website künftig pflegt, eine gewöhnliche Inhaltsänderung vorführen.

Das Website-Redesign von Digital Studio beginnt bei EUR 1.790 für bis zu fünf bestehende Seiten mit Ihren aktuellen Inhalten. Enthalten sind eine Prüfung der Website, ein responsiver Neuaufbau und vereinbarte URL-Weiterleitungen. Größere Migrationen werden separat angeboten. Wenn Sie eine bestehende Website besprechen möchten, senden Sie eine kostenlose Redesign-Anfrage mit ihrer Adresse, dem wichtigsten Problem und den Elementen, die erhalten bleiben müssen. Für die Anfrage ist keine Zahlung erforderlich.

Beschreiben Sie, was sich an Ihrer bestehenden Website ändern soll und was weiter funktionieren muss. Wir helfen Ihnen, den Umfang des Redesigns und die Prüfungen für die Übergabe festzulegen.