Gerade haben wir die neu designte Webseite für unseren Kunden ANACOR | Der Kapitalbeschaffer online gestellt, über die wir heute berichten möchten. Aber was ist eigentlich so ein „Webseiten-ReDesign“ und wie unterscheidet man dieses von einem sogenannten „Relaunch“?

Von einem „Relaunch“ spricht man, wenn sich Inhalte und Design auf einer Webseite maßgeblich ändern, während für ein „Redesign“ nur die visuelle Gestaltung überarbeitet wird (Inhalte und Konzeption bleiben grundsätzlich erhalten). Ein ReDesign entspricht also vergleichsweise der Renovierung einer Wohnung, während ein Relaunch eher einer Komplettsanierung  gleich kommt.

Was waren die Ziele des ReDesigns?

Bereits im ersten Gespräch mit unserem Auftraggeber Frank Hopp, Inhaber der ANACOR, wurde klar, dass es ihm nicht nur um eine optische Aufwertung seiner Webseite ging. Genauso wichtig waren ihm die Nutzerfreundlichkeit (Usability) und eine verbesserte Kundenumwandlung (Conversion) seiner webseite.

In einem ausführlichen Briefinggespräch mit MKM wurden die gewünschten Verbesserungen en Detail besprochen und die dafür erforderlichen Maßnahmen abgeleitet. Selten trifft man als Agentur auf Kunden mit so konkreten Vorstellungen, wie in diesem Fall. Die entscheidenden Fragen hatte Frank Hopp bereits durchdacht und konnte uns diese im Erstgespräch sehr genau beantworteten. Eine enorme Zeitersparnis für das gesamte Projekt!

Spielen Sie selbst mit dem Gedanken einer Überarbeitung Ihrer Webseite?

…dann sollten Sie für sich vorbereitend schon einmal  folgende Fragen beantworten:

1. Sind Logo und Corporate-Design noch zeitgemäß oder müssen sie ggf. neu erstellt werden?
2.  Welches primäre Ziel wird mit dem Relaunch verfolgt?
3.  Sollen bestehende Inhalte übernommen werden (Qualität? Aktualität? Relevanz?) und wenn ja, welche?
4.  Wer erstellt die neuen Texte?
5.  …und wer liefert ggf. neues Bildmaterial?
6.  Gibt es andere Webseiten, die als Vorbild für das gesamte Design oder einzelne Designelemente heran gezogen werden können?
7.  Welches Budget kann bzw. will ich maximal in den Relaunch investieren?

Für die ANACOR-Seite war die Wunschliste schnell formuliert: Ein neues Logo und mehr Farbkontraste sollten der Seite eine modernere Anmutung verschaffen. Ein reduziertes Menü und eine klarere Struktur sollten die Besucher schneller und gezielt zu den gewünschten Informationen führen. Mittels der konsequenten Nutzung von Response-Buttons (Call to Action) und einem neuen Newsletterangebot sollte die Umwandlungsquote der Seite verbessert werden. Und quasi als Sahnehäubchen wünschte der Kunde die Einbindung eines Blogs.

Die Umsetzung – vom ersten Eindruck bis zum responsiven Design

Eine Website lebt von Interaktionen. Daher ist es sinnvoll, dem Auftraggeber bereits zu Beginn des Umsetzungsprozesses einen Eindruck vom geplanten Interface und der Usability geben. Oft können sich Kunden nämlich nicht vorstellen, wie die Website später wirkt. Für die umsetzende Agentur bietet dieses Vorgehen zudem den Vorteil, etwaige Diskrepanzen zwischen eigenen Vorstellungen und der Erwartungshaltung des Auftraggebers frühzeitig zu erkennen und entsprechend zu reagieren.

Also haben wir für ANACOR im ersten Schritt eine Mockup erstellt, die die neue Struktur erkennbar gemacht und ein erstes Gefühl für das neue Layout vermittelt hat. So konnten unsere Umsetzungsvorschläge schon in dieser Phase visualisiert und mit Frank Hopp abgestimmt werden.

Bereits mit wenigen, aber entscheidende Veränderungen des Designs wurde  die visuelle Wirkung des Auftritts wesentlich verbessert:

1. neues Logo
2. reduzierte Menüleiste
3. kontrastreichere Farbgestaltung
4. prominente, animierte Headlines
5. Icons als visuelle Wegweiser

Die Animation der Headlines über ein modernes Slider-Tool lenkt die Aufmerksamkeit des Betrachters nun auf die Kernaussage der jeweiligen Seite. Und durch den Einsatz sogenannter „Accordions“ (Aufklappfunktion der Kästchen rechts) wird eine interaktive Nutzung ermöglicht, die dem Interessenten bei Bedarf weitere Inhalte vorlegt.

Over all erscheint die Webseite heute wesentlich klarer und übersichtlicher. Die beispielhafte Gegenüberstellung der Subseite „Zusammenarbeit“ vor- und nach dem Relaunch lässt die Unterschiede bereits deutlich werden:

Vorher:

 Nachher:
*Nummerierung der Maßnahmen s.o.

Bei Interesse zeigen wir Ihnen beide Webseiten gerne einmal im Vergleich. Rufen Sie uns einfach an und wir vereinbaren einen Präsentationstermin!

Auch die Nutzung der Website auf mobilen Geräten wurde deutlich verbessert. Im Sinne eines „responsiven Webdesigns“ wurden die Bilder und die Headlines so angepasst, dass sie auf kleineren Bildschirmen oder im Querformat immer so angeordnet weden, dass sie dem Betrachter das optimale Nutzererlebnis ermöglichen. Durch die zunehmende Anzahl an Endgeräten gibt es ständig neue Herausforderungen und Kunden­wünsche. Eine Website muss heute auf den unterschiedlichsten Desktops, Tablets und Smartphones gut aussehen -auch Smartwatches werden immer interessanter. Im Falle der ANACOR-Seite eine besondere Herausforderung, da die Headlines auf den Startbildern der einzelnen Seiten die Fotos nicht überdecken sollten. Eine Anordnung, die sich auf kleinen Bildschirmen nicht durchhalten lässt. So mussten für diese eigene Slidermotive angelegt werden

ANACOR-Startseite Smartphone

Ein nahtloser Übergang – von außen kaum bemerkbar

Während der Entwicklung des Projekts erfolgte die Umsetzung auf einem separaten Server. Selbst­ver­ständlich nach außen gesperrt, damit niemand auf die Seite kommen konnte und sie nicht vorzeitig durch die Suchmaschinen indexiert wurde. Unser Auftraggeber hingegen hatte – natürlich passwortgeschützt – frühzeitig Einblick in die Entwicklungen.

Die Umstellung der Seite selbst (Migration) verlief dann problemlos. Dies ist nicht immer selbst­ver­ständlich und in diesem Fall sicher der Tatsache zu verdanken, dass die alte und die neue Seite ähnliche Menüpunkte vorsehen und beide auf dem CMS (Content Management System) „WordPress“ aufgesetzt wurden. Wird die Seiten-Struktur hingegen stark verändert, ist der soge­nannte „Redirect 301“ einer der wichtigsten Schritte beim Relaunch. In diesem Fall sollten 301-Weiterleitungen auf die entsprechenden Unterseiten in der neuen Struktur vorbereitet werden. Hierfür lohnt es sich, einen Weiterleitungsplan anzulegen um keinen Traffic zu verlieren. Und es gilt, Kontaktformu­lare, Social-Media-Integrationen, RSS-Feeds und SEO-Settings auf die richtige Zieladresse zu überprüfen.

Zu guter Letzt wurde der Google Analytics-Code auf der neuen Webseite wieder integriert. Schließlich will man ja wissen, wieviel besser die neuen Seite funktioniert ?.

Heute finden Sie ANACOR – Den Kapitalbeschaffer im neuen Outfit auf www.anacor.de.
Wiedererkennbar, aber deutlich übersichtlicher und moderner!

Fazit:

Ein ReDesign muss nicht zwingend teuer sein! Bei klarer Zielsetzung und guter Vorbereitung bleiben die Kosten überschaubar. Und Sie können Ihre Webseite bereits nach einer kurzen Projektzeit in neuem Glanz erstrahlen lassen. Kontakten Sie uns – wir beraten Sie gerne!

Ihre Elisabeth Stahmer
MKM-Marketing

Titelbild: Freepick <a href=’https://www.freepik.com/free-photo/side-view-of-graphic-designer-at-desk_1199963.htm‘>Designed by Freepik</a>