Drucken
  • Facebook
  • Google+
  • Twitter
  • XING
28.06.2015

Die Wurzeln des Minimalismus im Webdesign

Viele der heute beliebtesten Designtrends wurden vom Minimalismus inspiriert. Diese Webdesign-Bewegung begann in den frühen 2000er Jahre, basiert allerdings auf der Philosophie früherer Bewegungen aus den Bereichen der bildenden Kunst und der Mensch-Computer-Interaktion.

© contrastwerkstatt

 

by Kate Meyer (deutsche Übersetzung) - 28.06.2015

 

Viele derzeit beliebte Designtrends (inklusive Flat Design, große Hintergrundbilder und die verborgene globale Navigation) wurden direkt oder indirekt vom Minimalismus beeinflusst, einer Webdesign-Bewegung, die anfangs der 2000er Jahre begann und deren Philosophie auf früheren Entwicklungen aus den Bereichen der bildenden Kunst und der Mensch-Computer-Interaktion basiert. Der Minimalismus stellt manchmal den Versuch dar, Inhalte mit einer höheren Priorität zu versehen als den Chrome. Und, sofern es korrekt angewandt wurde, hilft es, das Design auf vereinfachte Nutzeraufgaben zu fokussieren.

Leider missverstehen einige Designer den Minimalismus als eine rein visuelle Designstrategie. Sie entfernen oder verbergen wichtige Elemente, um ein minimalistisches Design zu erzielen – und nicht wegen den Vorteilen, die diese Strategie für Nutzer haben könnte. Sie übersehen die Kernphilosophie und den historischen Kontext des Minimalismus und riskieren, die Komplexität zu erhöhen, anstatt sie zu reduzieren.

Um minimalistische Prinzipien zu erfassen und anzuwenden, müssen wir die Wurzeln des Minimalismus und seine grundlegenden Charakteristika verstehen. Wir behandeln dieses Thema in einer Serie von zwei Artikeln: Im ersten Artikel definieren wir Minimalismus und werfen einen Blick auf seine Geschichte. Im zweiten Artikel analysieren wir die Tiefe der Charakteristika des minimalistischen Designs und ihren Einfluss auf die Usability.

Was ist eine minimalistische Nutzeroberfläche?

Bei richtiger Anwendung sollte es das Ziel eines minimalistischen Webdesigns sein, Inhalte und Funktionen auf einfache, direkte Weise zu präsentieren, indem so wenig wie möglich vom Hauptinhalt abgelenkt wird. Die Strategie bedeutet oft, dass Inhalte oder Funktionen entfernt werden, die nichts mit dem Hauptziel der Nutzeroberfläche oder ihrer Nutzer zu tun haben.

Obwohl es Gegenstand von Debatten ist, was genau als minimalistisches Webdesign bezeichnet werden darf, gibt es einige Funktionen, auf die sich die meisten Designer einigen können. Sie beinhalten flache Texturen, beschränkte Farbpaletten und die Verwendung von negativem Raum. Diese und andere spezifische Eigenschaften und ihre Verwendungshäufigkeit auf minimalistischen Webseiten werden im Detail im nächsten Artikel dieser Serie diskutiert.

Minimalismus ist eine Reaktion auf aufgeblasenes oder „maximalistisches“ UI-Design. Beispiele für solche maximalistischen Designs beinhalten Flash Intros und überflüssige Animationen oder Anwendungen voller esoterisches Funktionen (wie Microsoft Office vor der Überarbeitung im Jahr 2007).

Darstellung eines minimalistischen Designs

Das Portfolio des Designers Brian Danaher ist ein typisches Beispiel für das, was viele Designer eine minimalistische Webseite nennen. Wenn sie im Vollbildmodus auf einem 15 Zoll MacBook Pro betrachtet wird, ist die Startseite fast komplett weiß. Die Webseite verwendet eine graustufige Farbpalette mit einer einzelnen, auffallenden Akzentfarbe, um Aufmerksamkeit auf klickbare Elemente zu lenken - eine Strategie, die bei minimalistischen Designern sehr beliebt ist.

 

Die Webseite von Danaher lenkt kaum vom Hauptinhalt ab. Minimalismus eignet sich sehr gut für derartige Portfolio-Webseiten, welche relativ einfache Ziele haben, wenige Inhalte enthalten und deren Informationen sich auf den meisten Seiten ähneln. Minimalismus effektiv auf komplexen Webseiten anzuwenden, kann wesentlich schwieriger sein.

Der Anstieg der Popularität des Minimalismus

1960er

Jahrzehnte bevor der Minimalismus zu einem Webdesign-Trend wurde, war er eine Bewegung der bildenden Künste im Zeitalter nach dem Zweiten Weltkrieg. Er tauchte als Reaktion auf die chaotischen Farben, Bewegungen und ausgeprägte Subjektivität auf, die häufig in abstrakten, expressionistischen Werken (wie den Drip Paintings von Jackson Pollock) zu finden waren. Er wurde stark von der berühmten deutschen Kunstbewegung Bauhaus beeinflusst, welche sich auf ein einfaches, aber funktionelles Design konzentrierte.

In den 1960er Jahren wurde der Minimalismus in verschiedenen Bereichen beliebt - vor allem in der bildenden Kunst und der Architektur. In der bildenden Kunst zeichnete sich Minimalismus durch monochrome Paletten, geometrische Elemente, serielle Anordnung und industrielle Materialien aus.

Jackson Pollock's Full Fathom Five

Full Fathom Five (1947) von Jackson Pollock im Museum of Modern Art

Bekannte Minimalisten beinhalteten den Grafikdesigner Josef Müller-Brockmann, den Maler Ellsworth Kelly und den Industriedesigner Dieter Rams. Beachten Sie die klaren Linien, die Einfachheit und die sparsame Verwendung von Farben in jedem dieser Beispiele. Trotz der großen Auswahl von Medien ist ein einheitlicher Designstil erkennbar.

Ellsworth Kelly's Brooklyn Bridge VII

Brooklyn Bridge VII (1962) von Ellsworth Kelly im Museum of Modern Art

Radio by Dieter Rams

RT 20 tischsuper radio (1961) von Dieter Rams für Braun. Unverändertes CC-Bild mit freundlicher Genehmigung von Vitsoe.

S.R. Crown Hall

S.R. Crown Hall, Design von Ludwig Mies van der Rohe, 1956. Unverändertes CC-Bild mit freundlicher Genehmigung von Peter Alfred Hess.

Die Perspektive der minimalistischen Kunst fasst das Motto des berühmten Architekten Ludwig Mies van der Rohe aus dem 20. Jahrhundert zusammen: „Weniger ist mehr“. Dieses Motto wurde später zum Geist und inoffiziellen Mantra des Minimalismus im Webdesign: weniger Elemente auf einer Webseite führen zu einer geringeren kognitiven Belastung für den Benutzer.

1980-2000

Am Ende des zwanzigsten Jahrhunderts nahm der Minimalismus als separater Trend im Bereich der Mensch-Computer-Interaktion Gestalt an.

Im Jahr 1983 stellte Edward Tufte, ein Experte für Datenvisualisierung, in seinem Werk The Visual Display of Quantitative Information das Konzept des „Data-Ink Ratio“ vor. In den Printmedien wird das „Data-Ink Ratio“ als Verhältnis zwischen (1) der Tintenmenge, die Informationen kommuniziert, und (2) der gesamten Tinte, die verwendet wird, um die Grafik zu drucken. Tufte befürwortete eine Maximierung dieses „Data-Ink Ratios“, indem Elemente, die keine neuen Informationen kommunizieren, entfernt werden.

Data–Ink Ratio = Informative Tinte / Gesamte Tinte

Das Konzept des „Data-Ink Ratios“ kann für Nutzeroberflächen im Internet verwendet werden, indem das Inhalt-Element-Verhältnis der Nutzeroberfläche berücksichtigt wird. Das Ziel ist ähnlich: ein hoher Anteil von aussagekräftigen Elementen im Verhältnis zu allen Elementen der Nutzeroberfläche.

Im Jahr1990 untersuchte der HCI-Forscher John M. Carroll die Art und Weise, wie Menschen technische Schulungshandbücher verwenden, und suchte nach Möglichkeiten, um diese zu verbessern. Basierend auf seiner Forschung entwickelte er die Theorie des Minimalismus in der technischen Kommunikation. Die Theorie von Carroll besagt, dass ein erfolgreiches Design schnelle Handlungen unterstützt, indem Prägnanz mit einer hohen Priorität versehen wird.

Carroll betonte, dass die Reduktion eines Designs auf seine grundlegenden Elemente nicht das eigentliche Ziel des Minimalismus ist. Stattdessen befürwortete Carroll Prägnanz und Einfachheit, um aufgabenorientierte Resultate zu erzielen. Um diesen Ansatz des Webdesigns zu positionieren: Carroll’s Ansatz heisst übersetzt, die Schnittstelle aus dem Weg zu schaffen, um es den Nutzern zu ermöglichen, ihre Ziele zu erreichen.

Im Jahr 1995 führte Jakob Nielsen das minimalistische Design in seine 10 Usability-Heuristiken ein. Seine Verwendung des Begriffs stimmte mit der Definition des Minimalismus von Tufte und Carroll überein, da er das Entfernen irrelevanter Informationen von der Benutzeroberfläche befürwortete.

2000er

Ab Mitte der 2000er Jahre fanden die minimalistischen Kunstbewegungen erstmal in den Web-Nutzeroberflächen Anklang: größere negative Räume, weniger Inhalte und reduzierte Farbpaletten. Google wird häufig als Pionier der minimalistischen Web-Nutzeroberfläche genannt. Auf der Google-Website haben Einfachheit und Nüchternheit seit dem Beta-Release in den 90er Jahren eine hohe Priorität.

Google, 1999

Google Startseite (1999, über Wayback Machine)

Obwohl Google heutzutage eine große Auswahl von Produkten - von Google Drive und YouTube bis hin zu Gmail und Google Maps - anbietet, veränderte sich seine Startseite in den letzten 15 Jahren nur geringfügig. Es sind nur drei Navigationsoptionen sichtbar: um auf das restliche Angebot von Google zuzugreifen, müssen Benutzer auf das Rastersymbol klicken, um weitere Optionen zu sehen.

Google, 2015

Google Startseite (2015)

Trotz frühen Trendsettern wie Google, dauerte es einige Zeit, bis der Minimalismus im Webdesign Fuss fassen konnte. Anfangs der 2000er Jahre dominierten überladene Nutzeroberflächen das Internet. Während unserer Tests beschrieben die meisten Nutzer die Nutzeroberflächen zu dieser Zeit als „hektisch“.

Langsam aber sicher konnte sich der Minimalismus bei den Early Adoptern behaupten: den Webdesignern, Grafikdesignern, Künstlern, Fotografen, Architekten und Entwicklern. Designer und Blogger Emily Chang schrieb 2006 über das Aufkommen des Minimalismus:

Vielleicht ist es der Erfolg der Suchseite von Google oder unsere kollektive Abneigung gegen blinkende Bannerwerbung und aufdringliche Pop-ups des letzten Jahrzehnts - oder der Jonathan Ives Effekt. Es scheint auf jeden Fall, dass Internetnutzer, Designer und Entwickler dem „weniger ist mehr“ Prinzip von Mies van der Rohe als De-facto Standard zustimmen würden.

Changs Aussage, dass alle Internetnutzer und Fachleute den Minimalismus akzeptieren, war im Jahr 2006 definitiv nicht richtig und könnte auch heute noch eine Übertreibung sein. Es kann allerdings angenommen werden, dass sie damit die aufkommende Beliebtheit des Minimalismus bei Menschen, die stark in die innovativsten Trends des Internets involviert sind, meinte.

2010-2013

Das Aufkommen des Responsive Webdesigns (RWD) im Jahr 2010 motivierte das breitere Internet, sich für einen minimalistischen Zugang zu entscheiden. Um RWD-Techniken effektiv anzuwenden, müssen Unternehmen ihre Inhalte sorgfältig mit Prioritäten versehen - Ablenkungen vom Hauptinhalt, die am Desktop ignoriert werden können, werden auf mobilen Geräten zu großen Problemen.

Langsam begannen sich die Präferenzen von Nutzern und Designern in Richtung einfacherer Nutzeroberflächen zu verändern. Diese Veränderung wurde von umfassenden Redesigns zweier Giganten der Technikbranche unterstrichen: dem modernen Design von Microsoft im Jahr 2011 und der Veröffentlichung des iOS7 von Apple im Jahr 2013.

Die Veröffentlichung von Windows 8 durch Microsoft im Jahr 2011 war das erste große Redesign seines Betriebssystems in den vergangenen Jahrzehnten. Gleichzeitig wurde die Design-Philosophie „modernes Design“ genannt. Diese neue Design-Philosophie war vollkommen minimalistisch und basierte unmittelbar auf der minimalistischen Kunstbewegung. In der offiziellen Design-Dokumentation von Microsoft wird sogar angegeben, dass die Bauhaus-Schule eine der grundlegenden Designsäulen ist.

Die „Kachel“-Ansicht von Windows 8

Obwohl Apple hart daran arbeitete, seine Marke durch Einfachheit zu definieren, bevorzugten Apple Designer auf ihren Nutzeroberflächen früher Derivate, was immer für Kontroversen sorgte. Im Jahr 2013 überarbeitete Apple iOS radikal und entschied sich für einen flacheren und minimalistischeren Stil für iOS7. Die Entscheidung von Apple, sich in Richtung eines minimalistischeren oder flat Designs zu bewegen, unterstreicht die Beliebtheit des Trends, wenn man bedenkt, dass er praktisch im Gegensatz zum historischen Designstil der Marke steht.

iOS7

Das iOS7 von Apple

2014-2015

Minimalistische Designprinzipen tauchen jetzt an neuen, unerwarteten Orten auf: e-Commerce Webseiten, Online-Publikationen und sogar Bildungswebseiten wenden minimalistische Trends und Strategien an.

Viele One-Stop Webdesign und Hosting-Services, wie Squarespace, Weebly, Wix, und Volusion, bieten jetzt Website-Vorlagen an, die fast ausschließlich minimalistische Designs enthalten. Dieses Angebot ist besonders wichtig, da es häufig auf Menschen ohne Entwicklungs- oder Designerfahrung abzielt - Menschen, die eine Webseite für ihr Fahrradgeschäft oder ihre Bäckerei erstellen möchten, oder eine online Hochzeitseinladung benötigen, für die weder Illustrator noch HTML-Kenntnisse notwendig sind. Diese Anbieter verkaufen minimalistische Websites, da sie glauben, dass sie den Kundenwünschen entsprechen.

Squarespace's Galapagos theme

Das „Galapagos“ Theme von Squarespace

Heutzutage dehnt sich der Minimalismus auf andere wichtige Webdesigntrends, wie Flat Designs, Responsive Webdesign und Clean Designs, aus und überscheidet sich mit diesen. Der Beitrag des Minimalismus zu diesen Trends wird im Artikel der nächsten Woche detailliert behandelt.

Die Usability-Debatte: Ist Minimalismus gut für Nutzer?

Minimalismus ist eine Designstrategie, die Entscheidungen betreffend den Inhalt und die Informationsarchitektur stark beeinflusst. Das hat zur Folge, dass Minimalismus Auswirkungen auf die Usability der Nutzeroberfläche hat. Es ist wenig überraschend, dass die Usability von minimalistischen Designs zu hitzigen Debatten unter Web-Fachleuten führt.

Befürworter argumentieren, dass Minimalismus die Informationsüberlastung reduziert: je mehr Funktionen und Inhalte entfernt werden können, desto weniger müssen Benutzer verarbeiten. Gut umgesetzter Minimalismus hat auch ein positives emotionales Erlebnis für den Benutzer zur Folge. Menschen reagieren besser auf ästhetisch ansprechende Nutzeroberflächen. Wie Don Norman betont, sind sie bei der Nutzung derartiger Nutzeroberflächen toleranter gegenüber Usability-Hindernissen, solange diese Mängel gering sind.

Seit die Nielsen Norman Group im Jahr 1998 gegründet wurde, waren wir vehemente Kritiker des maximalistischen (d.h. aufgeblasenen) Webdesigns. Sie könnten sich jetzt denken, dass wir enthusiastische Befürworter des minimalistischen Webdesigns sind - das ist allerdings nicht der Fall.

Wenn Designer die minimalistische Ideologie zu strikt verfolgen, könnten eine zu geringe, verschwenderische Informationsdichte und eine schlechte Auffindbarkeit die Folge sein. Extremer Minimalismus kann als interne Designübung sinnvoll sein, sollte allerdings nie zum Endprodukt werden. Minimalismus in Massen kann effiziente Nutzererlebnisse zur Folge haben, solange Sie das Hauptziel nicht aus den Augen verlieren: Nutzern zu helfen, Aufgaben zu erledigen.

Tipps für eine erfolgreiche minimalistische Nutzeroberfläche

Überlegen Sie bitte genau, ob eine minimalistische Designstrategie die richtige Wahl für Ihre Website, Ihre Marke und Ihre Inhalte ist. Falls Sie sicher sind, dass sich der Minimalismus für Ihren Bedarf eignet, sollten Sie die Wurzeln des Minimalismus berücksichtigen.

  • Berücksichtigen Sie das Motto von Ludwig Mies van der Rohe „Weniger ist mehr“ in Ihren Designs. Fügen Sie nicht einfach Elemente um ihrer selbst willen hinzu. Diese Regel gilt für Inhalte, visuelle Designs und Funktionen.
  • Denken Sie darüber nach, Elemente zu reduzieren, die keine bedeutsamen Informationen beitragen (bedenken Sie dabei das Inhalt-Element-Verhältnis).
  • Lernen Sie von Carrolls Minimalismus: entfernen Sie Funktionen und Elemente nicht einfach - denken Sie an die Bedürfnisse Ihrer Benutzer und versuchen Sie, Aufgaben so kurz und einfach wie möglich zu gestalten.
  • Seien Sie sich bewusst, dass ein minimalistisches visuelles Design alleine - ohne konkrete Berücksichtigung der Aufgaben des Benutzers - keine erfolgreiche Benutzeroberfläche zur Folge haben wird. Die Usability-Probleme von Windows 8 sind ein hervorragendes abschreckendes Beispiel.

© Deutsche Version. Institut für Software-Ergonomie und Usability AG. Alle Rechte vorbehalten.

Kommentare auf diesen Beitrag

    Keine Kommentare

Kommentar hinzufügen

Die mit * gekenzeichneten Felder sind zwingend auszufüllen