{"id":518,"date":"2012-12-21T11:48:51","date_gmt":"2012-12-21T10:48:51","guid":{"rendered":"https:\/\/www.melon-media.de\/blog\/?p=518"},"modified":"2017-09-26T07:38:17","modified_gmt":"2017-09-26T06:38:17","slug":"webdesign-trends-in-2013","status":"publish","type":"post","link":"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/","title":{"rendered":"Webdesign: Trends in 2013"},"content":{"rendered":"

Das Jahr neigt sich wieder rapide dem Ende zu, was auch Grund genug ist, sich \u00fcber die Zukunft Gedanken zu machen. Was die Trends in<\/strong> 2013 f\u00fcr das Web- und Screendesign sein werden, erscheint angesichts der aktuellen Entwicklung in diesem Bereich relativ deutlich. Einige Blog-Autoren haben sich darum einmal die M\u00fche gemacht und den Blick in die Glaskugel gewagt. Zugegebenerma\u00dfen sind einige Trends zu entdecken, die bereits heute auf manchen Websites zu entdecken sind. Die aus meiner Sicht wichtigsten Trends habe ich auf 5 Kernthemen einmal im Folgenden reduziert.<\/p>\n

1. Vektorgrafiken im Webdesign<\/h2>\n

Illustrationen als Maskottchen findet man in Webdesigns immer h\u00e4ufiger, um die eigene Marke zu st\u00e4rken und greifbarer f\u00fcr den Besucher zu machen. Nicht zuletzt sind Illustrationen eine M\u00f6glichkeit – neben Typographie, gezeichneten Elementen und farbenpr\u00e4chtigen Designs – dem Design einer Website die<\/strong> ganz pers\u00f6nliche Note zu verleihen. Aus Sicht von\u00a0Jake Rocheleau von Web Design Ledger hat sich das Talent vieler Webdesigner in dieser Richtung deutlich<\/a> verbessert. Prominente Beispiele w\u00e4ren hier Mailchimp oder freelanceswitch.com. Es ist also zu erwarten, dass sich in den n\u00e4chsten Monaten der Trend zu individuellen Webdesigns mit Illustrationen verst\u00e4rken wird.<\/p>\n

\"Mailchimp<\/a><\/p>\n

2. Schriftarten<\/h2>\n

Die Typographie wird gerne dazu verwendet, mehr „Spannung“ in das Design einflie\u00dfen zu lassen. Um f\u00fcr \u00dcberschriften und Zwischen\u00fcberschriften individuelle Schriftarten zu verwenden, die dem Corporate Design (CD) entsprechen, mussten Techniken\u00a0wie Grafiken oder Flash-Elemente verwendet werden, die f\u00fcr Suchmaschinen schlecht zu verarbeiten sind. Genau in diesem Punkt gab es in den letzten Monaten spannende Entwicklungen zu beobachten, wie\u00a0bei dem „Typekit<\/a>“ Projekt. Um Typekit zu verwenden, wird die Typekit Javascript-Bibliothek eingebunden und diese \u00fcber CSS angesprochen. Damit k\u00f6nnen \u00fcberaus anspruchsvolle Schriften in dem Design integriert werden.<\/p>\n

3. Responsives Webdesign<\/h2>\n

Der absolute Trend sind momentan\u00a0reaktionsf\u00e4hige Designs. Fr\u00fcher war es \u00fcblich, zun\u00e4chst einmal die \u00fcbliche Bildschirmaufl\u00f6sung der Zielgruppe der Website herauszufinden. So wurden beispielsweise Webdesignlayouts speziell f\u00fcr eine Aufl\u00f6sung von\u00a01.024 x 768 Pixeln erstellt. Mit der Einf\u00fchrung neuer mobiler Endger\u00e4te, wie dem \u00a0iPhone 5, iPad 3\u00a0und Android, hat sich die Situation f\u00fcr Screendesigner grundlegend ver\u00e4ndert. Wo zuvor ein Gro\u00dfteil der Websitebesucher eine einzige Bildschirmaufl\u00f6sung bevorzugte, sind nun eine Vielzahl von Bildschirmaufl\u00f6sungen\u00a0m\u00f6glich. Die L\u00f6sung ist da das „responsive Webdesign“, bei dem versucht wird, ein gleichwertiges „Nutzerlebnis“ (User Experience) bei unterschiedlicher Bildschirmaufl\u00f6sung (und damit unterschiedlichen Endger\u00e4ten) sicherzustellen.<\/p>\n

\"Responsive<\/a><\/p>\n

 <\/p>\n

4. Animationen mit HTML5 und CSS3<\/h2>\n

F\u00fcr das Webdesign und die darin verwendeten Animationen ist die Tendenz ganz deutlich in Richtung Animationen mit HTML5 und CSS3 festzustellen und weg von Adobe’s Flash. Mit der Ank\u00fcndigung von Adobe, die Weiterentwicklung des Flash Players f\u00fcr Mobile Endger\u00e4te nicht mehr fortzuf\u00fchren<\/a>, ist dieser Trend noch einmal verst\u00e4rkt worden. So gibt es mittlerweile einige spannende Beispiele f\u00fcr die Verwendung von HTML5, wie Google Developers Web<\/a>\u00a0(ehemals html5rocks) oder der Artikel von Nick La zu CSS3 Animationen<\/a>.<\/p>\n

5. Klares Design<\/h2>\n

Zugegeben: Ein unaufger\u00e4umtes Webdesign hat noch nie einen Blumentopf gewinnen k\u00f6nnen. Das wird sich auch im Jahre 2013 nicht \u00e4ndern. Allerdings wird es in zuk\u00fcnftigen Designs vor allem darauf ankommen, dass\u00a0mehr „Platz“ und freie Fl\u00e4che in den Designs integriert wird. Das sorgt f\u00fcr noch mehr \u00dcbersichtlichkeit und f\u00fchrt den User zum Wesentlichen. Auff\u00e4llig ist auch, dass wei\u00dfe Hintergr\u00fcnde „out“ sind und gro\u00dfe Schriftarten immer mutiger eingesetzt werden. Ein popul\u00e4res Bespiel daf\u00fcr ist der Relaunch von Youtube am 01. Dezember 2011 oder das „award-winning“ Design von Tommy<\/a>.<\/p>\n

\"Youtube<\/a><\/p>\n

Fazit<\/h2>\n

Der Trend geht deutlich zu aufger\u00e4umten und endger\u00e4teunabh\u00e4ngigen Webdesigns. Dabei liegt hier die Betonung auf endger\u00e4teunabh\u00e4ngig. Denn die Verbreitung von Smartphones geht rasend schnell voran. So besitzten, lt. einer ver\u00f6ffentlichten Untersuchung von Bitkom<\/a>\u00a0im Oktober 2012, fast 40 % der Bundesb\u00fcrger \u00fcber 14 Jahren ein Smartphone. Bereits heute werden ca. 10 % der Besucher einer Website durch mobile Endger\u00e4te<\/a> generiert. Das da benutzerfreundliche und gut bedienbare Websites f\u00fcr mobile Endger\u00e4te immer wichtiger werden, sollte einleuchten.<\/p>\n","protected":false},"excerpt":{"rendered":"

Zu den Webdesign Trends f\u00fcr das Jahr 2013 z\u00e4hlt u.a. das Responsive Webdesign und klassische Gestaltungselemente die ein klares und aufger\u00e4umtes Design sicherstellen.<\/p>\n","protected":false},"author":8,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":""},"categories":[1,56],"tags":[90,67],"yoast_head":"\nWebdesign: Trends in 2013 - melon|media Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Webdesign: Trends in 2013 - melon|media Blog\" \/>\n<meta property=\"og:description\" content=\"Zu den Webdesign Trends f\u00fcr das Jahr 2013 z\u00e4hlt u.a. das Responsive Webdesign und klassische Gestaltungselemente die ein klares und aufger\u00e4umtes Design sicherstellen.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/\" \/>\n<meta property=\"og:site_name\" content=\"melon|media Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/melonmedia\" \/>\n<meta property=\"article:published_time\" content=\"2012-12-21T10:48:51+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-09-26T06:38:17+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.melon-media.de\/blog\/wp-content\/uploads\/2012\/01\/mailchimp-300x155.png\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:creator\" content=\"@melonmedia\" \/>\n<meta name=\"twitter:site\" content=\"@melonmedia\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\">\n\t<meta name=\"twitter:data1\" content=\"3\u00a0Minuten\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/#organization\",\"name\":\"melon|media\",\"url\":\"https:\/\/www.melon-media.de\/blog\/\",\"sameAs\":[\"https:\/\/www.facebook.com\/melonmedia\",\"https:\/\/twitter.com\/melonmedia\"],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/#logo\",\"inLanguage\":\"de\",\"url\":\"https:\/\/www.melon-media.de\/blog\/wp-content\/uploads\/2016\/01\/2L0JROF6.png\",\"width\":250,\"height\":250,\"caption\":\"melon|media\"},\"image\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/#website\",\"url\":\"https:\/\/www.melon-media.de\/blog\/\",\"name\":\"melon|media Blog\",\"description\":\"TYPO3 und Online-Marketing aus Hamburg\",\"publisher\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/www.melon-media.de\/blog\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"de\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#primaryimage\",\"inLanguage\":\"de\",\"url\":\"https:\/\/www.melon-media.de\/blog\/wp-content\/uploads\/2012\/01\/mailchimp.png\",\"width\":\"1019\",\"height\":\"528\",\"caption\":\"Mailchimp Screenshot\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#webpage\",\"url\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/\",\"name\":\"Webdesign: Trends in 2013 - melon|media Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#primaryimage\"},\"datePublished\":\"2012-12-21T10:48:51+00:00\",\"dateModified\":\"2017-09-26T06:38:17+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"item\":{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/\",\"url\":\"https:\/\/www.melon-media.de\/blog\/\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"position\":2,\"item\":{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/\",\"url\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/\",\"name\":\"Webdesign: Trends in 2013\"}}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#webpage\"},\"author\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/#\/schema\/person\/abee9501380d2bc6bc77326084b2f983\"},\"headline\":\"Webdesign: Trends in 2013\",\"datePublished\":\"2012-12-21T10:48:51+00:00\",\"dateModified\":\"2017-09-26T06:38:17+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#webpage\"},\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#primaryimage\"},\"keywords\":\"Responsive Webdesign,Webdesign Trends 2013\",\"articleSection\":\"Responsive Webdesign\",\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.melon-media.de\/blog\/webdesign-trends-in-2013\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/#\/schema\/person\/abee9501380d2bc6bc77326084b2f983\",\"name\":\"melonmedia Team\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.melon-media.de\/blog\/#personlogo\",\"inLanguage\":\"de\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/330a87875b87208793e5210dd17cff4d?s=96&d=mm&r=g\",\"caption\":\"melonmedia Team\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/posts\/518"}],"collection":[{"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/comments?post=518"}],"version-history":[{"count":24,"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/posts\/518\/revisions"}],"predecessor-version":[{"id":1094,"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/posts\/518\/revisions\/1094"}],"wp:attachment":[{"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/media?parent=518"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/categories?post=518"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.melon-media.de\/blog\/wp-json\/wp\/v2\/tags?post=518"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}