Zielsetzung und Vorgaben
Wie funktioniert die Workshop-Buchung? Ich kann XY nicht finden.. Bieten Sie eigentlich auch XY an?
Solche und weitere Fragen gingen regelmäßig bei der Besitzerin eines Münchner Blumenladens ein. Zeitgleich erhielt sie aber auch positives Feedback für die Farbgestaltung und Authentizität ihrer Website. Deshalb war sie hin und hergerissen, ob sie ihren Internetauftritt tatsächlich überarbeiten soll. Meine Aufgabe war es also, ihre Website so zu optimieren, dass die Benutzerführung verbessert, das Aussehen modernisiert und sie sich aber trotzdem noch mit ihrer Website identifizieren konnte.
Konkret sollten folgende Probleme gelöst werden:
- Die Benutzerführung war verwirrend, Kunden haben regelmäßig nachfragen müssen, weil sie Inhalte nicht gefunden haben
- Es gab teilweise Darstellungsprobleme, einzelne Elemente der Website wurden falsch angezeigt
- Die Website war nicht für mobile Geräte optimiert
- Die Website sprach insbesondere die Unternehmens- und Hochzeitskunden nicht an
- Der Webshop sollte komplett modernisiert und benutzerfreundlicher gestaltet werden
- Die Ladezeiten der Website waren zu lange und verschlechterten das Ranking bei Suchmaschinen
- Die Website war nicht für Suchmaschinen optimiert
Wir haben uns gemeinsam dafür entschieden, das Projekt in mehrere Phasen aufzuteilen. Die Veränderungen wurden im Hintergrund durchgeführt, während die Seite live war. So konnte ich garantieren, dass es zu keinen Ausfällen oder finanziellen Einbußen kommt.
Phase 1 – Benutzerfreundlichkeit und Design
Farben & Typographie
Bei der Farbauswahl habe ich einen warmen Braun/Orangeton gewählt. Dieser war ursprünglich in einem Foto auf der Startseite zu finden und passt optisch perfekt zum Thema Trockenblumen. Die Website soll einen warmen, einladenden und herzlichen Eindruck erwecken. Die Hauptfarbe habe ich mit einem Warmweiß ergänzt und zuletzt einen Schwarzton für die Schriftfarbe gewählt. So wird eine gute Lesbarkeit gewährleistet, ohne dass die Augen durch einen zu hohen Kontrast ermüden.
Diese Stimmung soll zusätzlich durch die verwendeten Schriftarten verstärkt werden. Deshalb haben wir uns mit Handlee für eine etwas verspieltere Schriftart für die Überschriften entschieden. Diese wird durch eine besonders gut lesbare Schriftart für Fließtexte ergänzt.
Menüführung und User Interface / Hierarchie
Das Hauptproblem bei der Website war, dass keine Hierarchien erkennbar waren. Der Benutzer hatte nichts, woran er sich orientieren konnte und die Website hatte keine erkennbare Benutzerführung. Deshalb habe ich die Inhalte auf den Einzelnen Unterseiten auf die absolut notwendigen reduziert. Die Startseite gibt jetzt einen Überblick, über das gesamte Angebot an Produkten und Dienstleistungen des Unternehmens. Die einzelnen Beiträge führen über Verlinkungen zu den entsprechenden Unterseiten mit weitergehenden Informationen. So kann der Kunde gezielt die für ihn relevanten Informationen abrufen, ohne danach suchen zu müssen.
Nachdem die Startseite komplett überarbeitet war und einen guten Überblick über das gesamte Angebot des Ladens gab, ging es an die verschiedenen Unterseiten. Hier lag der Fokus vor allem auf der Workshop-Seite. Die Workshops waren zuvor schwer zu finden und es gab einen umständlichen Buchungsprozess. Deshalb habe ich die Website der Auftraggeberin auf ihren Wunsch mit einem externen Dienstleister für Workshopbuchungen verknüpft – der Kunde sucht sich auf der Homepage einen für ihn interessanten Workshop aus und wird mit einem Mausklick direkt zur Buchungsseite weitergeleitet.
Fotografie
Da die Kundin zunächst eigene Fotos für die Inhalte verwenden wollte, habe ich nur das Titelbild der Hero-Section erstellt. Hierfür haben wir gemeinsam einen ihrer Sträuße ausgesucht und ihn direkt vor Ort in ihrem Laden in Szene gesetzt. Das Foto sollte sich harmonisch in die Farbgebung der Website einfügen und einen gewissen „wow-Effekt“ haben. Zudem haben wir uns entschieden, den Strauß an die entsprechende Jahreszeit anzupassen. So fiel schließlich die Entscheidung für einen herbstlicheren Strauß.
Abschluss der ersten Phase
Nachdem alle bereits bestehenden Unterseiten der Homepage an das neue Design angepasst wurden, und die zuvor beschriebenen Probleme gelöst wurden, stand die Abnahme der Website an. Ich traf mich mit der Kundin präsentierte ihr die Ergebnisse und eine kleine Überraschung die ich für sie eingebaut hatte. In einem der Vorgespräch erwähnte sie, dass sie das Foto der Trockenblumen auf ihrer Startseite sehr mochte und fragte, ob man es irgendwie in das neue Design integrieren könne.
Anschließend konnte sie nach den letzten kleinen Anpassungen selbst den Button betätigen und ihre neue Website live schalten.
Im nächsten Blogbeitrag erfahrt ihr, welche neuen Unterseiten ich angelegt habe, um ihre anvisierten Zielgruppen anzusprechen.
