{"id":953,"date":"2017-06-26T14:16:31","date_gmt":"2017-06-26T12:16:31","guid":{"rendered":"http:\/\/www.der-informationsdesigner.de\/agentur-blog\/?p=953"},"modified":"2022-04-17T12:36:22","modified_gmt":"2022-04-17T10:36:22","slug":"webdesign-trends-2017","status":"publish","type":"post","link":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/allgemein\/webdesign-trends-2017\/","title":{"rendered":"Webdesign Trends 2017 – Eine Infografik"},"content":{"rendered":"

In der vergangenen Jahren haben sich die Designkonzepte Flat Design<\/strong> und Minimalismus<\/strong> in der digitalen Landschaft stark etabliert. Um entsprechende Beispiele zu diesen Trends zu finden, muss man nicht sehr lange im Internet suchen. Fast jede moderne und responsiv gestaltete App und Webseite verwendet Aspekte von Flat Design und Minimalismus.
\n<\/p>\n

Design Trends 2017 im Webdesign<\/h2>\n

Die Gr\u00fcnde daf\u00fcr, warum diese Designelemente nun \u00fcberall benutzt wurden, sind klar: Sie sehen auf den unterschiedlichsten Bildschirmen und in jeder Aufl\u00f6sung immer sch\u00f6n aus<\/strong>. Au\u00dferdem sind sie leicht eingebaut und individuell zu gestalten. Des Weiteren sind sie so konzipiert, dass sie das komplette Potential des Monitors aussch\u00f6pfen, und dadurch einen neuen Ma\u00dfstab f\u00fcr das Zusammenspiel zwischen Nutzerfreundlichkeit und \u00c4sthetik<\/strong> schaffen.<\/p>\n

In diesem Jahr sind einige neue Spins auf diese in letzter Zeit dominierenden Trends erschienen. 2017 ist gepr\u00e4gt von hellen Farbpaletten<\/strong>, kr\u00e4ftigen Grundformen<\/strong> und verspielten Farbverl\u00e4ufen<\/strong>, die die dringend ben\u00f6tige Tiefe und Dynamik ins Flat Design bringen.<\/p>\n

Die folgende Infografik beschreibt vier digitale Design Trends der vergangenen Jahre, die nach wie vor fast \u00fcberall im Internet auftauchen, sowie vier neue Trends, die wir zurzeit immer \u00f6fter sehen:<\/em><\/p>\n

\"Die<\/a><\/figure>\n

Infografik von coastalcreative<\/a><\/p>\n

Weiter bestehende Designtrends 2017<\/h2>\n

Cardbased Design<\/h3>\n

In unserer modernen Gesellschaft verbringen wir viel Zeit im Internet und in digitalen R\u00e4umen, wo wir st\u00e4ndig mit Informationen \u00fcberflutet werden. Cards wurden deshalb so erfolgreich, weil sie uns durch eine Art Ordnung im Chaos der Informationen kognitiv entlasten<\/strong> und damit unsere Surferlebnisse verbessern. Cards sind geordnete, leicht organisierbare Stapel, mit welchen man abwechslungsreichen und umfangreichen Content archivieren und durchsuchen kann.<\/p>\n

Dieses Designelement wird h\u00e4ufig von Bloggern verwendet, um ihren eigenen Content leicht auffindbar zu pr\u00e4sentieren. Auch wird es von Firmen benutzt, um durchsuchbare Indexe mit dem Content anderer Websites zu erstellen. Pinterest und Twitter sind zwei namhafte Beispiele daf\u00fcr.<\/p>\n

\"Webdesign<\/figure>\n

Card Based Design<\/p>\n

Fette Schriftarten<\/h3>\n

Cards helfen Benutzern dabei, Informationen nach ihren eigenen Priorit\u00e4ten zu sortieren. Auf der anderen Seite hilft eine fette Schrift einem Designer dabei, die Aufmerksamkeit des Benutzers zu steuern<\/strong>. Gro\u00dfe fettgedruckte Schriftarten dienen als ein visueller Kontrast zu den minimalistischen Designs, die heute in Webschablonen popul\u00e4r geworden sind. Erfahrungsgem\u00e4\u00df haben Internetnutzer kurze Aufmerksamkeitsspannen. Eine fette Schrift l\u00e4sst sich nicht so einfach \u00fcberlesen.<\/p>\n

\"Webdesign<\/figure>\n

Fette Typografie<\/p>\n

Experimentelle Farbpaletten<\/h3>\n

Vor einem Jahrzehnt gab es im digitalen Design Texturen, Farben, und Muster, die der Natur \u00e4hnelten: Erde-, Edel- und Metallfarben; Hintergr\u00fcnde aus Holz-, Kork- und Steinbilder. Heute f\u00fchlen sich solche Designs veraltet an. (wie z.B. die in fr\u00fchen iPhones voreingestellten Wassertropfen- und Gr\u00fcnfl\u00e4chenhintergr\u00fcnde<\/a>).<\/p>\n

Nun erkennen Designer, dass digitale R\u00e4ume mit der Natur nicht verglichen werden k\u00f6nnen, sondern eher an den Bildschirm angepasst werden m\u00fcssen, um dessen St\u00e4rken herauszuarbeiten und die Benutzerfreundlichkeit zu perfektionieren. Ein heller, warmer Gelbfarbton kann sich auf dem Bildschirm sch\u00f6ner entfalten, als ein Foto einer Holzmaserung.<\/p>\n

\"Webdesign<\/figure>\n

Experiementelle Farbpaletten<\/p>\n

Thin Icons<\/h3>\n

Diese vereinfachten Bildchen dienen dazu, die Informations\u00fcberflutung zu verringern<\/strong> und auf diesem Wege das Surferlebnis f\u00fcr den Nutzer zu verbessern. Sie sind die perfekte Kombination zwischen Zukunftsdesign und Nostalgie<\/strong>. Die Nostalgie entsteht durch die veralteten Symbole, die meist f\u00fcr einen komplizierteren technischen Prozess stehen.<\/p>\n

Echte Malpinsel werden in Photoshop nicht benutzt. Nichts wird mehr auf einer Diskette gespeichert. Durch diese Art von Abstraktion l\u00e4sst sich beispielsweise ein Smartphone f\u00fcr den Otto Normalverbraucher extrem leicht bedienen.<\/p>\n

\"Webdesign<\/figure>\n

Thin Icons<\/p>\n

Neu erscheinende Trends 2017<\/h2>\n

Neonfarbverl\u00e4ufe<\/h3>\n

Farbverl\u00e4ufe bringen eine visuelle Einheit in digitale R\u00e4ume, die sonst wie eine durcheinander gew\u00fcrfelte Fotocollage aussehen w\u00fcrden. Dies ist ein wichtiger Punkt, der beachtet werden sollte, besonders wenn der Content von vielen unterschiedlichen Quellen generiert wird und geordnet dargestellt werden soll wie z.B. bei Spotify. Au\u00dferdem k\u00f6nnen Farbverl\u00e4ufe eine subtile Tiefe in zweidimensionale Bilder<\/strong> bringen.<\/p>\n

\"Webdesign<\/figure>\n

Neon Farbverl\u00e4ufe<\/p>\n

Retro-Pastellfarben<\/h3>\n

Im Vergleich zu den teilweise grenzwertigen und unkonventionellen Farbt\u00f6nen der Neon-Farbverl\u00e4ufe sind Pastellfarben eine beruhigendere Alternative<\/strong> und ein aktueller Trend im digitalen Design. Pantone k\u00fcrte beispielsweise zwei Pastellfarben als \u201eFarben des Jahres 2016\u201c und erweiterte das eigene Farbangebot um eine hohe Anzahl an Pastellt\u00f6nen.<\/p>\n

W\u00e4hrend Pastellfarben fr\u00fcher einmal einen Etepetete-Ruf hatten und eher als feminine Farben gesehen wurden, haben sie heutzutage l\u00e4ngst in urbanen geschlechts\u00fcbergreifenden Zusammenh\u00e4ngen ihren Platz gefunden.<\/p>\n

\"Webdesign<\/figure>\n

Retro Pastellfarben<\/p>\n

Plakative geometrische Formen<\/h3>\n

Plakative geometrische Formen sind ein weiteres Beispiel daf\u00fcr, wie 2017 eine neue Tiefe ins Flat Design gebracht wurde. Plakative Anordnungen von einfachen geometrischen Formen lassen sich in digitalen Designs, sowie in der Mode finden. Gewinkelte und \u00fcbereinander angelegte Polygone k\u00f6nnen durch Linien und verschiedene Perspektivwechsel dreidimensional wirken.<\/p>\n

\u00c4hnlich wie die in vergangenen Jahren popul\u00e4r gewordenen responsiven Webschablonen, sehen diese plakativen Formen auf unterschiedlichsten Bildschirmen immer gut aus<\/strong>.<\/p>\n

\"Webdesign<\/figure>\n

Plakative und starke geometrische Formen<\/p>\n

Hervorhebung von Originalit\u00e4t<\/h3>\n

Trotz der vielen Vorteile des Flat Designs haben wir mittlerweile einen Punkt erreicht, an dem fast jede Website und jede App genau gleich aussieht. Durch Drag-and-Drop Verfahren und Webschablonen ist die Gefahr sehr gro\u00df geworden, in der Masse unterzugehen<\/strong> und damit die Einzigartigkeit zu verlieren.<\/p>\n

Gl\u00fccklicherweise sehen wir 2017 endlich Abweichungen von dieser Norm. Originelle Illustrationen<\/strong>, die sich nicht genau reproduzieren lassen, werden in digitalen R\u00e4umen immer prominenter wie z.B. Handschrift, Schreibschrift, Handskizzen und originelle Fotografie.<\/p>\n

\"Webdesign<\/figure>\n

Mehr Originalit\u00e4t<\/p>\n

Sie planen einen neuen Internetauftritt oder ben\u00f6tigt Ihre Website ein Redesign?<\/strong> Wir informieren Sie gerne in einem unverbindlichen Erstgespr\u00e4ch \u00fcber die vielf\u00e4ltigen technischen und visuellen M\u00f6glichkeiten.<\/p>\n

Kontaktieren Sie uns<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

In der vergangenen Jahren haben sich die Designkonzepte Flat Design und Minimalismus in der digitalen Landschaft stark etabliert. Um entsprechende Beispiele zu diesen Trends zu finden, muss man nicht sehr lange im Internet suchen. Fast jede moderne und responsiv gestaltete App und Webseite verwendet Aspekte von Flat Design und Minimalismus.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1,3],"tags":[8],"class_list":["post-953","post","type-post","status-publish","format-standard","hentry","category-allgemein","category-webdesign","tag-trends"],"modified_by":"thomas.soyter","_links":{"self":[{"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/posts\/953","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/comments?post=953"}],"version-history":[{"count":24,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/posts\/953\/revisions"}],"predecessor-version":[{"id":1445,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/posts\/953\/revisions\/1445"}],"wp:attachment":[{"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/media?parent=953"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/categories?post=953"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.der-informationsdesigner.de\/agentur-blog\/wp-json\/wp\/v2\/tags?post=953"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}