{"id":1081,"date":"2013-12-04T21:11:51","date_gmt":"2013-12-04T20:11:51","guid":{"rendered":"http:\/\/www.christian-pansch.de\/blog\/?p=1081"},"modified":"2013-12-04T10:12:30","modified_gmt":"2013-12-04T09:12:30","slug":"quo-vadis-webdesign","status":"publish","type":"post","link":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/","title":{"rendered":"Quo vadis Webdesign?"},"content":{"rendered":"

Das Jahr 2013 neigt sich dem Ende – genau der richtige Zeitpunkt, um einen kleinen R\u00fcckblick auf die (aus meiner subjektiven Sicht) wichtigsten Webdesign-Trends 2013, die f\u00fcr eine erfolgreiche und ansprechende State-Of-The-Art-Website unverzichtbar sind, zu machen (und das ohne Anspruch auf Vollst\u00e4ndigkeit).<\/p>\n

Die Designwelt wird flach<\/strong>
\nSp\u00e4testens durch die Einf\u00fchrung des neuen Betriebssystems iOS 7 von Apple in 2013 sollte eins klar sein: Flat-Design ist das neue gro\u00dfe Ding und das halt auch nicht nur beschr\u00e4nkt auf das Web. Microsoft hat es mit Windows 8 und der sogenannten Metro-Oberfl\u00e4che vor gemacht – verspielte Schattenw\u00fcrfe, 3D-anmutenden Bedienoberfl\u00e4chen und aufmerksamkeitshaschende Hintergrundgestaltung geh\u00f6ren vorerst der Vergangenheit an (man wei\u00df ja nie, was mal wieder modern wird). Einfache Fl\u00e4chen, Farbleitsystem und zur\u00fcckgenommene Buttons \/ Icons dominieren die Layouts und setzen den eigentlichen „Star“, n\u00e4mlich den Content, in Szene.<\/p>\n

Flat Design Beispiel: symbolset.com<\/a>
\n\"Flat<\/p>\n


\nTechnik und Design im Einklang<\/strong>
\nOftmals m\u00fcssen komplexe Prozesse innerhalb einer Website abgebildet werden. Bei einer technisch anspruchsvollen Website mussten in Puncto Design oftmals Abstriche gemacht werden. Dank HTML5 sind die Zeiten von fehlenden Browser-Plugins & Co. aber vorbei. Desto st\u00e4rker HTML5 Einzug in die modernen Browser erh\u00e4lt, desto mehr technischen Finessen und Dinge, die wir so noch nicht gesehen haben, lassen sich relativ problemlos umsetzen. Somit muss ansprechendes Websites keine Funktionen mehr vermissen lassen und auch Suchmaschinen haben an solchen Layouts ihre wahre Freude<\/a>. Vorbei die Zeit des „Entweder oder“ – wir sind bei „Alles ist m\u00f6glich“ angekommen – eben nur gewusst wie \ud83d\ude09<\/p>\n

HTML5 Beispiel: GreenCampusGuide<\/a>
\n\"HTML5<\/p>\n

Alles auf einer Karte bzw. Seite<\/strong>
\nSch\u00f6n anzusehen sind Websites, die keine verschachtelten, \u00fcberladenen Navigationsstrukturen aufweisen, sondern clean und flach aufgebaut sind (sofern das die Informationsarchitektur) hergibt. Man scrollt innerhalb der Seite von oben nach unten und entdeckt die weiteren Inhalte oder springt \u00fcber definierte Marker in der Page zu unterschiedlichen Stellen. Storytelling ist hier sehr gut m\u00f6glich – jedoch bietet sich eine One Page Website nicht f\u00fcr jeden und alles an. Man kann sich aber ggf. f\u00fcr einen innovativen Produktbereich oder auch die Darstellung einer Dienstleistung auf interessantere Art und Weise bei diesem Konzept was „abschauen“ und innerhalb einer bestehenden, umfassenderen Website eine solche „einseitige“ Erlebniswelt kreieren.<\/p>\n

One Page Beispiel: nextr<\/a>
\n\"One-Page-Design\"<\/p>\n

Ein Layout f\u00fcr alle Endger\u00e4te<\/strong>
\nEins der gr\u00f6\u00dften Webdesign-Buzzwords aus 2013 ist Responsive Design. Ein solches Design ist von Anfang an auf die unterschiedlichen Endger\u00e4te wie Desktop und Mobile (Smartphone, Tablets & Co.) ausgelegt. Ziel von Responsive Design ist es den Content der Website ideal auf den Bildschirm zu bringen – egal wie gro\u00df (z. B. iMac mit 27 Zoll Display) oder klein (Retina-Display eines iPhones & Co.) dieser ist. Je nach verf\u00fcgbarem Platz ordnet sich der Content neu an, um eine optimale Usability zu bieten. Es geht dabei nicht um „Extraw\u00fcrste“, also Zusatzversionen von Websites f\u00fcr mobile Endger\u00e4te, sondern um ein gro\u00dfes Grundlayout, welches alle Medien abdecken kann. F\u00fcr mich mit das spannendste Feld!<\/p>\n

Responsive Design Beispiel: Einfach mal die Mitsubishi Australia Website<\/a> mit verschiedenen Endger\u00e4te aufrufen<\/p>\n

\"Mitsubishi<\/p>\n

Und was kommt nun?<\/strong>
\nWelche Techniken aus diesem kleinen R\u00fcckblick oder auch andere werden wir auch 2014 sehen? Was meint ihr? Ich bin mir sicher, dass alle vier genannten Themen auch weiterhin im modernen Webdesign eine wichtige Rolle spielen werden – andere oder erg\u00e4nzende Meinungen?<\/p>\n","protected":false},"excerpt":{"rendered":"

Das Jahr 2013 neigt sich dem Ende – genau der richtige Zeitpunkt, um einen kleinen R\u00fcckblick auf die (aus meiner subjektiven Sicht) wichtigsten Webdesign-Trends 2013, die f\u00fcr eine erfolgreiche und ansprechende State-Of-The-Art-Website unverzichtbar sind, zu machen (und das ohne Anspruch auf Vollst\u00e4ndigkeit). Die Designwelt wird flach Sp\u00e4testens durch die Einf\u00fchrung des neuen Betriebssystems iOS 7 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[40,1],"tags":[488,483,487,484,693,485],"class_list":["post-1081","post","type-post","status-publish","format-standard","hentry","category-design","category-webdesign","tag-flat-design","tag-html5","tag-one-page-design","tag-responsive-design","tag-webdesign","tag-website"],"yoast_head":"\nQuo vadis Webdesign? - Social Media . Web 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.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Quo vadis Webdesign? - Social Media . Web Blog\" \/>\n<meta property=\"og:description\" content=\"Das Jahr 2013 neigt sich dem Ende – genau der richtige Zeitpunkt, um einen kleinen R\u00fcckblick auf die (aus meiner subjektiven Sicht) wichtigsten Webdesign-Trends 2013, die f\u00fcr eine erfolgreiche und ansprechende State-Of-The-Art-Website unverzichtbar sind, zu machen (und das ohne Anspruch auf Vollst\u00e4ndigkeit). Die Designwelt wird flach Sp\u00e4testens durch die Einf\u00fchrung des neuen Betriebssystems iOS 7 […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/\" \/>\n<meta property=\"og:site_name\" content=\"Social Media . Web Blog\" \/>\n<meta property=\"article:published_time\" content=\"2013-12-04T20:11:51+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.christian-pansch.de\/blog\/wp-content\/uploads\/2013\/12\/flat-design-1024x484.png\" \/>\n<meta name=\"author\" content=\"Christian Pansch\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"Christian Pansch\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"3\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/\"},\"author\":{\"name\":\"Christian Pansch\",\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/#\\\/schema\\\/person\\\/af4b04e973030b73eb5d7cbb4597d4eb\"},\"headline\":\"Quo vadis Webdesign?\",\"datePublished\":\"2013-12-04T20:11:51+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/\"},\"wordCount\":557,\"commentCount\":2,\"image\":{\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/wp-content\\\/uploads\\\/2013\\\/12\\\/flat-design-1024x484.png\",\"keywords\":[\"flat design\",\"html5\",\"one page design\",\"responsive design\",\"Webdesign\",\"website\"],\"articleSection\":[\"Design & Co.\",\"Webdesign\"],\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/\",\"url\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/\",\"name\":\"Quo vadis Webdesign? - Social Media . Web Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/wp-content\\\/uploads\\\/2013\\\/12\\\/flat-design-1024x484.png\",\"datePublished\":\"2013-12-04T20:11:51+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/#\\\/schema\\\/person\\\/af4b04e973030b73eb5d7cbb4597d4eb\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/wp-content\\\/uploads\\\/2013\\\/12\\\/flat-design-1024x484.png\",\"contentUrl\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/wp-content\\\/uploads\\\/2013\\\/12\\\/flat-design-1024x484.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/quo-vadis-webdesign-1081\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Startseite\",\"item\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Quo vadis Webdesign?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/\",\"name\":\"Social Media . Web Blog\",\"description\":\"Das Blog von Christian Pansch \u00fcber Social Media, Webgeschehen, Mobile, Design, TYPO3 & Co.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/#\\\/schema\\\/person\\\/af4b04e973030b73eb5d7cbb4597d4eb\",\"name\":\"Christian Pansch\",\"sameAs\":[\"http:\\\/\\\/www.christian-pansch.de\"],\"url\":\"https:\\\/\\\/www.christian-pansch.de\\\/blog\\\/author\\\/admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Quo vadis Webdesign? - Social Media . Web Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/","og_locale":"de_DE","og_type":"article","og_title":"Quo vadis Webdesign? - Social Media . Web Blog","og_description":"Das Jahr 2013 neigt sich dem Ende – genau der richtige Zeitpunkt, um einen kleinen R\u00fcckblick auf die (aus meiner subjektiven Sicht) wichtigsten Webdesign-Trends 2013, die f\u00fcr eine erfolgreiche und ansprechende State-Of-The-Art-Website unverzichtbar sind, zu machen (und das ohne Anspruch auf Vollst\u00e4ndigkeit). Die Designwelt wird flach Sp\u00e4testens durch die Einf\u00fchrung des neuen Betriebssystems iOS 7 […]","og_url":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/","og_site_name":"Social Media . Web Blog","article_published_time":"2013-12-04T20:11:51+00:00","og_image":[{"url":"https:\/\/www.christian-pansch.de\/blog\/wp-content\/uploads\/2013\/12\/flat-design-1024x484.png","type":"","width":"","height":""}],"author":"Christian Pansch","twitter_card":"summary_large_image","twitter_misc":{"Verfasst von":"Christian Pansch","Gesch\u00e4tzte Lesezeit":"3\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/#article","isPartOf":{"@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/"},"author":{"name":"Christian Pansch","@id":"https:\/\/www.christian-pansch.de\/blog\/#\/schema\/person\/af4b04e973030b73eb5d7cbb4597d4eb"},"headline":"Quo vadis Webdesign?","datePublished":"2013-12-04T20:11:51+00:00","mainEntityOfPage":{"@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/"},"wordCount":557,"commentCount":2,"image":{"@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/#primaryimage"},"thumbnailUrl":"https:\/\/www.christian-pansch.de\/blog\/wp-content\/uploads\/2013\/12\/flat-design-1024x484.png","keywords":["flat design","html5","one page design","responsive design","Webdesign","website"],"articleSection":["Design & Co.","Webdesign"],"inLanguage":"de","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/","url":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/","name":"Quo vadis Webdesign? - Social Media . Web Blog","isPartOf":{"@id":"https:\/\/www.christian-pansch.de\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/#primaryimage"},"image":{"@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/#primaryimage"},"thumbnailUrl":"https:\/\/www.christian-pansch.de\/blog\/wp-content\/uploads\/2013\/12\/flat-design-1024x484.png","datePublished":"2013-12-04T20:11:51+00:00","author":{"@id":"https:\/\/www.christian-pansch.de\/blog\/#\/schema\/person\/af4b04e973030b73eb5d7cbb4597d4eb"},"breadcrumb":{"@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/#primaryimage","url":"https:\/\/www.christian-pansch.de\/blog\/wp-content\/uploads\/2013\/12\/flat-design-1024x484.png","contentUrl":"https:\/\/www.christian-pansch.de\/blog\/wp-content\/uploads\/2013\/12\/flat-design-1024x484.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.christian-pansch.de\/blog\/quo-vadis-webdesign-1081\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Startseite","item":"https:\/\/www.christian-pansch.de\/blog\/"},{"@type":"ListItem","position":2,"name":"Quo vadis Webdesign?"}]},{"@type":"WebSite","@id":"https:\/\/www.christian-pansch.de\/blog\/#website","url":"https:\/\/www.christian-pansch.de\/blog\/","name":"Social Media . Web Blog","description":"Das Blog von Christian Pansch \u00fcber Social Media, Webgeschehen, Mobile, Design, TYPO3 & Co.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.christian-pansch.de\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Person","@id":"https:\/\/www.christian-pansch.de\/blog\/#\/schema\/person\/af4b04e973030b73eb5d7cbb4597d4eb","name":"Christian Pansch","sameAs":["http:\/\/www.christian-pansch.de"],"url":"https:\/\/www.christian-pansch.de\/blog\/author\/admin\/"}]}},"publishpress_future_action":{"enabled":false,"date":"2026-05-11 07:30:56","action":"change-status","newStatus":"draft","terms":[],"taxonomy":"category","extraData":[]},"publishpress_future_workflow_manual_trigger":{"enabledWorkflows":[]},"_links":{"self":[{"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/posts\/1081","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/comments?post=1081"}],"version-history":[{"count":18,"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/posts\/1081\/revisions"}],"predecessor-version":[{"id":1108,"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/posts\/1081\/revisions\/1108"}],"wp:attachment":[{"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/media?parent=1081"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/categories?post=1081"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.christian-pansch.de\/blog\/wp-json\/wp\/v2\/tags?post=1081"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}