Bereiche durch Farben trennen

  • von Lennart Prange

bereiche Viele Firmen sind heutzutage in den verschiedensten Bereichen tätig. Ihre Homepage wird dementsprechend groß und die Frage ist, wie man die einzelnen Bereiche gestalterisch gut voneinander trennt. Man kann es sich sparen, eine deutlichen optischen Unterschied zu erzeugen, muss man aber nicht. Es ist durchaus sinnvoll die einzelnen Geschäftsbereiche voneinander abzuheben.

Viel Spaß mit dem Artikel. Kommentare und Social Bookmarks würden mich wie immer freuen.

Die Vorteile

  • Farben haben bestimmte Wirkungen und erzeugen Gefühle – Hat man nun eine Internetseite mit verschiedenen Bereichen, die sich komplett voneinander unterscheiden, möchte man vielleicht auf jeder Unterseite etwas anderes vermitteln.
  • Der User erkennt sofort wo er ist – Allerdings ist das erst nach einer bestimmten Gewöhnungszeit so. Danach kann eine farbliche Abgrenzung aber viel schneller erfasst werden, als zum Beispiel ein active Status der Navi.
  • Klares Signal: Sie sind woanders – Der Farbwechsel signalisiert eindeutig, dass man den Bereich gewechselt hat und das kann auch zur Benutzerfreundlichkeit beitragen.

Was sollte man beachten?

  • Stil einhalten – Farbwechsel sind schon recht heftig. Damit der User noch weiß, auf welcher Seite er sich gerade verbindet und sich nicht wundert, warum plötzlich alles anders ist und denkt, dass er auf einer anderen Website gelandet ist, sollte man den gestalterischen Stil unbedingt konsequent einhalten.
    Vielleicht arbeitet man immer mit abgerundeten Boxen und benutzt immer eine bestimmte Art von Verlauf.
  • Aufbau einhalten – Sony zeigt, dass das nicht zwingend notwendig ist, aber trotzdem denke ich, dass es wichtig ist, dass alle Unterseiten einen ähnlichen Aufbau haben. Die Gründe sind die gleichen wie bei Stil einhalten.
Das Beispiel: Sony

Sony hat viele verschiedene Geschäftsbereiche. Fernseher, Kameras, Notebooks usw. Die Gestalter der Website haben die einzelnen Bereiche meiner Meinung nach sehr schön voneinander getrennt. Trotz wechselnden Aufbaus und wechselnder Farben ist immer klar, dass man sich gerade auf der Sony Seite befindet.

Die Homepage

Kameras, HD-TV, Blu-ray, mp3-Player, Notebooks - Sony

Sony Vaio

VAIO - Willkommen - Deutschland

Walkman

Der neue WALKMAN der W-Serie - Sony

HDTV

HDTV, HighDefinition-Produkte HD ready - Sony

Bravia

Sony- BRAVIA LCD-TVs- 200Hz und Full HD - Sony

9 Kommentare

  1. Patrick Amrhein
    23. Januar 2009 um 20:47 Uhr

    Auch ein wirklich deutliches Beispiel zeigt Sony Ericsson. Der Stil bleibt immer gleich, nur die Hintergrundfarbe ändert sich.

    Patrick Amrheins letzter Beitrag..Mit hyves eine PR-Abstrafung feststellen

  2. Anne-Kathrin
    23. Januar 2009 um 21:57 Uhr

    Ja, die Handy Seite ist schon fast zuviel des Guten, finde ich, die Farben zudem zu krachig. Aber das mag Geschmackssache sein.

    Idealerweise – um auf den Artikel zu kommen- zeigen ja die Navigation oder andere Element, beispielsweise gruppierte News aus einzelnen Bereichen, an sich schon in irgendeiner Form an, wie es farblich weitergeht.
    Es muss deswegen nicht gleich quietschbunt sein.
    Eine Startseite, die ein bisschen dashboardartig aufgemacht ist, bietet sich dafür hervorragend an.

    Anne-Kathrins letzter Beitrag..Der Umgang mit Text und Typo

  3. nastorseriessix
    24. Januar 2009 um 15:57 Uhr

    Na das sind ja nun wirklich keine Normalen Seiten, eher professionell Firmenseiten von bekannte Marken.

    Farbliche Unterschiede sollte allerdings jeder auf seiner Seite/Blog verwenden, alleine schon wegen der Optik.

    nastorseriessixs letzter Beitrag..Mac – Black & White 2

  4. Ahmet Topal
    24. Januar 2009 um 16:10 Uhr

    Stimmt, dass benutzt man öffters bei Flash seiten, damit man verschiedene Links (Navi) trennen kann…
    Aber schöner Artikel, danke

    Ahmet Topals letzter Beitrag..Mein Portfolio at20.de

  5. Askold
    25. Januar 2009 um 11:36 Uhr

    Die Sony Seite ist aber auch echt gut. Da steckt en echt gutes Konzept dahinter.

  6. Thomas Scholz
    25. Januar 2009 um 15:28 Uhr

    Bei Sony funktioniert das gut, weil der Rest des Layouts eisern konstant bleibt. Ich bin mir aber nicht sicher, ob sich die Besucher um die jeweils anderen Farben scheren oder gar lernen. Zumindest bleiben so die Designer beschäftigt. 🙂

    Interessant wird so ein Aufbau, wenn man irgendwann später zwei separate Abschnitte zusammenführen will oder muß.

    Thomas Scholzs letzter Beitrag..Deppenlink entfernen

  7. Rui
    26. Januar 2009 um 18:12 Uhr

    Ich glaube nicht, dass es wirklich den User interessiert, was er da für Farben sieht und wann und wo er die sieht. Es ist doch so. dass solche Sachen einfach in den Hintergrund treten und wir diese einfach nur teilweise oder gar nicht wahr nehmen. Überlegt mal. Wisst ihr noch was euer Chef heute anhatte in der Arbeit? Da passt einfach keiner auf. Farben einsetzen um damit gewisse Gefühle hervorzurufen das ist gar nicht verkehrt. Aber ansonsten wahrscheinlich eher weniger.

  8. Elusian
    27. Januar 2009 um 18:26 Uhr

    @Rui: Es geht bei solchen Systemen nicht darum ob die Farben jemanden interessieren (daher hinkt auch der Vergleich), sondern um den Nutzer (unterbewusst) zu steuern und eine notizfähige Wiedererkennung zu schaffen. Sowas fördert auch die Navigation durch die Seiten (gut Sony ist da wiederum ein schlechtes Beispiel aber bei denen geht es auch um die Produktassoziation). Das gehört aber dann schon wieder in die Marketingabteilung.

  9. Reinhold
    28. Januar 2009 um 18:34 Uhr

    Manche Unternehmen machen intensiven und wechselnden Gebrauch von Farbe. Ich denke, dass entspricht meist deren Dynamik und Image-Vorstellung.

    Grundsätzlich ist die Signalwirkung einer Farbe sehr wichtig; auch im Einsatz in einer Website. Damit kann die Benutzerführung und Orientierung unterstützt werden.

    Anders verhält es sich mit der Struktur der Website. Die sollte meiner Meinung nach gleich oder zumindest sehr ähnlich sein.