﻿{"id":2520,"date":"2021-02-16T12:00:56","date_gmt":"2021-02-16T11:00:56","guid":{"rendered":"https:\/\/www.sortlist.de\/blog\/?p=2520"},"modified":"2021-11-26T16:31:11","modified_gmt":"2021-11-26T15:31:11","slug":"gestaltgesetze","status":"publish","type":"post","link":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/","title":{"rendered":"Webdesign auf Grundlage der Gestaltgesetze: Ordnung, Webfonts und Farbkombinationen"},"content":{"rendered":"<p>In diesem Artikel geben wir zun\u00e4chst einen kurzen \u00dcberblick \u00fcber die <strong>Entwicklung der Gestaltgesetze<\/strong> durch die <strong>Gestaltpsychologie<\/strong>. Anschlie\u00dfend stellen wir einige Gestaltgesetze und ihre Anwendung im Hinblick auf <a href=\"https:\/\/www.sortlist.de\/blog\/category\/design\/\" target=\"_blank\" rel=\"noopener noreferrer\">Design<\/a> und Marketing vor.<\/p>\n<h2>Geschmack ist nicht alles, es gibt Regeln<\/h2>\n<p>Die <a href=\"https:\/\/www.sortlist.de\/blog\/erstellung-einer-website-kosten\/\" target=\"_blank\" rel=\"noopener\">Gestaltung einer Webseite<\/a> sollte nicht rein nach dem Belieben und dem Geschmack des Webdesigners Ihrer Wahl erfolgen. Eine qualitativ hochwertig arbeitende <a href=\"https:\/\/www.sortlist.de\/webdesign\" target=\"_blank\" rel=\"noopener noreferrer\">Agentur f\u00fcr Webdesign<\/a> wird neben der technischen Umsetzbarkeit immer auch die P<strong>rinzipien der Gestaltgesetze<\/strong> beachten.<\/p>\n<p>Diese Gesetze haben Einfluss darauf, wie eine Seite grunds\u00e4tzlich aufgebaut ist. \u00dcbrigens gelten die Gesetze auch, wenn Sie noch nie von ihnen geh\u00f6rt haben, denn hier geht es um eine <strong>grunds\u00e4tzliche Wahrnehmung<\/strong> von Ordnung und Sch\u00f6nheit.<\/p>\n<h2>Anwendung von Gestaltgesetzen im Webdesign<\/h2>\n<p>Wer sich im Internet behaupten m\u00f6chte, kommt also um die <strong>Anwendung der Gestaltgesetze<\/strong> nicht herum. Aus den Gestaltungsregeln ergibt sich unter anderem, welche Webfonts sinnvoll sind und welche Farbkombinationen Webdesign ansehnlich machen oder eben nicht.<\/p>\n<p>Die Regeln gelten f\u00fcr die gesamte Ordnung auf einer Webseite, die Men\u00fcf\u00fchrung, die Webfonts und Umrandungen. Hinzu kommt, dass manche <a href=\"https:\/\/www.sortlist.de\/blog\/farbkombinationen-im-webdesign\/\">Farbkombinationen<\/a> Webdesign besser gelingen lassen als andere.<\/p>\n<p>Die Gestaltgesetze betreffen alle Faktoren, die die <strong>menschliche<\/strong> <strong>Wahrnehmung<\/strong> beeinflussen. Diese Erkenntnis beruht auf psychologischer Forschung und der daraus resultierenden Entwicklung der Gestaltgesetze.<\/p>\n<h2>Die Berliner Schule der Gestaltpsychologie und die Theorie des guten Designs<\/h2>\n<h3>Ordnung ist das halbe Leben<\/h3>\n<p>Aus der Berliner Schule f\u00fcr experimentelle Psychologie ging Anfang des 20. Jahrhunderts die Gestaltpsychologie (oder auch Gestalttheorie) hervor. Es handelt sich um eine <strong>Richtung in der Wahrnehmungspsychologie<\/strong>, die sich mit Ordnung im psychischen Geschehen befasst.<\/p>\n<p>Der Mensch ist auf Ordnung angewiesen, wenn er mit seiner Umwelt agiert. Unser Gehirn interpretiert alles, was wir wahrnehmen und greift dazu auf bereits gemachte Erfahrungen zur\u00fcck.<\/p>\n<h3>Das Ganze ist mehr als die Summe seiner Teile<\/h3>\n<p>Die menschliche Wahrnehmung sowie unser Denken, F\u00fchlen und Verhalten werden durch Gestaltung stark beinflusst. Ein wichtiger <strong>Leitsatz<\/strong> <strong>der<\/strong> <strong>Gestalttheorie<\/strong> lautet: Das Ganze ist etwas anderes, als die Summe seiner Teile. Das gilt in jeglichen Zusammenh\u00e4ngen und nicht nur im Zusammenhang von Content Design.<\/p>\n<p>Etliche <strong>Gestaltpsychologen<\/strong> haben Gestaltgesetze formuliert, wobei manche sich auf sieben beschr\u00e4nken und andere \u00fcber hundert Regeln festgestellt haben. Manche der Gesetze tauchen unter unterschiedlichen Namen auf, besagen aber inhaltlich teilweise das Gleiche. Was die Gestaltgesetze besagen, verdeutlichen wir anhand der folgenden Beispiele.<\/p>\n<h2>Gesetz der Geschlossenheit<\/h2>\n<h3>Das Gehirn vervollst\u00e4ndigt Unvollst\u00e4ndiges<\/h3>\n<p>Dieses Gesetz besagt, dass wir <strong>Formen und Muster<\/strong> in einem gr\u00f6\u00dferen Kontext betrachten. Unser Gehirn ist in der Lage, aufgrund bereits gemachter Erfahrungen m\u00f6glicherweise fehlende Elemente zu erg\u00e4nzen. Das liegt daran, dass wir <strong>Geschlossenheit<\/strong> <strong>bevorzugen<\/strong>, sie erscheint uns sinnvoller als offene Strukturen.<\/p>\n<p>Schauen Sie sich zum besseren Verst\u00e4ndnis das folgende Bild an. In diesem Foto sehen Sie nur 50% des Mannes, der Rest ist durch die dunklen Streifen verdeckt. Dennoch haben Sie kein Problem, bei ihrer Betrachtung den ganzen Mann wahrzunehmen, Ihr Gehirn erg\u00e4nzt problemlos die fehlenden Teile. Hier kommt <strong>das Gesetz der Geschlossenheit zum Tragen<\/strong>.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"\" src=\"https:\/\/lh5.googleusercontent.com\/42khpV3ROM8snaIPQd-kY7ScQGpVzZUnchler0MPCSIhIcTYFi9hCWLN6xNWKeeCa3IlzdVvdzNrNYx4uUYS4ZxpRhsSVlCuouoHxE0oEDcj1IoTUDtY0WT3pLBlB-HpiE8ntO9n\" alt=\"\" width=\"367\" height=\"550\"><\/p>\n<h3>Das Gesetz der Geschlossenheit wirkt bei Vollst\u00e4ndigkeit und Unvollst\u00e4ndigkeit<\/h3>\n<p>Im Content Design machen wir uns diesen Effekt zu Nutze, etwa in dem wir bei Logos und anderen Strukturen durch Auslassungen Aufmerksamkeit erzeugen. Au\u00dferdem sind wir durch das <strong>Gesetz der Geschlossenheit<\/strong> in der Lage, Elemente in optisch reduzierter Weise darzustellen, was die \u00dcbersichtlichkeit einer Benutzeroberfl\u00e4che deutlich verbessert.<\/p>\n<p>Durch den Einsatz von Umrandungen machen wir die <strong>Zusammengeh\u00f6rigkeit von Inhalt<\/strong> deutlich. Das Gleiche ist auch ohne Umrandung m\u00f6glich, wenn Texte und andere Elemente entsprechend geschlossen pr\u00e4sentiert werden.<\/p>\n<h2>Gesetz des gemeinsamen Schicksals<\/h2>\n<h3>Mitgehangen, mitgefangen<\/h3>\n<p>Die menschliche Wahrnehmung interpretiert Ereignisse aufgrund von Erfahrungen. Letztere besagt, dass Objekte, die sich in die gleiche Richtung bewegen, zusammengeh\u00f6ren.<\/p>\n<p>F\u00fcr dieses Gesetz wird normalerweise ein Beispiel mit einer Reihe von Quadraten und Kreisen genommen. Wir gehen auf den ersten Blick davon aus, das jeweils gleichen geometrischen Formen zusammen geh\u00f6ren. Wenn sich nun in dieser Reihe je ein Kreis und ein Quadrat gemeinsam nach oben bewegen, dann sind pl\u00f6tzlich die beiden unterschiedlichen Formen Teile einer Gruppe.<\/p>\n<h3>Gleiche Funktion, gleiche Richtung<\/h3>\n<p>Im Webdesign kommt Bewegung in verschiedener Weise vor: Die Ver\u00e4nderung beim Mouseover, Buttons mit Schiebereglern, Kuchendiagramme mit hervorgehobenen St\u00fccken. Ja, und auch bei den blinkenden Gifs, die hoffentlich irgendwann aussterben.<\/p>\n<p>Stellen Sie sich nun ein differenziertes Formular zur Cookie-Einwilligung vor. Es ist nicht denkbar, dass wir bei der Zustimmung zu den einzelnen Marketing-Ma\u00dfnahmen den Regler mal nach links und mal nach rechts schieben um &#8222;ja&#8220; zu sagen. Von links nach rechts zu schieben bedeutet Zustimmung, fertig, das besagt <strong>das Gesetz des gemeinsamen Schicksals<\/strong>.<\/p>\n<h2>Gesetz der \u00c4hnlichkeit<\/h2>\n<h3>Was \u00e4hnlich ist, geh\u00f6rt zusammen<\/h3>\n<p>Ein wichtiges Prinzip unserer Wahrnehmung ist das der \u00c4hnlichkeit. Es bezieht sich sowohl auf die Elemente, die wir momentan vor Augen haben, als auch diejenigen, die in unserem Ged\u00e4chtnis gespeichert sind.<\/p>\n<p>Bei der Aufteilung von Elementen auf einer Webseite kommt es darauf an, zusammengeh\u00f6rende Inhalte in \u00e4hnlicher Weise zu pr\u00e4sentieren. In diesem Sinne beinflussen <strong>Form, Position, Gr\u00f6\u00dfe und Farbkombinationen<\/strong> Webdesign in vielfacher Weise. Das gleiche gilt umgekehrt f\u00fcr Elemente, die nicht zusammengeh\u00f6ren, sie m\u00fcssen unterschiedlich pr\u00e4sentiert werden.<\/p>\n<h3>Mehr ist nicht immer mehr<\/h3>\n<p>Sicher haben Sie schon einmal geh\u00f6rt, dass man die Webfonts auf einer Seite nicht auf zig verschiedene Arten formatieren sollte. Mal unterstrichen, mal fett, mal kursiv &#8211; und das Ganze wom\u00f6glich noch nach Belieben: So eine Gestaltung <strong>widerspricht dem Gesetz der \u00c4hnlichkeit<\/strong> und somit unserem \u00e4sthetischen Emfpinden.<\/p>\n<p>Sollen unterschiedliche Webfonts auf einer Seite eingesetzt werden, so stellt das einen Bruch dar. M\u00f6glich ist so eine Abweichung von der Regel, wenn der Webdesigner einen klaren Plan vor Augen hat und wei\u00df, was er tut.<\/p>\n<h2>Gesetz der Erfahrung<\/h2>\n<h3>Das sagt schon der gesunde Menschenverstand<\/h3>\n<p>Wir haben bestimmte Erfahrungen, aufgrund derer wir Dinge einordnen k\u00f6nnen. Wir haben gelernt, dass wir an einem Stopp-Schild anhalten. Sehen wir ein Auto das Schild missachten, stellen sich unsere Nackenhaare hoch und wir bef\u00fcrchten eine Kollision.<\/p>\n<p>Der vielbesagt &#8222;gesunde Menschenverstand&#8220; ist genau das, was einen Erwachsenen von einem Baby unterscheidet, n\u00e4mlich die gemachten Erfahrungen.<\/p>\n<h3>Im Webdesign machen wir uns das Gesetz der Erfahrung zu Nutze<\/h3>\n<p>Nehmen wir den typsichen Button mit einem Haus darauf, der uns zur\u00fcck auf eine Startseite f\u00fchrt, oder den mit dem Briefumschlag, der zum E-Mail-Formular f\u00fchrt. Es kommt nicht darauf an, dass diese immer genau gleich aussehen, aber aufgrund unserer Erfahrung wissen wir sie sofort einzuordnen.<\/p>\n<p>Dieses Gesetz kommt auch bei der<strong> Auswahl von Webfonts<\/strong> zum Tragen. Wer nicht m\u00f6chte, dass seine Website aussieht wie ein mit der Schreibmaschine geschriebenes Schriftst\u00fcck aus dem vorigen Jahrhundert wird Schriften mit Serifen nur sparsam einsetzen und seine Benutzeroberfl\u00e4che nicht mit Times New Roman gestalten.<\/p>\n<h2>Gesetz der N\u00e4he<\/h2>\n<h3>Was sich nahe ist, geh\u00f6rt zusammen<\/h3>\n<p>Elemente, die nah beieinander liegen, werden als zusammengeh\u00f6rig wahrgenommen. Das gilt nicht nur im Design, sondern beispielweise auch auf der Stra\u00dfe, wenn Menschen als zusammengeh\u00f6rig wahrgenommen werden, weil sie Hand in Hand gehen und wir sie als Paar einordnen.<\/p>\n<p>Das Gesetz der N\u00e4he k\u00f6nnen schon Kleinkinder sicher interpretieren, schon im Kindergarten haben wir das Bed\u00fcrfnis, zur Gruppe zu geh\u00f6ren.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone  wp-image-2526\" src=\"https:\/\/blog.sortlist.de\/wp-content\/uploads\/2021\/02\/pexels-aleksandar-pasaric-1415734-scaled.jpg\" alt=\"Gesetz der N\u00e4he: eins der Gestaltgesetze, die Sie im Webdesign ber\u00fccksichtigen sollten\" width=\"537\" height=\"358\" srcset=\"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-scaled.jpg 2560w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-768x512.jpg 768w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-1536x1024.jpg 1536w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-2048x1365.jpg 2048w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-50x33.jpg 50w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-288x192.jpg 288w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-576x384.jpg 576w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-339x226.jpg 339w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-678x452.jpg 678w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-373x249.jpg 373w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-746x497.jpg 746w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-691x461.jpg 691w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-1382x921.jpg 1382w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-973x649.jpg 973w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-1946x1297.jpg 1946w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-1048x699.jpg 1048w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-478x319.jpg 478w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-956x637.jpg 956w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-516x344.jpg 516w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-1032x688.jpg 1032w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-680x453.jpg 680w, https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/pexels-aleksandar-pasaric-1415734-1360x907.jpg 1360w\" sizes=\"auto, (max-width: 537px) 100vw, 537px\" \/><\/p>\n<p>Nehmen wir einmal die Zitrusfr\u00fcchte auf dem obigen Bild. Es verursacht uns ein seltsames Unbehagen, das wir keine richtige Ordnung herstellen k\u00f6nnen, obwohl die Fr\u00fcchte ja offenkundig bewusst angeordnet wurden.<\/p>\n<p>Wenn wir hin und wieder auf eine Website aus den 90er Jahren treffen, mit tausend verschiedenen Webfonts, blinkenden Gifs und allen Farbkombinationen, die das Webdesign hergibt, dann haben wir ein vergleichbares Gef\u00fchl. Oft haben diese Seiten keine Abst\u00e4nde zwischen Elementen und <strong>missachten das Gesetz der N\u00e4he<\/strong> und so gut wie jedes andere Gesetz der Gestaltung.<\/p>\n<h3>Bitte sch\u00f6n nah, mit etwas Platz dazwischen<\/h3>\n<p>Wie viel sch\u00f6ner ist es doch, wenn alles harmonisch in einer Gruppe und nicht so \u00fcberladen angeordnet ist, wenn Elemente nach gleicher Art und mit Abst\u00e4nden dargestellt werden. Werden <strong>Gegenst\u00e4nde als Einheit<\/strong> wahrgenommen freut das unseren Ordnungssinn.<\/p>\n<p>Beim Design einer Website ist das <strong>Gesetz der N\u00e4he<\/strong> von gro\u00dfer Bedeutung. Links die zurselben Kategorie geh\u00f6ren, liegen in einer bestimmten N\u00e4he zueinander. In Texten auf Landingpages sind die Abst\u00e4nde \u00fcber und unter \u00dcberschriften meistens unterschiedlich gro\u00df.<\/p>\n<p>Ausnahmen best\u00e4tigen nat\u00fcrlich die Regel. Zum Brechen der Gestaltgesetze kommen wir weiter unten.<\/p>\n<h2>Gesetz der Kontinuit\u00e4t<\/h2>\n<h3>Eine Linie verstehen wir besser als ein Durcheinander<\/h3>\n<p>Diese Prinzip \u00fcberschneidet sich mit dem Gesetz der guten Fortsetzung.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"\" src=\"https:\/\/lh4.googleusercontent.com\/HgLAnI5PZJ01AxS5STZNdnBd-AuficC-OWVayherhuxa-48KM1GPakPdkRcd_GtkGU1ZJVjrkKtKyWIyI-KSke3sTxqz9yr3ajTdyBAx53HRSsXH7FHgstyTGbrJZAQK5z3666Ap\" width=\"324\" height=\"486\"><\/p>\n<p>Schauen Sie sich diese Lichtpunkte an. Zun\u00e4chst einmal wissen wir aufgrund des <strong>Gesetzes der Erfahrung<\/strong>, dass auch die unteren, verschwommenen Elemente Kreise sind.<\/p>\n<p>Wir nehmen die Lichtpunkte als Linien wahr, obwohl sie unterschiedliche Abst\u00e4nde haben, das liegt am <strong>Gesetz der guten Fortsetzung<\/strong>.<\/p>\n<h3>Machen Sie es dem Nutzer einer Webseite leicht<\/h3>\n<p>Gedachte Lininen oder Farbkombinationen bewirken beim Webdesign eine inhaltliche Nutzerf\u00fchrung. Zur Anwendung kommt dieses Prinzip auch bei der gleichm\u00e4\u00dfigen Einr\u00fcckung von Texten und Men\u00fcpunkten. Letzlich folgen schon die grunds\u00e4tzlichen \u00dcberlegungen zur Gestaltung einer Webseite dem <strong>Gesetz der Kontinuit\u00e4t<\/strong>.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"\" src=\"https:\/\/lh4.googleusercontent.com\/dzIrekVZ5Y9QMWCyWMLxjPGZ3AdbaN-o-mSH2gVWNXBCCblhEz2NQcqwHRiSuq8cL-VMLo-ry5a1dZvnKe8-hNMSZsPhI68tgFbOkJD_ZkqISgb7tiIWEILy92nNh49k1CUVhbLq\" alt=\"\" width=\"581\" height=\"387\"><\/p>\n<h2>Gesetz der guten Gestalt<\/h2>\n<h3>Wenn alles stimmt, dann ist es sch\u00f6n<\/h3>\n<p>Bekannt ist es auch unter dem Namen &#8222;<strong>Gesetz der Pr\u00e4gnanz<\/strong>&#8220; oder &#8222;<strong>Gesetz der Einfachheit<\/strong>&#8222;. Diese Richtline besagt, dass eine Gestalt um so besser bzw. pr\u00e4gnanter ist, je mehr Forderungen der Gestaltgesetze ber\u00fccksichtigt sind. Ein gut gestaltetes Element ist einfach gestaltet, damit das Gehirn es mit Leichtigkeit verarbeiten kann.<\/p>\n<h3>Keep it simple, stupid!<\/h3>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"YVj9w alignright\" src=\"https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1000&amp;q=80\" sizes=\"auto, (max-width: 767px) 100vw, (max-width: 467px) min(100%, 435px), (max-height: 755px) min(100%, 435px), (min-aspect-ratio: 3000\/4000) calc((calc(100vh - 175px)) * 0.75), calc(100vw - 32px)\" srcset=\"https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=435&amp;q=80 435w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=735&amp;q=80 735w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=870&amp;q=80 870w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1035&amp;q=80 1035w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1335&amp;q=80 1335w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1470&amp;q=80 1470w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1635&amp;q=80 1635w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=1935&amp;q=80 1935w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=2070&amp;q=80 2070w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=2235&amp;q=80 2235w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=2535&amp;q=80 2535w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=2670&amp;q=80 2670w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=2835&amp;q=80 2835w, https:\/\/images.unsplash.com\/photo-1605106901227-991bd663255c?ixlib=rb-1.2.1&amp;ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;auto=format&amp;fit=crop&amp;w=3000&amp;q=80 3000w\" alt=\"purple and pink letter blocks\" width=\"211\" height=\"282\"><\/p>\n<p>Im Grunde reduziert sich in der Gestaltung alles auf <strong>geometrische Formen<\/strong>, die wir schon aus der Zeit kennen, als wir noch mit Baukl\u00f6tzen gespielt haben: Kreise, Dreiecke und Rechtecke.<\/p>\n<p>Das <strong>Gesetz der guten Gestalt<\/strong> korrespondiert inhaltlich mit dem <strong>KISS-Prinzip<\/strong>: Keep it simple, stupid.<\/p>\n<h2>Gestaltgesetze brechen<\/h2>\n<p>Keine Regel ohne Ausnahme, das gilt auch beim Design. Selbstverst\u00e4ndlich beinhaltet die Beherrschung der Regeln der Gestaltgung auch die F\u00e4higkeit, diese bewusst zu brechen.<\/p>\n<p>Ein solcher <strong>Bruch der Gestaltgesetze<\/strong> dient \u00fcblicherweise der besseren Wahrnehmung und Steigerung der Aufmerksamkeit oder auch dem <a href=\"https:\/\/www.sortlist.de\/branding\/essen-nrw-de\" target=\"_blank\" rel=\"noopener noreferrer\">Branding<\/a>.<\/p>\n<p>Allerdings funktioniert das nur, wenn der Nutzer nicht von Sinneseindr\u00fccken \u00fcberw\u00e4ltigt wird, Br\u00fcche m\u00fcssen also sparsam eingesetzt werden. In Bezug auf Webdesign bedeutet das, dass Sie es am besten einem Profi \u00fcberlassen.<\/p>\n<h2>Professionelles Webdesign unter Ber\u00fccksichtigung der Gestaltgesetze<\/h2>\n<h3>Es geht um das gro\u00dfe Ganze<\/h3>\n<p>Beim <strong>Content Design<\/strong>, also der visuellen Gestaltung digitaler Inhalte geht es nicht nur um Sch\u00f6nheit. Letzlich geht es immer um das gro\u00dfe Ganze. Bei der Gestaltung von Webseiten haben wir die Funktionalit\u00e4t und die Effektivit\u00e4t gleichzeitig im Blick.<\/p>\n<p>Wir wollen durch sinnvolle Anordnungen, richtige Auswahl der Webfonts und harmonische Farbkombinationen Webdesign nicht einfach nur sch\u00f6ner machen, sondern ein bestimmtes Verhalten beim Nutzer erreichen.<\/p>\n<h3>Am Ende des Tages soll der Kunde ein Produkt kaufen<\/h3>\n<p>Im Marketing geht es letztlich um Konversionen: Der Kunde soll eine Beziehung zu einem Unternehmen bekommen und ein Produkt kaufen.<\/p>\n<p>F\u00fcr die <a href=\"https:\/\/www.sortlist.de\/webdesign\" target=\"_blank\" rel=\"noopener noreferrer\">Top Webdesign-Agenturen<\/a>, mit denen wir zusammen arbeiten, ist der <strong>Einsatz der Gestaltgesetze<\/strong> zum Besten der Kunden selbstverst\u00e4ndlich. Diesen Agenturen stellen Ihnen die Kunst der Gestaltung im vollen Umfang zur Verf\u00fcgung und optimieren somit Ihr Marketing.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In diesem Artikel geben wir zun\u00e4chst einen kurzen \u00dcberblick \u00fcber die Entwicklung der Gestaltgesetze durch die Gestaltpsychologie. Anschlie\u00dfend stellen wir einige Gestaltgesetze und ihre Anwendung im Hinblick auf Design und Marketing vor. Geschmack ist nicht alles, es gibt Regeln Die Gestaltung einer Webseite sollte nicht rein nach dem Belieben und dem Geschmack des Webdesigners Ihrer [&hellip;]<\/p>\n","protected":false},"author":10,"featured_media":5053,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[41,45],"class_list":["post-2520","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design","category-webdesign"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Gestaltgesetze im Webdesign: Ordnung, Webfonts und Farbkombinationen<\/title>\n<meta name=\"description\" content=\"Gestaltgesetze: Anwendung von Farbkombinationen, Webfonts, etc. Design und Marketing entsprechend der Gestaltgesetze.\" \/>\n<meta name=\"robots\" content=\"noindex, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Gestaltgesetze im Webdesign: Ordnung, Webfonts und Farbkombinationen\" \/>\n<meta property=\"og:description\" content=\"Gestaltgesetze: Anwendung von Farbkombinationen, Webfonts, etc. Design und Marketing entsprechend der Gestaltgesetze.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/\" \/>\n<meta property=\"og:site_name\" content=\"Sortlist Blog\" \/>\n<meta property=\"article:published_time\" content=\"2021-02-16T11:00:56+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-11-26T15:31:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/gestalt.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1288\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Doris Pundy\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"Doris Pundy\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/\",\"url\":\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/\",\"name\":\"Gestaltgesetze im Webdesign: Ordnung, Webfonts und Farbkombinationen\",\"isPartOf\":{\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/gestalt.jpg\",\"datePublished\":\"2021-02-16T11:00:56+00:00\",\"dateModified\":\"2021-11-26T15:31:11+00:00\",\"author\":{\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/#\/schema\/person\/f1f847710c412cae5601a1ac352ed298\"},\"description\":\"Gestaltgesetze: Anwendung von Farbkombinationen, Webfonts, etc. Design und Marketing entsprechend der Gestaltgesetze.\",\"breadcrumb\":{\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#breadcrumb\"},\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de-DE\",\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#primaryimage\",\"url\":\"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/gestalt.jpg\",\"contentUrl\":\"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/gestalt.jpg\",\"width\":1920,\"height\":1288},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www-de.sortlist-test.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Webdesign auf Grundlage der Gestaltgesetze: Ordnung, Webfonts und Farbkombinationen\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/#website\",\"url\":\"https:\/\/www-de.sortlist-test.com\/blog\/\",\"name\":\"Sortlist Blog\",\"description\":\"Sortlist Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www-de.sortlist-test.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de-DE\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/#\/schema\/person\/f1f847710c412cae5601a1ac352ed298\",\"name\":\"Doris Pundy\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de-DE\",\"@id\":\"https:\/\/www-de.sortlist-test.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/blog.production.sortlist.cloud\/wp-content\/uploads\/2021\/07\/avatar_user_10_1625132753-96x96.jpg\",\"contentUrl\":\"https:\/\/blog.production.sortlist.cloud\/wp-content\/uploads\/2021\/07\/avatar_user_10_1625132753-96x96.jpg\",\"caption\":\"Doris Pundy\"},\"url\":\"https:\/\/www-de.sortlist-test.com\/blog\/author\/dorispundy\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Gestaltgesetze im Webdesign: Ordnung, Webfonts und Farbkombinationen","description":"Gestaltgesetze: Anwendung von Farbkombinationen, Webfonts, etc. Design und Marketing entsprechend der Gestaltgesetze.","robots":{"index":"noindex","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"de_DE","og_type":"article","og_title":"Gestaltgesetze im Webdesign: Ordnung, Webfonts und Farbkombinationen","og_description":"Gestaltgesetze: Anwendung von Farbkombinationen, Webfonts, etc. Design und Marketing entsprechend der Gestaltgesetze.","og_url":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/","og_site_name":"Sortlist Blog","article_published_time":"2021-02-16T11:00:56+00:00","article_modified_time":"2021-11-26T15:31:11+00:00","og_image":[{"width":1920,"height":1288,"url":"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/gestalt.jpg","type":"image\/jpeg"}],"author":"Doris Pundy","twitter_card":"summary_large_image","twitter_misc":{"Verfasst von":"Doris Pundy","Gesch\u00e4tzte Lesezeit":"9 Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/","url":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/","name":"Gestaltgesetze im Webdesign: Ordnung, Webfonts und Farbkombinationen","isPartOf":{"@id":"https:\/\/www-de.sortlist-test.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#primaryimage"},"image":{"@id":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#primaryimage"},"thumbnailUrl":"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/gestalt.jpg","datePublished":"2021-02-16T11:00:56+00:00","dateModified":"2021-11-26T15:31:11+00:00","author":{"@id":"https:\/\/www-de.sortlist-test.com\/blog\/#\/schema\/person\/f1f847710c412cae5601a1ac352ed298"},"description":"Gestaltgesetze: Anwendung von Farbkombinationen, Webfonts, etc. Design und Marketing entsprechend der Gestaltgesetze.","breadcrumb":{"@id":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#breadcrumb"},"inLanguage":"de-DE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/"]}]},{"@type":"ImageObject","inLanguage":"de-DE","@id":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#primaryimage","url":"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/gestalt.jpg","contentUrl":"https:\/\/www-de.sortlist-test.com\/blog\/wp-content\/uploads\/sites\/4\/2021\/02\/gestalt.jpg","width":1920,"height":1288},{"@type":"BreadcrumbList","@id":"https:\/\/www-de.sortlist-test.com\/blog\/gestaltgesetze\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www-de.sortlist-test.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Webdesign auf Grundlage der Gestaltgesetze: Ordnung, Webfonts und Farbkombinationen"}]},{"@type":"WebSite","@id":"https:\/\/www-de.sortlist-test.com\/blog\/#website","url":"https:\/\/www-de.sortlist-test.com\/blog\/","name":"Sortlist Blog","description":"Sortlist Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www-de.sortlist-test.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de-DE"},{"@type":"Person","@id":"https:\/\/www-de.sortlist-test.com\/blog\/#\/schema\/person\/f1f847710c412cae5601a1ac352ed298","name":"Doris Pundy","image":{"@type":"ImageObject","inLanguage":"de-DE","@id":"https:\/\/www-de.sortlist-test.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/blog.production.sortlist.cloud\/wp-content\/uploads\/2021\/07\/avatar_user_10_1625132753-96x96.jpg","contentUrl":"https:\/\/blog.production.sortlist.cloud\/wp-content\/uploads\/2021\/07\/avatar_user_10_1625132753-96x96.jpg","caption":"Doris Pundy"},"url":"https:\/\/www-de.sortlist-test.com\/blog\/author\/dorispundy\/"}]}},"_links":{"self":[{"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/posts\/2520","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/comments?post=2520"}],"version-history":[{"count":0,"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/posts\/2520\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/media\/5053"}],"wp:attachment":[{"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/media?parent=2520"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www-de.sortlist-test.com\/blog\/wp-json\/wp\/v2\/categories?post=2520"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}