8 inspirierende Redesigns bekannter Webseiten, welche dich beeindrucken werden

Eine Website ist ein sehr lebendiges Wesen, das sich stetig anpassen und verändern muss. Neue Anforderungen der Suchmaschinen oder der Kunden drängen nicht nur zum Neustart, sondern machen diesen wünschenswert. Denn mit der Zeit gewöhnt sich das Auge zu sehr an das Gewohnte. Es langweilt. Und so finden sich genügend Gründe für ein kreatives Redesign, wie folgende Beispiele eindrucksvoll beweisen.

Aus Alt mach Neu

Es gibt genügend Gründe für die komplette Neugestaltung einer Website. Wir sehen diese sofort, der Kunde leider nicht immer. Mit unseren Beispielen und einer Liste von „5 Tipps, wie ihr eure Kunden überzeugen könnt, ein Redesign vorzunehmen“ möchten wir euch deshalb gerne zur Seite stehen.

Redesign-Beispiel #1: Apple

Website: www.apple.com

Grund des Redesigns: Harter Kontrast zur alten Produktlinie

Apple steht für Design – nicht nur bei den Geräten und Software, sondern immer auch schon im Web. Da zeigte schon die Umstellung auf iOS 8 und Mac OS X Yosemite , wie sich auch die Darstellung im Netz verlagern werde: weg von der realistische Darstellung dreidimensionaler Elemente mit Schattenwurf (der so genannte Skeuomorphismus), hin zum Minimalismus des Flat-Designs. Noch realistischer war auch kaum möglich, da bietet sich das Gegenteil als harter Kontrast einfach an.

Redesign Apple

Redesign-Beispiel #2: Cloud

Website: www.cloudmgr.com

Grund des Redesigns: Kompletter Neustart des Produktes

Vormals bekannt als CloudSafe365, wurde nicht nur die Seite überarbeitet, sondern der Name und praktisch die ganze Corporate Identity ausgetauscht. Der himmelblaue Wolkenhintergrund (nicht gerade eine originelle Idee zum Thema Cloud) war einfach zu allgemein. Schön anzusehen, aber es bleibt nichts hängen. Die Lösung war hier sehr radikal: der Name wurde zu CloudMGR geändert, das Logo überarbeitet und Orange als dominierende Farbe eingesetzt.

Redesign Cloud

Redesign-Beispiel #3: Blinksale

Website: www.blinksale.com

Grund des Redesigns: Allgemein schlechte Qualität des alten Auftritts

Von „Oh… mein… Gott…“, wer hat denn diese Farbverläufe durchgehen lassen, zu angenehm und übersichtlich in der Gestaltung. Als App hat die Website nur ein Ziel: eine gute „Conversion Rate“. Der Besucher soll Vertrauen gewinnen und die App installieren. Und da haben nicht nur die Farben entgegen gewirkt, sondern auch die viel zu große Anzahl kleinster Kästchen verschiedenster Inhalte. Wo soll der Besucher da hinschauen? In der aktuellen Variante stellt sich dies Frage nicht, da geht es von einem ersten Blick auf die App, über die Vorstellung einiger Features hin zu einer Tour oder aber zum Download.

Redesign Blinksale

Redesign-Beispiel #4: NASA

Website: www.nasa.gov

Grund des Redesigns: Regelmäßige Redesigns im Schwarz- und Weiß-Wechsel

Die Website der Nationalen Aeronautik- und Raumfahrtbehörde hat schon so einige Redesigns und – interessanterweise – Wechsel von weißem auf schwarzem Hintergrund und wieder zurück erfahren. Zuletzt war das eine leichtblaue Farbpallette. Ein Artikel wurde groß präsentiert, weitere darunter als kleine Thumbnails angepriesen. Die aktuelle Version präsentiert sich wieder vor schwarzem Hintergrund, wobei es den Webdesigner wohl (bildlich gesehen) zum Nachthimmel zieht, der ja auch perfekt zur NASA passt. Die Artikel werden nun weitaus größer präsentiert, wobei der Masonry-Stil zum Einsatz kommt, was Mauerwerk bedeutet und die Art der Kachelung der einzelnen Fotos gut beschreibt.

Redesign Nasa

Redesign-Konzepte

Sehr spannend sind auch die folgenden Projekte, die rein virtueller Natur sind. Es sind Konzepte, wie sich der jeweilige Designer die Neugestaltung eines bekannten Projekts vorstellt. Scheinbar Spaßprojekte, sorgen diese Umsetzungen doch immer für großen Wirbel in den sozialen Netzwerken.

Redesign-Beispiel #5: Facebook

Website: Facebook-New-Look-Concept

Facebook hat kaum revolutionäre Redesign gezeigt, sondern vielmehr eine Evolution an neuen Funktionen. Alles passt sich fließend an. Dieses Konzept von Fred Nerby ist da schon weitaus gewagter: die News werden nicht mehr untereinander, sondern als Kacheln im Grid präsentiert. Fotos und dazugehörende Kommentare und Likes werden als eckige Sprechblase eingeblendet. Generell ist das Design weitaus Bild-lastiger und animierter.

Konzept Facebook

Das folgende Video zeigt das Konzept in Aktion, was die Vorstellung des Gestalters weitaus besser deutlich macht. Facebook wird diesen Weg nicht mitgehen, da es dem minimalistischen Anspruch widerspricht. Allemal ist das Projekt eine geniale Referenz für diesen Webdesigner.

Redesign-Beispiel #6: Twitter

Website: Twitter-redesign-concept

Zsolt Hutvagner hat sich Twitter vorgenommen. Die Idee scheint sich am Facebook-Beispiel anzulehnen. So wird auch hier das Konzept der untereinander folgenden Nachrichten aufgegeben und diese in einen Grid verlegt. Meldungen öffnen sich nach dem Klick in einem Fenster, wie es auch jetzt schon möglich ist, allerdings wird der Account des Urhebers deutlicher hervorgehoben und auch zum Folgen aufgerufen.

Konzept Twitter

Redesign-Beispiel #7: Amazon

Website: https://dribbble.com/shots/1388275-Amazon-Streaming-Redesign

Amazon ist über die Jahre immer größer und unübersichtlicher geworden, was auch für den Video-Bereich von Amazon Prime gilt. James Cipriano bietet uns dazu eine Alternative an, die zwar minimalistisch, aber visuell doch bemerkenswert daher kommt. Links sehen wir in der Sidebar wenige Menüpunkte, unterstützt durch passende Icons. Auf der rechten Seite werden die Filme vorgestellt, wobei erste Informationen und Bewertungen in einer Sprechblase erscheinen. Im Hauptmenü wurde darauf geachtet, dass der Besucher der Website nicht abgelenkt wird. Weitere Menüpunkte sind zunächst ausgeblendet.

Konzept Amazon

Redesign-Beispiel #8: Wikipedia

Website: Wikipedia-Main-page

Es spricht doch eigentlich nichts dagegen, eine Enzyklopädie auch visuell ansprechend umzusetzen. George Kvasnikov hat sich dazu seine Gedanken gemacht und zeigt die Startseite mit Bildmaterial gefüllt, wobei bekannte Bereiche wie etwa „In den Nachrichten“ oder „Was geschah am…“ erhalten blieben. Die einzelnen Seiten erhalten so etwas von einen Magazin, statt das Webdesign der 90er-Jahre zu huldigen, wie es derzeit den Anschein hat. Die große Präsentation des Bildmaterials setzt allerdings auch solches voraus. Je nach Thema wird das nicht immer so ästhetisch wirken, wie hier dargestellt.

Konzept Wikipedia

5 Tipps, wie ihr eure Kunden überzeugen könnt, ein Redesign vorzunehmen

Redesign-Grund #1: Mobile Kompatibilität

Immer noch der Hauptgrund und beste Überzeugungskraft liegt wohl in der Überarbeitung oder kompletten Neugestaltung einer Website, falls diese noch nicht für mobile Endgeräte optimiert wurde. Dieser Punkt kann kaum noch ignoriert werden, da die Zugriffszahlen der Nutzer für sich sprechen. Hinzu kommt, das Google Webseiten besser bewertet, die für den mobilen Einsatz optimiert wurden (und dabei ist es nicht einmal wichtig, ob 5% oder 50% der Nutzer über ein mobiles Endgerät kommen). Ihr könntet die Website Responsive gestalten oder eine spezielle mobile Version umsetzen.

Redesign-Grund #2: SEO

Jedem Unternehmer ist mittlerweile bekannt, das er im Netz nur dann entdeckt wird, wenn er zumindest unter den ersten Ergebnissen einer Suche gelistet wird. Anfragen dazu wird er genügend erhalten, um diese Optimierung umzusetzen. Hier geht es aber auch um alte Kontakt, die leicht wieder aufgefrischt werden können, da die Vertrauensbasis schon besteht. Grund für d en Kontakt ist eure Umsetzung aktueller Techniken, sowie der „neue“ Trend Content Marketing. Vielleicht ist ein Firmenblog oder eine Newsseite ja jetzt interessant. Google bewertet Seiten mit stetigen Änderungen besser als die Homepage, die zuletzt vor fünf Jahren verändert wurde.

Gründe für ein Redesign

Redesign-Grund #3: Kundenwünsche

Mit der Zeit wird der Unternehmer und seine Mitarbeiter mehr und mehr Informationen darüber erhalten, was Kunden an der Seite bemängeln und welche Features beliebt sind. Steht der Kontakt, so ist das ein Ansatz, einfach mal zu fragen, ob es Feedback zur Website gibt und wie diese ausfällt. Oft ergibt sich so eine weitere Option, um über eine Neugestaltung zu sprechen. Auch die Bedienung der Website durch die Mitarbeiter ist in diesem Zusammenhang ein starkes Thema: können Seiten leicht geändert werden (neue Texte, Fotos austauschen) oder ist das aktuelle CMS zu schwierig oder gar noch keines vorhanden?

Redesign-Grund #4: Unternehmensziele

Werden die Ziele der Homepage erreicht? Falls es darum geht, Kunden zu informieren, so könnte die neue Website mit einer FAQ, Erklärvideos, Tutorials und einer Dokumentation umgesetzt werden. Geht es vielmehr um die Kundengewinnung, so bieten sich vielleicht gezielt ausgerichtete Landingpages als Ergänzung an, inklusive A/B-Testing. Soll die Website das Unternehmen wiederspiegeln, so geht es um eine frische Corporate Identity, die auch den Printbereich mit einschließt. Hier gilt es also herauszufinden, warum der Unternehmer online ist (und wenn man nur die Konkurrenz beeindrucken möchte: auch darauf kann die neue Website ausgelegt werden).

Kundenwünsche

Redesign-Grund #5: Alter

Auch das Alter einer Website ist ein guter Grund für ein Redesign. Hier kommen praktisch alle oben genannten Gründe zusammen. Oft hat eine Website eine Lebenszeit von fünf bis sieben Jahre. Für den Unternehmer ist das noch im Rahmen (er kann die feinen und trotzdem wichtigen Unterschiede neuer Techniken auch kaum abschätzen), für den Webdesigner dagegen sind das gefühlt Jahrzehnte. Unsere Empfehlung ist der Kontakt zu alten Kunden, für die vor Jahren einmal eine Website gestaltet wurde und die in absehbarer Zeit wohl selbst darauf kommen werden, diese neu umsetzen zu lassen. Glaubt bitte nicht, dass man sich zwingend an euch erinnert.

Dirk Metzmacher

Dirk Metzmacher ist der Herausgeber des Photoshop-Weblogs, sowie Fachjournalist und Content-Profi, dessen Artikel seit über 12 Jahren Leser von Fachpublikationen wie DigitalPhoto, Dr.Web, PSD-Tutorials und (in zahlreichen Content Marketing-Kampagnen) Unternehmen von den Grundlagen bis hin zu professionellen Arbeitsweisen begleitet haben.

Kommentare (2) Schreibe einen Kommentar

  1. Pingback: 8 inspirierende Redesigns bekannter Webseiten, welche dich beeindrucken werden | Photoshop-Weblog – Alles zum Thema Bildbearbeitung

  2. Interessante Beispiele 🙂 Bei manchen Seiten sieht man einfach, dass sie schon ein paar Jahre auf dem Buckel haben. Da muss man einfach mit der Zeit gehen.
    Bei Amazon würde ich aber zum Beispiel gar kein Redesign wollen. Die Seite finde ich für meinen Geschmack sogar recht übersichtlich.

    Antworten

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.