{"id":3701,"date":"2016-11-17T17:56:49","date_gmt":"2016-11-17T16:56:49","guid":{"rendered":"https:\/\/pb.lochbronner.com\/uncategorized\/mobile-first\/"},"modified":"2016-11-17T17:56:49","modified_gmt":"2016-11-17T16:56:49","slug":"mobile-first","status":"publish","type":"post","link":"https:\/\/www.lochbronner.com\/en\/thema-webdesign\/mobile-first\/","title":{"rendered":"Mobile First"},"content":{"rendered":"<p class=\"intro\">How is a web design actually created? Or to put it another way - where do you start? Every web designer certainly has their own approach, which is tailored to their individual way of working. Leaving personal preferences aside, you could at least ask yourself for which end device the first designs should be created. Do you start with high-resolution screens for desktops? Or with notebooks? This is where the mobile first approach comes in. As the name suggests, you start with the design for mobile devices or with the smallest layout variant. Then you gradually move towards the larger variants.<\/p>\n<h2>Mobile web design is becoming increasingly important<\/h2>\n<p>But where does the mobile first trend actually come from? In the past, a desktop version was usually created first, to which a mobile version was then optionally added. However, as websites are increasingly being used on mobile devices such as smartphones, priorities are shifting. For some sites, the mobile version has long been more important than its \"big brother\".<\/p>\n<h3>Google introduces a mobile-first index<\/h3>\n<p>At the latest after this announcement, it is clear how dominant the role of mobile web design has become: Google is introducing its own index that specifically lists mobile versions of websites. A fully-fledged mobile website is therefore more important than ever before if you want to continue to maintain good search engine rankings. The mobile-first trend could get an additional boost as a result.<\/p>\n<h2>Mobile First Advantages<\/h2>\n<p>The entire website can benefit from the mobile first approach - after all, the focus is on the content. The website is concentrated on the essentials and important content is as dominant as possible, i.e. positioned as high up as possible. In a later step, the desktop version can be created on this solid basis and additional functions can be added. At best, this also increases the usability of a website.<\/p>\n<h2>Implementation<\/h2>\n<p>There are several ways to develop a mobile-first website. In practice, the following has proven to be particularly effective <a href=\"https:\/\/www.lochbronner.com\/en\/webdesign\/responsive-webdesign\/\">Responsive web design<\/a> which can be optimally combined.<\/p>\n<h2><\/h2>","protected":false},"excerpt":{"rendered":"<p>Wie entsteht eigentlich ein Webdesign? Oder anders gefragt &#8211; wo beginnt man? Sicherlich hat jeder Webdesigner eine eigene Vorgehensweise, die auf die individuelle Arbeitsweise abgestimmt ist. L\u00e4sst man pers\u00f6nliche Pr\u00e4ferenzen au\u00dfer Acht, k\u00f6nnte man sich aber zumindest fragen, f\u00fcr welches Endger\u00e4t die ersten Designs erstellt werden sollen. F\u00e4ngt man etwa bei hochaufl\u00f6senden Bildschirmen f\u00fcr Desktops [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":3702,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[19],"tags":[],"class_list":["post-3701","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-thema-webdesign"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Mobile First - Webdesign Trend erh\u00f6ht Usability auf mobilen Endger\u00e4ten<\/title>\n<meta name=\"description\" content=\"Beim Mobile First Ansatz wird zuerst das Webdesign f\u00fcr mobile Endger\u00e4te erstellt und sp\u00e4ter um die gr\u00f6\u00dferen Varianten erg\u00e4nzt - das f\u00f6rdert die Usability.\" \/>\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.lochbronner.com\/en\/thema-webdesign\/mobile-first\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Mobile First - Webdesign Trend erh\u00f6ht Usability auf mobilen Endger\u00e4ten\" \/>\n<meta property=\"og:description\" content=\"Beim Mobile First Ansatz wird zuerst das Webdesign f\u00fcr mobile Endger\u00e4te erstellt und sp\u00e4ter um die gr\u00f6\u00dferen Varianten erg\u00e4nzt - das f\u00f6rdert die Usability.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.lochbronner.com\/en\/thema-webdesign\/mobile-first\/\" \/>\n<meta property=\"og:site_name\" content=\"Sebastian Lochbronner\" \/>\n<meta property=\"article:published_time\" content=\"2016-11-17T16:56:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.lochbronner.com\/wp-content\/uploads\/2022\/05\/mobile-first.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1100\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Sebastian Lochbronner\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sebastian Lochbronner\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/\"},\"author\":{\"name\":\"Sebastian Lochbronner\",\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/#\\\/schema\\\/person\\\/3064163d41408dc5ab9a392b77f9979b\"},\"headline\":\"Mobile First\",\"datePublished\":\"2016-11-17T16:56:49+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/\"},\"wordCount\":360,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.lochbronner.com\\\/wp-content\\\/uploads\\\/2022\\\/05\\\/mobile-first.jpg\",\"articleSection\":[\"Webdesign\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/\",\"url\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/\",\"name\":\"Mobile First - Webdesign Trend erh\u00f6ht Usability auf mobilen Endger\u00e4ten\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.lochbronner.com\\\/wp-content\\\/uploads\\\/2022\\\/05\\\/mobile-first.jpg\",\"datePublished\":\"2016-11-17T16:56:49+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/#\\\/schema\\\/person\\\/3064163d41408dc5ab9a392b77f9979b\"},\"description\":\"Beim Mobile First Ansatz wird zuerst das Webdesign f\u00fcr mobile Endger\u00e4te erstellt und sp\u00e4ter um die gr\u00f6\u00dferen Varianten erg\u00e4nzt - das f\u00f6rdert die Usability.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.lochbronner.com\\\/wp-content\\\/uploads\\\/2022\\\/05\\\/mobile-first.jpg\",\"contentUrl\":\"https:\\\/\\\/www.lochbronner.com\\\/wp-content\\\/uploads\\\/2022\\\/05\\\/mobile-first.jpg\",\"width\":1100,\"height\":300},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/thema-webdesign\\\/mobile-first\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Startseite\",\"item\":\"https:\\\/\\\/www.lochbronner.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Mobile First\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/#website\",\"url\":\"https:\\\/\\\/www.lochbronner.com\\\/\",\"name\":\"Sebastian Lochbronner\",\"description\":\"Designer, Unternehmer, Espressoliebhaber\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.lochbronner.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.lochbronner.com\\\/#\\\/schema\\\/person\\\/3064163d41408dc5ab9a392b77f9979b\",\"name\":\"Sebastian Lochbronner\",\"sameAs\":[\"https:\\\/\\\/www.lochbronner.com\"],\"url\":\"https:\\\/\\\/www.lochbronner.com\\\/en\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mobile First - web design trend increases usability on mobile devices","description":"With the mobile first approach, the web design is first created for mobile devices and then supplemented later with the larger variants - this promotes usability.","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.lochbronner.com\/en\/thema-webdesign\/mobile-first\/","og_locale":"en_US","og_type":"article","og_title":"Mobile First - Webdesign Trend erh\u00f6ht Usability auf mobilen Endger\u00e4ten","og_description":"Beim Mobile First Ansatz wird zuerst das Webdesign f\u00fcr mobile Endger\u00e4te erstellt und sp\u00e4ter um die gr\u00f6\u00dferen Varianten erg\u00e4nzt - das f\u00f6rdert die Usability.","og_url":"https:\/\/www.lochbronner.com\/en\/thema-webdesign\/mobile-first\/","og_site_name":"Sebastian Lochbronner","article_published_time":"2016-11-17T16:56:49+00:00","og_image":[{"width":1100,"height":300,"url":"https:\/\/www.lochbronner.com\/wp-content\/uploads\/2022\/05\/mobile-first.jpg","type":"image\/jpeg"}],"author":"Sebastian Lochbronner","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Sebastian Lochbronner","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/#article","isPartOf":{"@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/"},"author":{"name":"Sebastian Lochbronner","@id":"https:\/\/www.lochbronner.com\/#\/schema\/person\/3064163d41408dc5ab9a392b77f9979b"},"headline":"Mobile First","datePublished":"2016-11-17T16:56:49+00:00","mainEntityOfPage":{"@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/"},"wordCount":360,"commentCount":0,"image":{"@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/#primaryimage"},"thumbnailUrl":"https:\/\/www.lochbronner.com\/wp-content\/uploads\/2022\/05\/mobile-first.jpg","articleSection":["Webdesign"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/","url":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/","name":"Mobile First - web design trend increases usability on mobile devices","isPartOf":{"@id":"https:\/\/www.lochbronner.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/#primaryimage"},"image":{"@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/#primaryimage"},"thumbnailUrl":"https:\/\/www.lochbronner.com\/wp-content\/uploads\/2022\/05\/mobile-first.jpg","datePublished":"2016-11-17T16:56:49+00:00","author":{"@id":"https:\/\/www.lochbronner.com\/#\/schema\/person\/3064163d41408dc5ab9a392b77f9979b"},"description":"With the mobile first approach, the web design is first created for mobile devices and then supplemented later with the larger variants - this promotes usability.","breadcrumb":{"@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/#primaryimage","url":"https:\/\/www.lochbronner.com\/wp-content\/uploads\/2022\/05\/mobile-first.jpg","contentUrl":"https:\/\/www.lochbronner.com\/wp-content\/uploads\/2022\/05\/mobile-first.jpg","width":1100,"height":300},{"@type":"BreadcrumbList","@id":"https:\/\/www.lochbronner.com\/thema-webdesign\/mobile-first\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Startseite","item":"https:\/\/www.lochbronner.com\/"},{"@type":"ListItem","position":2,"name":"Mobile First"}]},{"@type":"WebSite","@id":"https:\/\/www.lochbronner.com\/#website","url":"https:\/\/www.lochbronner.com\/","name":"Sebastian Lochbronner","description":"Designer, entrepreneur, espresso lover","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.lochbronner.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.lochbronner.com\/#\/schema\/person\/3064163d41408dc5ab9a392b77f9979b","name":"Sebastian Lochbronner","sameAs":["https:\/\/www.lochbronner.com"],"url":"https:\/\/www.lochbronner.com\/en"}]}},"_links":{"self":[{"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/posts\/3701","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/comments?post=3701"}],"version-history":[{"count":0,"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/posts\/3701\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/media\/3702"}],"wp:attachment":[{"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/media?parent=3701"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/categories?post=3701"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lochbronner.com\/en\/wp-json\/wp\/v2\/tags?post=3701"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}