Wie man Balance im Webdesign verwendet
Um ein ausgewogenes Webdesign zu erreichen, bedarf es einiger Überlegungen, Anstrengungen und Fähigkeiten, aber es ist es absolut wert. Das Schöne am Gleichgewicht, das auf die breitere Kategorie des Designs als Ganzes angewendet werden kann, ist, dass es das, was Sie erschaffen, davor bewahrt, ein übermäßiges, überladenes Durcheinander zu sein, das der Benutzererfahrung nicht dient. Mit anderen Worten, ein Gleichgewicht im Webdesign stellt sicher, dass Sie als Designer nur diesen süßen Punkt der Moderation treffen. Nicht zu viel, aber nicht zu wenig. Nicht zu laut, aber nicht zu subtil. Es hält Ihr gesamtes Design in Harmonie und erfüllt gleichzeitig alle Usability-Ziele Ihrer Kunden. Das ist eine Fertigkeit, die Sie definitiv in die Toolbox Ihres Designers stecken können! In diesem Artikel werden wir uns ansehen, wie Sie ein gutes Gleichgewicht in die Websites Ihrer Kunden integrieren können.
Symmetrisches Gleichgewicht
Eines der häufigsten Beispiele für das Gleichgewicht, das Sie beim Surfen auf Websites finden, ist Symmetrie, obwohl Sie es vielleicht nicht erkennen, weil es so nahtlos präsentiert wird. Symmetrie ist von Natur aus angenehm für das Auge und schafft ein Design, das ästhetisch gut organisiert und harmonisch ist. Symmetrische Balance wird definiert, indem Elemente auf beiden Seiten einer horizontalen oder vertikalen Mittelachse gleichmäßig platziert werden. Mit anderen Worten, beide Seiten einer imaginären Tauchlinie über die Mitte der Seite sind im Wesentlichen Spiegelbilder voneinander. Während einige Kritiker diese Art von Balance als langweilig oder vorhersehbar abschreiben, hat es dennoch den Test der Zeit bestanden und bleibt einer der besten Wege, um ein Gleichgewicht im Web-Design zu zeigen.
Cisco-Website hat sich für diesen bewährten, erprobten und echten Designansatz entschieden. Beachten Sie, dass die Website über ihre vertikale Achse perfekt ausgeglichen ist. Wenn Sie eine imaginäre Linie nehmen und sie mitten auf der Cisco-Homepage teilen, werden Sie Folgendes bemerken:
- Die gleiche Anzahl von Elementen in der Navigationsleiste (einschließlich Suchsymbol) auf beiden Seiten
- Überschrift und Untertitel sind auf beiden Seiten gleich lang
- Der Call to Action Button ist perfekt zentriert
- Die gleiche Anzahl von Elementen unter der Überschrift "Quick Tasks" auf beiden Seiten
Obwohl die Website möglicherweise nicht die furchtbar aufregendste Website aller Zeiten ist, muss es nicht sein, da das Unternehmen Netzwerkgeräte verkauft. Plus, die Seite ist benutzbar und funktional, beide Eigenschaften, die ihre Kunden schätzen können. Sehen wir uns zwei weitere Beispiele für Symmetrie an:
IWC Schaffhausen , der Schweizer Uhrmacher, hat eine Website, die horizontale, symmetrische Balance aufweist. Wenn wir die Seite über eine zentrale Achse in der Mitte teilen, haben beide Seiten Symmetrie.
Das Gleiche gilt für die Beanstalk App Website . Mit einem einfachen, minimalistischen Design verläuft die zentrale Achse in der Mitte der Homepage, sodass die beiden Seitenhälften horizontal symmetrisch ausgerichtet sind.
Asymmetrisches Gleichgewicht
Das polare Gegenteil von Symmetrie, asymmetrische Balance ist auch möglich. Lassen Sie sich nicht täuschen, dass Asymmetrie eine fehlende Äquivalenz zwischen Teilen bedeutet! Wie Sie bald sehen werden, erreicht die asymmetrische Balance auch im Design ein System von Gegengewichten ... einfach nicht so, wie Sie es erwarten würden. Asymmetrie kann auf einer Webseite auf verschiedene Arten dargestellt werden. Zum Beispiel könnte eine Hälfte des Bildschirms, vertikal oder horizontal, ein intensiveres Element aufweisen, während die andere Hälfte subtilere Elemente aufweisen könnte. Trotz dieser Ungleichheit, sowohl in der Stärke als auch in der Anzahl, entsteht Gleichgewicht durch die Gegenüberstellung der widersprüchlichen Elemente. Auf diese Weise kann Asymmetrie wirklich schön sein, vielleicht mehr als direkte Symmetrie, weil sie auf dem Konzept der Unähnlichkeit spielt, um Gleichgewicht zu schaffen. Das ist ein Design-Paradox, aber es funktioniert auf jeder Site so gut. Asymmetrisches Gleichgewicht ist daher interessanter und zum Nachdenken anregend als vorhersagbare Symmetrie. Es erinnert an Themen der Moderne, Energie und Wunder. Designer sollten jedoch beachten, dass das Erstellen einer Asymmetrie auf einer Seite mehr Arbeit erfordert als die normale Symmetrie. Schließlich müssen Sie Beziehungen zwischen komplexeren Designelementen darstellen.
Honda gibt uns ein glasklares Beispiel für Asymmetrie im Webdesign. Unter der Falte, auf seiner Homepage, verwendet das Unternehmen ein Karten-basiertes Design, aber dies erzeugt ein etwas unorganisiertes Aussehen, das, während es visuell ansprechend und bunt ist, eine Gleichheit auf beiden Seiten einer vertikalen oder horizontalen Mittelachse erzeugt. Zum einen sind die Karten selbst immer horizontal unterschiedlich und nicht immer in einer einheitlichen Spalte oder Zeile gestapelt. Dies erzeugt eine große Asymmetrie, die sehr interessant ist. Es ist fast wie ein kleines Labyrinth auf der Homepage der Autofirma! Es gibt auch andere interessante Beispiele:
Typografisme ist ein Bild-perfekte Fall von Asymmetrie im Webdesign. Der Standort weist zwei schiefe Elemente auf. Sowohl das TG-Logo als auch der grüne Stempel in der rechten oberen Ecke erzeugen Asymmetrie.
Duplos 'Asymmetrie ist stärker. Der Standort verfügt über ein Design mit schwimmenden Elementen, das nicht mit der anderen Hälfte übereinstimmt, unabhängig davon, ob die Mittelachse vertikal oder horizontal ist. Insgesamt ergibt sich ein auffälliges Erscheinungsbild, das interessant aufgenommen werden kann.
Radiales Gleichgewicht
Das radiale Gleichgewicht ist ziemlich einfach. Wie der Name andeutet, tritt das radiale Gleichgewicht auf, wenn alle Gestaltungselemente auf einer Seite in äquidistanten Punkten von einem vereinheitlichenden zentralen Punkt ausgehen. Wenn Sie also die Seite entweder vertikal oder horizontal entlang einer Mittelachse aufteilen würden, wären die Elemente beider Seiten gleich weit oder in der Nähe des Mittelpunkts. Einige der grundlegendsten Beispiele für das radiale Gleichgewicht sind Dinge wie Sonnenstrahlen, die von einem zentralen Punkt kommen, oder ein Teich, der ein paar Wellen auf seiner Oberfläche hat. Was diese Form des Gleichgewichts besonders macht, ist die Tatsache, dass der strahlende Effekt in beide Richtungen geht: So wie die Aufmerksamkeit vom zentralen Punkt wegführt, führt sie aufgrund des gemeinsamen Zentrums auch zu ihm zurück. Aus diesem Grund ist es einfach, einen Schwerpunkt zu behalten.
Das beste Beispiel für das radiale Gleichgewicht - was auf Websites, insbesondere Homepages, ziemlich selten ist, ist Vlog . Es ist der Inbegriff des radialen Gleichgewichts, da alles vom zentralen Punkt des weißen Typs "Vlog.it" nach außen strahlt.
Alle Arten von Gleichgewicht
Inzwischen sollte es ziemlich offensichtlich sein, dass alle Arten von Gleichgewicht einige gemeinsame Bindungen haben. Es gibt einheitliche Faktoren, die durchgängig in jedem Design auftreten, das eine attraktive und interessante Ausgewogenheit aufweist. Balance in Webdesign ist überall um dich herum. Die Chancen stehen gut, dass Sie es auf all den verschiedenen Websites, die Sie jemals in Ihrem Leben besucht haben, nicht zu schätzen wissen. aber das liegt nur daran, dass das Gleichgewicht nicht das erste ist, an das Sie denken, wenn Sie auf einer Website navigieren. Nichtsdestoweniger ist das Gleichgewicht wichtig für das Design der Website. Es bietet nicht nur ästhetische Details, die visuell interessant sind. Es kann auch dem Benutzer helfen, indem es die visuellen Informationen auf einer Website leichter auffängt, was auch bedeutet, die Websitennavigation zu verbessern. Designer können sich bemühen, ein besseres Gleichgewicht in ihrem Webdesign zu schaffen, indem sie besonders auf Harmonie, Gegengewichte und Äquidistanz achten. Das Endergebnis guter Balance zahlt sich für Ihre Kunden und die Benutzererfahrung aus.