

{"id":37,"date":"2017-04-24T13:27:31","date_gmt":"2017-04-24T13:27:31","guid":{"rendered":"https:\/\/magazin.lansol.de\/?p=37"},"modified":"2021-02-25T17:54:56","modified_gmt":"2021-02-25T16:54:56","slug":"responsive-design","status":"publish","type":"post","link":"https:\/\/www.lansol.de\/blog\/responsive-design\/","title":{"rendered":"Responsive Design \u2013 Eine der Grundlagen im Webdesign"},"content":{"rendered":"\n<p>Ansprechende Websites, die Besucher einladen und die gew\u00fcnschten Informationen gefiltert und angepasst darstellen, kommen ohne ein Responsive Design nicht aus. Dabei geht es im Grunde genommen darum, dass die Website nicht als ein festes Design dargestellt wird, sondern sich flexibel an wechselnde Bildschirmgr\u00f6\u00dfen und andere Faktoren anpassen l\u00e4sst.<\/p>\n\n\n\n<p>Die Zeiten, in denen es nur wenige Bildschirmgr\u00f6\u00dfen zu beachten galt, sind lange vorbei, weshalb sich auch das Responsive Webdesign auf verschiedene Aufl\u00f6sungen einstellen musste. Inzwischen gibt es gute und einfache M\u00f6glichkeiten, entsprechende Designs umzusetzen. Eine ansprechende Website tr\u00e4gt ma\u00dfgeblich zur Corporate Identity bei. Um gewinnende Webdesigns zu gestalten, kann es sinnvoll sein, Profis zurate zu ziehen: LANSOL bietet leistungsstarke <a href=\"https:\/\/www.lansol.de\/webhosting\/\" target=\"_blank\" rel=\"noopener noreferrer\">Webhosting-Pakete<\/a>&nbsp;an. Wie sich das Responsive Design am besten umsetzen l\u00e4sst und wof\u00fcr es heutzutage im Allgemeinen ben\u00f6tigt wird, wird in der Folge aufgezeigt.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Warum Responsive Design verwenden?<\/h2>\n\n\n\n<p>Im Grunde ist die Verwendung eines Responsive Designs f\u00fcr einen angenehmen Gebrauch einer Website unumg\u00e4nglich. Es geht darum, dass sich die einzelnen Elemente jederzeit systematisch nutzen lassen und somit die Funktionalit\u00e4t immer im geforderten Ma\u00dfe vorhanden ist. Dar\u00fcber hinaus bestehen f\u00fcr Websites somit auch M\u00f6glichkeiten, bei kleineren Aufl\u00f6sungen Elemente zusammenzufassen, anstatt diese unkenntlich klein zu gestalten. Die M\u00f6glichkeiten mit einem Responsive Webdesign sind f\u00fcr den Webdesigner \u00e4u\u00dferst vielf\u00e4ltig und erlaubt ebenso gro\u00dfe Flexibilit\u00e4t bei der Ausrichtung verschiedener Anwendungen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Die Standardaufl\u00f6sungen<\/h3>\n\n\n\n<p>Inzwischen gibt es drei Arten von Endger\u00e4ten, die regelm\u00e4\u00dfig auf Websites zugreifen k\u00f6nnen. Ausnahmen gibt es hierbei zwar auch, allerdings stellen Computer beziehungsweise Laptops, Tablets und Smartphones die Hauptanwendungsfelder dar.<\/p>\n\n\n\n<p>Die Gr\u00f6\u00dfen variieren nicht nur zwischen den einzelnen Arten, sondern auch innerhalb dieser. Dennoch gibt es f\u00fcr Webdesigner bestimmte Anhaltspunkte und Standardaufl\u00f6sungen bei Bildschirmgr\u00f6\u00dfen der drei Produktarten, die herangezogen werden k\u00f6nnen.<\/p>\n\n\n\n<p>&#8211; Smartphones: 320 x 480 Pixel<br>&#8211; Tablets: 768 x 1.024 Pixel<br>&#8211; Laptops: 1.366 x 768 Pixel<br>&#8211; Desktop Computer: 1.920 x 1.080 Pixel<\/p>\n\n\n\n<p>Variationen dieser Aufl\u00f6sungen finden sich selbstverst\u00e4ndlich immer wieder. So gibt es inzwischen auch hochaufgel\u00f6ste mobile Endger\u00e4te, die die Pixeldichte von Desktop Computern erreichen und dabei die Gr\u00f6\u00dfe von herk\u00f6mmlichen Smartphones beibehalten. Dar\u00fcber hinaus muss das Responsive Design auch auf Ver\u00e4nderungen der Fenstergr\u00f6\u00dfen auf Computern und Laptops reagieren. Bei Smartphones kommt ebenfalls hinzu, dass viele Anwendungen hochkant und quer sind. Daraus erfolgt f\u00fcr den Betreiber einer vielseitig genutzten Website ein permanenter Pflegebedarf, um den wechselnden Anspr\u00fcchen dauerhaft gerecht zu werden.<br>Aussicht: Der Aufstieg von Smartwatches als mobile Endger\u00e4te in Verbindung mit Smartphones macht die Nutzung von Responsive Designs unter Umst\u00e4nden auch hier n\u00f6tig.<\/p>\n\n\n\n<div class=\"cs\">\n<h3>G\u00fcnstige Webhosting-Pakete von LANSOL<\/h3>\n<p>Schnelles Webhosting inklusive Wunschdomain, SSL-Zertifikat und Backup-Manager. Webhosting von LANSOL jetzt unverbindlich testen!<\/p>\n<ul>\n<li>Inklusive .de- oder .com-Domain<\/li> \n<li>Performante Server f\u00fcr schnelle Zugriffs- und Ladezeiten.<\/li>\n<li>Anwendungen mit nur einem Klick installieren<\/li>\n<\/ul>\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link cs-button\" href=\"https:\/\/www.lansol.de\/webhosting\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Zum Webhosting<\/strong><\/a><\/div>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Weitere Anspr\u00fcche unterschiedlicher Endger\u00e4te<\/h3>\n\n\n\n<p class=\"has-text-align-left\">Auch wenn Aufl\u00f6sung und Bildschirmgr\u00f6\u00dfe sicherlich entscheidende Faktoren darstellen, gibt es in Sachen Funktionalit\u00e4t und Anwendung dennoch gewisse Unterschiede. So wird ein klassischer Computer mit Maus und Tastatur bedient. Smartphones und Tablets werden im Gegensatz dazu mit dem Touchscreen bet\u00e4tigt. Das Klicken und Scrollen wird somit durch Antippen und Wischen ersetzt. Ein Responsive Design muss auf diese ver\u00e4nderten M\u00f6glichkeiten entsprechend R\u00fccksicht nehmen.<br>Hinweis: Eine vollst\u00e4ndige und durchdachte Planung des Responsive Designs macht zwar zu Beginn ziemlich viel Arbeit, lohnt sich aber dennoch, da die Pflege der Website dadurch deutlich \u00fcbersichtlicher wird.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Konkrete Anforderungen an die Responsive Website<\/h3>\n\n\n\n<p>Beim Erstellen der Website gibt es in der Folge drei Grundregeln, die unbedingt eingehalten werden m\u00fcssen, um den Betrieb erfolgreich zu gestalten.<br>Die erste Regel besagt demnach, dass es keine festen Schriftgr\u00f6\u00dfen geben darf, da sich diese immer anpassen m\u00fcssen. Um das einzuhalten, k\u00f6nnen die Schriftgr\u00f6\u00dfen entweder prozentual festgelegt werden oder mit speziellen Tools automatisch angepasst werden.<br>Die zweite Regel bezieht sich auf die Gr\u00f6\u00dfe der verwendeten Bilder. Auch diese sollten niemals fest sein, da die Aufl\u00f6sung an die F\u00e4higkeiten des Bildschirms anzupassen ist. Ein Problem bei Bildern ist, dass hohe Aufl\u00f6sungen auf mobilen Endger\u00e4ten einen h\u00f6heren Datenverbrauch verursachen und unter Umst\u00e4nden deutlich l\u00e4ngere Ladezeiten beanspruchen. Eine L\u00f6sung daf\u00fcr stellt die M\u00f6glichkeit dar, dass verschiedene Aufl\u00f6sungen desselben Bildes auf den <a href=\"https:\/\/www.lansol.de\/ftp-server\/\">Server<\/a> geladen werden und dieser dann das Bild mit der passenden Aufl\u00f6sung zur Verf\u00fcgung stellt.<br>Die dritte und letzte Regel bezieht sich auf die Gr\u00f6\u00dfe des Layout Grids, also der Anordnung der einzelnen Elemente. Auch hier ist gro\u00dfe Flexibilit\u00e4t gefragt, da verschiedene Aufl\u00f6sungen sonst zu ungewollten Verschiebungen und anderen Problemen f\u00fchren. Auch hier kann die Verwendung von prozentualen Werten f\u00fcr das richtige Design helfen.<br>Tipp: Inzwischen liegt der Anteil der Websiteaufrufe mit Smartphones bei \u00fcber 25 Prozent, mit steigender Tendenz. Daher gilt die Devise, dass die etwas kompliziertere Programmierung f\u00fcr mobile Endger\u00e4te inzwischen im Vordergrund stehen sollte. Das Vorgehen erfolgt demnach von den kleinsten m\u00f6glichen Ger\u00e4ten hin zu gr\u00f6\u00dferen Aufl\u00f6sungen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Responsive Design mit CSS<\/h3>\n\n\n\n<p>CSS l\u00f6st die Probleme des Responsive Designs relativ geschickt, indem Media Queries verwendet werden. Diese verwenden hierzu bestimmte Bedingungen, die vom jeweiligen Endger\u00e4t abgefragt werden. In Abh\u00e4ngigkeit der erf\u00fcllten Bedingungen k\u00f6nnen dann die jeweiligen, gewollten Designs geladen werden. Das Responsive Design in CSS fragt daher unter anderem ab, welche Ausma\u00dfe das Browserfenster hat. Die Bildschirmaufl\u00f6sung, sowie die generell Gr\u00f6\u00dfe von Endger\u00e4ten werden ebenfalls abgefragt. Auch die zuvor aufgezeigten Eingabefunktionen und die Ausrichtung des Bildschirms geh\u00f6ren zu den Optionen einer Website. Eine Kombination der verschiedenen, abgefragten Eigenschaften erm\u00f6glicht viele verschiedene Regeln f\u00fcr bestm\u00f6glich angepasste Websites.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Responsive Design mit der Hilfe von Templates<\/h3>\n\n\n\n<p>Besonders relativ unerfahrene Programmierer von Websites k\u00f6nnen mit der Hilfe der Responsive Design Templates zu einer sch\u00f6nen und funktionalen Website gelangen, die auf allen Endger\u00e4ten \u00e4hnlich gut funktioniert. Die Templates stellen dabei Vorlagen dar, die in diesem Fall bereits das Responsive Design beinhalten. Oft sind die Templates dabei noch mit anderen praktischen Hilfen ausgestattet, die \u00fcber das Responsive Design hinausgehen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Abschlie\u00dfendes Fazit zum Responsive Design<\/h3>\n\n\n\n<p>Mit den inzwischen weit etablierten Smartphones und Tablets, die den gesamten Markt beherrschen, ist das Verwenden von Responsive Webdesigns und Responsive Websites unabdingbar. So ist das flexible Programmieren anhand der Bed\u00fcrfnisse der jeweiligen Endger\u00e4te mit CSS relativ einfach m\u00f6glich und schafft Websites, die auf jeden userseitigen Anspruch reagieren k\u00f6nnen. Dabei gilt stets, dass eine Responsive Website niemals fertig ist und st\u00e4ndiger Pflege bedarf, die allerdings mit einem guten Ausgangskonzept in Grenzen gehalten werden kann.<br>Sollten sie Fragen zu unseren Produkten oder unserem <a href=\"https:\/\/www.lansol.de\/ueber-uns\/\">Unternehmen <\/a>haben, z\u00f6gern Sie nicht uns zu kontaktieren. Sie erreichen uns telefonisch unter +49 6236 &#8211; 39 90 199 oder \u00fcber unser <a href=\"https:\/\/www.lansol.de\/kontakt\/\">Kontaktformular<\/a>.<\/p>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-left kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;left&quot;,&quot;id&quot;:&quot;37&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;0&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;0&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;4&quot;,&quot;greet&quot;:&quot;&quot;,&quot;legend&quot;:&quot;0\\\/5 - (0 votes)&quot;,&quot;size&quot;:&quot;24&quot;,&quot;title&quot;:&quot;Responsive Design \u2013 Eine der Grundlagen im Webdesign&quot;,&quot;width&quot;:&quot;0&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} - ({count} {votes})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 0px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 4px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 19.2px;\">\n            <span class=\"kksr-muted\"><\/span>\n    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Ansprechende Websites, die Besucher einladen und die gew\u00fcnschten Informationen gefiltert und angepasst darstellen, kommen ohne ein Responsive Design nicht aus. Dabei geht es im Grunde genommen darum, dass die Website nicht als ein festes Design dargestellt wird, sondern sich flexibel an wechselnde Bildschirmgr\u00f6\u00dfen und andere Faktoren anpassen l\u00e4sst. Die Zeiten, in denen es nur wenige&#8230;  <a class=\"excerpt-read-more\" href=\"https:\/\/www.lansol.de\/blog\/responsive-design\/\" title=\"ReadResponsive Design \u2013 Eine der Grundlagen im Webdesign\">Read more &raquo;<\/a><\/p>\n","protected":false},"author":3,"featured_media":1280,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-37","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-themen"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.1.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Responsive Design \u2013 Eine der Grundlagen im Webdesign | lansol.de<\/title>\n<meta name=\"description\" content=\"Responsive Design bedeutet, dass eine Website sich flexibel an wechselnde Bildschirmgr\u00f6\u00dfen und andere Faktoren anpassen l\u00e4sst. Mehr auf | lansol.de\" \/>\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.lansol.de\/blog\/responsive-design\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Responsive Design \u2013 Eine der Grundlagen im Webdesign | lansol.de\" \/>\n<meta property=\"og:description\" content=\"Responsive Design bedeutet, dass eine Website sich flexibel an wechselnde Bildschirmgr\u00f6\u00dfen und andere Faktoren anpassen l\u00e4sst. Mehr auf | lansol.de\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.lansol.de\/blog\/responsive-design\/\" \/>\n<meta property=\"og:site_name\" content=\"LANSOL Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/lansolgmbh\/\" \/>\n<meta property=\"article:published_time\" content=\"2017-04-24T13:27:31+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-02-25T16:54:56+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png\" \/>\n\t<meta property=\"og:image:width\" content=\"3508\" \/>\n\t<meta property=\"og:image:height\" content=\"2481\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"LSxxBL08xx15\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@lansolgmbh\" \/>\n<meta name=\"twitter:site\" content=\"@lansolgmbh\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"LSxxBL08xx15\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"5\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/\"},\"author\":{\"name\":\"LSxxBL08xx15\",\"@id\":\"https:\/\/www.lansol.de\/blog\/#\/schema\/person\/6d6e31e321d99a8d666c072185ff0439\"},\"headline\":\"Responsive Design \u2013 Eine der Grundlagen im Webdesign\",\"datePublished\":\"2017-04-24T13:27:31+00:00\",\"dateModified\":\"2021-02-25T16:54:56+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/\"},\"wordCount\":1113,\"publisher\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png\",\"articleSection\":[\"Themen\"],\"inLanguage\":\"de\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/\",\"url\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/\",\"name\":\"Responsive Design \u2013 Eine der Grundlagen im Webdesign | lansol.de\",\"isPartOf\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png\",\"datePublished\":\"2017-04-24T13:27:31+00:00\",\"dateModified\":\"2021-02-25T16:54:56+00:00\",\"description\":\"Responsive Design bedeutet, dass eine Website sich flexibel an wechselnde Bildschirmgr\u00f6\u00dfen und andere Faktoren anpassen l\u00e4sst. Mehr auf | lansol.de\",\"breadcrumb\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.lansol.de\/blog\/responsive-design\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/#primaryimage\",\"url\":\"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png\",\"contentUrl\":\"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png\",\"width\":3508,\"height\":2481,\"caption\":\"Lansol GmbH\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.lansol.de\/blog\/responsive-design\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Startseite\",\"item\":\"https:\/\/www.lansol.de\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Responsive Design \u2013 Eine der Grundlagen im Webdesign\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.lansol.de\/blog\/#website\",\"url\":\"https:\/\/www.lansol.de\/blog\/\",\"name\":\"LANSOL Blog\",\"description\":\"LANSOL Blog\",\"publisher\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.lansol.de\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.lansol.de\/blog\/#organization\",\"name\":\"Lansol GmbH\",\"url\":\"https:\/\/www.lansol.de\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/www.lansol.de\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2019\/08\/Profilbild.png\",\"contentUrl\":\"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2019\/08\/Profilbild.png\",\"width\":2917,\"height\":2917,\"caption\":\"Lansol GmbH\"},\"image\":{\"@id\":\"https:\/\/www.lansol.de\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/lansolgmbh\/\",\"https:\/\/x.com\/lansolgmbh\",\"https:\/\/www.instagram.com\/lansolgmbh\/\",\"https:\/\/www.youtube.com\/channel\/UC97AdSFQM0MabeUNgSIkeAA\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.lansol.de\/blog\/#\/schema\/person\/6d6e31e321d99a8d666c072185ff0439\",\"name\":\"LSxxBL08xx15\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/www.lansol.de\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/6d4b14074bff758c00fe83d636882c1d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/6d4b14074bff758c00fe83d636882c1d?s=96&d=mm&r=g\",\"caption\":\"LSxxBL08xx15\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Responsive Design \u2013 Eine der Grundlagen im Webdesign | lansol.de","description":"Responsive Design bedeutet, dass eine Website sich flexibel an wechselnde Bildschirmgr\u00f6\u00dfen und andere Faktoren anpassen l\u00e4sst. Mehr auf | lansol.de","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.lansol.de\/blog\/responsive-design\/","og_locale":"de_DE","og_type":"article","og_title":"Responsive Design \u2013 Eine der Grundlagen im Webdesign | lansol.de","og_description":"Responsive Design bedeutet, dass eine Website sich flexibel an wechselnde Bildschirmgr\u00f6\u00dfen und andere Faktoren anpassen l\u00e4sst. Mehr auf | lansol.de","og_url":"https:\/\/www.lansol.de\/blog\/responsive-design\/","og_site_name":"LANSOL Blog","article_publisher":"https:\/\/www.facebook.com\/lansolgmbh\/","article_published_time":"2017-04-24T13:27:31+00:00","article_modified_time":"2021-02-25T16:54:56+00:00","og_image":[{"width":3508,"height":2481,"url":"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png","type":"image\/png"}],"author":"LSxxBL08xx15","twitter_card":"summary_large_image","twitter_creator":"@lansolgmbh","twitter_site":"@lansolgmbh","twitter_misc":{"Verfasst von":"LSxxBL08xx15","Gesch\u00e4tzte Lesezeit":"5\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/#article","isPartOf":{"@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/"},"author":{"name":"LSxxBL08xx15","@id":"https:\/\/www.lansol.de\/blog\/#\/schema\/person\/6d6e31e321d99a8d666c072185ff0439"},"headline":"Responsive Design \u2013 Eine der Grundlagen im Webdesign","datePublished":"2017-04-24T13:27:31+00:00","dateModified":"2021-02-25T16:54:56+00:00","mainEntityOfPage":{"@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/"},"wordCount":1113,"publisher":{"@id":"https:\/\/www.lansol.de\/blog\/#organization"},"image":{"@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png","articleSection":["Themen"],"inLanguage":"de"},{"@type":"WebPage","@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/","url":"https:\/\/www.lansol.de\/blog\/responsive-design\/","name":"Responsive Design \u2013 Eine der Grundlagen im Webdesign | lansol.de","isPartOf":{"@id":"https:\/\/www.lansol.de\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/#primaryimage"},"image":{"@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png","datePublished":"2017-04-24T13:27:31+00:00","dateModified":"2021-02-25T16:54:56+00:00","description":"Responsive Design bedeutet, dass eine Website sich flexibel an wechselnde Bildschirmgr\u00f6\u00dfen und andere Faktoren anpassen l\u00e4sst. Mehr auf | lansol.de","breadcrumb":{"@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.lansol.de\/blog\/responsive-design\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/#primaryimage","url":"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png","contentUrl":"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2017\/04\/Responsive-Design-01.png","width":3508,"height":2481,"caption":"Lansol GmbH"},{"@type":"BreadcrumbList","@id":"https:\/\/www.lansol.de\/blog\/responsive-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Startseite","item":"https:\/\/www.lansol.de\/blog\/"},{"@type":"ListItem","position":2,"name":"Responsive Design \u2013 Eine der Grundlagen im Webdesign"}]},{"@type":"WebSite","@id":"https:\/\/www.lansol.de\/blog\/#website","url":"https:\/\/www.lansol.de\/blog\/","name":"LANSOL Blog","description":"LANSOL Blog","publisher":{"@id":"https:\/\/www.lansol.de\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.lansol.de\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/www.lansol.de\/blog\/#organization","name":"Lansol GmbH","url":"https:\/\/www.lansol.de\/blog\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.lansol.de\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2019\/08\/Profilbild.png","contentUrl":"https:\/\/www.lansol.de\/blog\/wp-content\/uploads\/2019\/08\/Profilbild.png","width":2917,"height":2917,"caption":"Lansol GmbH"},"image":{"@id":"https:\/\/www.lansol.de\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/lansolgmbh\/","https:\/\/x.com\/lansolgmbh","https:\/\/www.instagram.com\/lansolgmbh\/","https:\/\/www.youtube.com\/channel\/UC97AdSFQM0MabeUNgSIkeAA"]},{"@type":"Person","@id":"https:\/\/www.lansol.de\/blog\/#\/schema\/person\/6d6e31e321d99a8d666c072185ff0439","name":"LSxxBL08xx15","image":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/www.lansol.de\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/6d4b14074bff758c00fe83d636882c1d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6d4b14074bff758c00fe83d636882c1d?s=96&d=mm&r=g","caption":"LSxxBL08xx15"}}]}},"_links":{"self":[{"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/posts\/37","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/comments?post=37"}],"version-history":[{"count":15,"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/posts\/37\/revisions"}],"predecessor-version":[{"id":2790,"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/posts\/37\/revisions\/2790"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/media\/1280"}],"wp:attachment":[{"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/media?parent=37"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/categories?post=37"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lansol.de\/blog\/wp-json\/wp\/v2\/tags?post=37"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}