[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"9_t0YFtO844PW3-iCfPxRTbw8yv0-2zzu2bChZFenjo":3,"btz8hO-MXSFLpybqvfjYVBre4OvrEJO1wFySe3Zmv-s":49,"VUY9blN8fjlUOKQ9YxSWzz7dtEiGYNXjKC9pbI1IAg8":75,"fdWDXfPcqBXzEHRCwPp9kocu4RXW9hBXb_NXYLvPBu4":172,"_apollo:default":217},{"menu":4},{"__typename":5,"id":6,"name":7,"items":8},"Menu","nuxt-main-menu","Nuxt Hauptmenü",[9,24,29,34,39,44],{"__typename":10,"id":11,"title":12,"description":13,"url":14,"langcode":15,"internal":20,"expanded":21,"attributes":22},"MenuItem","9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1","Blog",null,"/know-how",{"__typename":16,"id":17,"name":18,"direction":19},"Language","de","German","ltr",true,false,{"__typename":23,"class":13},"MenuItemAttributes",{"__typename":10,"id":25,"title":26,"description":13,"url":27,"langcode":15,"internal":20,"expanded":21,"attributes":28},"1c7a5430-8a42-4b24-9544-252adabc2f4c","Projekte","/projekte",{"__typename":23,"class":13},{"__typename":10,"id":30,"title":31,"description":13,"url":32,"langcode":15,"internal":20,"expanded":21,"attributes":33},"9c4feedc-79e4-4fbf-b68c-065f33ebfe4c","Sparring","/workshop-ux-sparring-fuer-unternehmen",{"__typename":23,"class":13},{"__typename":10,"id":35,"title":36,"description":13,"url":37,"langcode":15,"internal":20,"expanded":21,"attributes":38},"3b77a27b-272a-489f-843e-53e23ed07741","Trainings","/liechtenecker-ux-academy",{"__typename":23,"class":13},{"__typename":10,"id":40,"title":41,"description":13,"url":42,"langcode":15,"internal":20,"expanded":21,"attributes":43},"ce0bb82b-e1ee-4036-be95-f693a62e9f4a","Über uns","/about",{"__typename":23,"class":13},{"__typename":10,"id":45,"title":46,"description":13,"url":47,"langcode":15,"internal":20,"expanded":21,"attributes":48},"04a19381-81a9-4694-8653-182d8855d2b5","Kontakt","/kontakt",{"__typename":23,"class":13},{"menu":50},{"__typename":5,"id":51,"name":52,"items":53},"footer","Fußzeile",[54,60,65,70],{"__typename":10,"id":55,"title":56,"description":13,"url":57,"langcode":58,"internal":20,"expanded":21,"attributes":59},"e2873307-b50a-4aab-b6b2-1950fd99c72e","Impressum","/impressum",{"__typename":16,"id":17,"name":18,"direction":19},{"__typename":23,"class":13},{"__typename":10,"id":61,"title":62,"description":13,"url":63,"langcode":58,"internal":20,"expanded":21,"attributes":64},"2cd9b7c9-142a-4ea3-b898-a0952c54a195","Datenschutz","/datenschutz",{"__typename":23,"class":13},{"__typename":10,"id":66,"title":67,"description":13,"url":68,"langcode":58,"internal":20,"expanded":21,"attributes":69},"a5effba3-5a8c-4125-8d78-0cdba09824db","AGB","/agb",{"__typename":23,"class":13},{"__typename":10,"id":71,"title":72,"description":13,"url":73,"langcode":58,"internal":21,"expanded":21,"attributes":74},"114bf071-bdbb-44cf-85c1-69e9d9e0777d","Newsletter","https://liechtenecker.at/newsletter-subscribe",{"__typename":23,"class":13},{"route":76},{"__typename":77,"entity":78},"RouteInternal",{"__typename":79,"id":80,"title":81,"changed":82,"created":88,"langcode":89,"path":90,"promote":21,"status":20,"sticky":21,"metatag":91,"postCategory":111,"postContentElements":13,"evergreen":13,"tags":136,"postWpBody":162,"wpHeaderImage":13,"wpHeaderImageOld":13,"wpHeaderImageOldSmall":13,"wpOgImage":13,"wpPromotedTeaserImage":13,"wpShareDescription":13,"wpShareTitle":13,"wpTeaserText":13,"wpYoastHead":165,"author":166},"NodeWpPost","1159","Mojo für den Browser: Hardboiled Webdesign mit HTML5 und CSS3",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},"DateTime",1310972428,"UTC","+00:00","2011-07-18T07:00:28+00:00",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},{"__typename":16,"id":17,"name":18,"direction":19},"/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3",[92,99,106],{"__typename":93,"tag":94,"attributes":95},"MetaTagValue","meta",{"__typename":96,"name":97,"content":98},"MetaTagValueAttributes","title","Mojo für den Browser: Hardboiled Webdesign mit HTML5 und CSS3 | Liechtenecker UX Design Studio",{"__typename":100,"tag":101,"attributes":102},"MetaTagLink","link",{"__typename":103,"href":104,"hreflang":13,"rel":105,"media":13,"sizes":13,"type":13},"MetaTagLinkAttributes","http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3","canonical",{"__typename":107,"tag":94,"attributes":108},"MetaTagProperty",{"__typename":109,"property":110,"content":81},"MetaTagPropertyAttributes","og:title",{"__typename":112,"id":113,"name":114,"path":115,"status":20,"weight":116,"description":117,"langcode":121,"changed":122,"metatag":125},"TermCategories","8","UX/UI Design","/kategorie/design",0,{"__typename":118,"processed":119,"format":120},"Text","Themen aus dem Bereich Design &amp; User Experience","wp_html",{"__typename":16,"id":17,"name":18,"direction":19},{"__typename":83,"timestamp":123,"timezone":85,"offset":86,"time":124},1713772777,"2024-04-22T07:59:37+00:00",[126,129,133],{"__typename":93,"tag":94,"attributes":127},{"__typename":96,"name":97,"content":128},"UX/UI Design | Liechtenecker UX Design Studio",{"__typename":93,"tag":94,"attributes":130},{"__typename":96,"name":131,"content":132},"description","Themen aus dem Bereich Design & User Experience",{"__typename":100,"tag":101,"attributes":134},{"__typename":103,"href":135,"hreflang":13,"rel":105,"media":13,"sizes":13,"type":13},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/kategorie/design",[137,142,146,150,154,158],{"__typename":138,"id":139,"name":140,"path":141,"weight":116},"TermTags","79","andy clarke","/tag/andy-clarke",{"__typename":138,"id":143,"name":144,"path":145,"weight":116},"297","css3","/tag/css3",{"__typename":138,"id":147,"name":148,"path":149,"weight":116},"572","hardboiled webdesign","/tag/hardboiled-webdesign",{"__typename":138,"id":151,"name":152,"path":153,"weight":116},"604","html5","/tag/html5",{"__typename":138,"id":155,"name":156,"path":157,"weight":116},"1076","responsive webdesign","/tag/responsive-webdesign",{"__typename":138,"id":159,"name":160,"path":161,"weight":116},"1496","webdesigntrends","/tag/webdesigntrends",{"__typename":163,"processed":164,"format":120,"summary":13},"TextSummary","\u003Cdiv class=\"grid-wrapper\">\n    \u003Cdiv class=\"row\">\n        \u003Cdiv class=\"default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 \">\n            \n\u003Cp>Oft wird erwartet, dass Websites in gängigen Browsern gleich aussehen. Kunden wollen punktgenaue Pixelperfektionen, die sich moderner Technologien bedienen, auf einer wachsenden Vielfalt von Endgeräten korrekt dargestellt werden und am besten auch noch bis IE6 abwärtskompatibel sind. Mit einem Wort: die eierlegende Wollmilchsau.\u003Cbr>\nHier stellt sich allerdings die Frage, ob pixelgenaues Webdesign überhaupt noch zeitgemäß ist. Fakt ist nun einmal, dass Websites mittlerweile auf sehr unterschiedlichen Endgeräten funktionieren müssen. Vom Smartphone, über Tablets bis hin zum 30 Zoll Monitor. Die Vielfalt an Endgeräten und Darstellungsformen (Format, Auflösung, Orientierung, Landscape vs. Portrait Modus) ist so breit gefächert, wie noch nie. Aber macht es überhaupt noch Sinn, pixelgenaue Websites zu konzipieren und deren Umsetzung anzustreben?  Dem User ist es doch im Grunde egal, ob die Darstellung der Website im Internet Explorer von deren Darstellung im Firefox abweicht, solange das Design wiedererkennbar und nutzbar bleibt. In den meisten Fällen werden Abweichungen gar nicht erst wahrgenommen, weil der durchschnittliche User wahrscheinlich kaum eine Website parallel in verschiedenen Browsern betrachtet, um Unterschiede ausfindig zu machen.\u003Cbr>\nViel wichtiger ist doch jener Ansatz, aus jeder Website das Maximum an Experience für den User heraus zu holen, Technologien wie HTML5 und CSS3 auszureizen und das passende Layout mit dem optimalen Design zu kleiden. Die vermittelbare Experience ist natürlich abhängig vom Browser und Endgerät, das stellen wir hier auch nicht in Frage. Auch muss eine Website weiterhin abwärtskompatibel und accessible sein, auch das stellen wir nicht in Frage. Warum aber soll eine Website nicht in der Lage sein, dem User genau das auszuliefern, was den Gegebenheiten des Browser und des Endgeräte gerecht wird? Hier fallen zwei Stichwörter, „Hardboiled Webdesign“ und „Responsive Layouts“.\u003Cbr>\nSowohl in der Konzeptions- als auch Design-Phase wird von vornherein berücksichtigt, welche zusätzliche Experience mittels HTML5 und CSS3 erzeugt und vermittelt werden kann. Natürlich auch mit dem Wissen, dass nicht alle User die gleiche Experience erleben werden. User, die in modernen Browsern und Oberflächen unterwegs sind, werden mit innovativen Features, Effekten und Zuckerl belohnt. Können Browser mit eingesetzten Technologien (noch) nicht umgehen, so wird ihnen eine abgespeckte Variante der Website ausgeliefert. Die Website bzw. das ausgelieferte Erlebnis wird damit nicht nur wesentlich reaktionsfreudiger, sondern kann auch perfekt auf die Gegebenheiten des Users antworten. Das ist Responsive Webdesign. Semantik wird auch weiterhin eine wichtige Rolle spielen,  denn Responsive Webdesign bedeutet auch, den Source-Code schlank zu halten und gut zu strukturieren. Damit bleibt die Struktur und das Markup der Website hochgradig flexibel und kann in unterschiedliche „Einheiten“ verpackt werden. Hello Hardboiled Webdesign!\u003Cbr>\nHardboiled Webdesign bedeutet nichts anders, als dass wir uns weg vom Betrachten und hin zum Erleben einer Website bewegen. Es bedeutet auch, die Gegebenheiten des Users abzufragen, abzufangen und das perfekt zugeschnittene Ergebnis zurückzuliefern. Ein sehr guter Ausgangspunkt für die Umsetzung von Responsive Webdesigns bietet zum Beispiel das \u003Ca href=\"http://html5boilerplate.com/\">HTML5 Boilerplate\u003C/a>, das sich in angepasster Form auch in dem \u003Ca href=\"http://themble.com/bones/\">WordPress Framework Bones\u003C/a> wiederfindet.\u003Cbr>\n\u003Ca href=\"http://html5boilerplate.com/\">\u003Cimg loading=\"lazy\" src=\"http://images.liechtenecker.at/2011/07/html5-boilerplate.jpg\" alt title=\"html5-boilerplate\" width=\"620\" height=\"98\" class=\"alignnone size-full wp-image-2320\">\u003C/a>\u003Cbr>\nDas HTML5 Boilerplate ist ein solides HTML5 Framework mit jQuery Integration, das sich auf die Auslieferung von Responsive Layouts via Media Queries und die Komprimierung von Bildern und CSS-Code spezialisiert. Abgesehen davon wurde das Framework umfassend durch Scripts wie \u003Ca href=\"http://www.modernizr.com/\">Modernizr\u003C/a> und \u003Ca href=\"http://selectivizr.com/\">Selectivizir\u003C/a> erweitert und bietet damit sehr gute Voraussetzungen, um HTML5 und CSS3 Features browserübergreifend implementieren zu können. Aus unserer Sicht bietet das HTML5 Boilerplate eine sehr gute Basis, um ein Maxium an Userexperience aus modernem Webdesign heraus zu holen.\u003Cbr>\nDa wir euch mit diesem Artikel nur einen sehr kleinen Einblick in die Materie geben können, legen wir euch zwei weiterführende Bücher ans Herz:\u003C/p>\n\u003Ch3>„Hardboiled Webdesign“von Andy Clarke\u003C/h3>\n\u003Cp>\u003Ca href=\"http://hardboiledwebdesign.com/\">\u003Cimg loading=\"lazy\" src=\"http://images.liechtenecker.at/2011/07/hardboiled-webdesign-andy-clarke.jpg\" alt title=\"hardboiled-webdesign-andy-clarke\" width=\"620\" height=\"418\" class=\"size-full wp-image-2316\">\u003C/a>\u003C/p>\n\u003Ch3>„Responsive Webdesign“ von Ethan Marcotte\u003C/h3>\n\u003Cp>\u003Ca href=\"http://www.abookapart.com/products/responsive-web-design\">\u003Cimg loading=\"lazy\" src=\"http://images.liechtenecker.at/2011/07/responsive-webdesign.jpg\" alt title=\"responsive-webdesign\" width=\"620\" height=\"463\" class=\"alignnone size-full wp-image-2319\">\u003C/a>\u003Cbr>\nWie sind eure Erfahrungen mit Responsive Webdesign, HTML5 und CSS3?\u003C/p>\n        \u003C/div>\n    \u003C/div>\n\u003C/div>\n\n\n","\u003C!-- This site is optimized with the Yoast SEO plugin v15.7 - https://yoast.com/wordpress/plugins/seo/ -->\n\u003Cmeta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" />\n\u003Clink rel=\"canonical\" href=\"https://liechtenecker.at/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3/\" />\n\u003Cmeta property=\"og:locale\" content=\"de_DE\" />\n\u003Cmeta property=\"og:type\" content=\"article\" />\n\u003Cmeta property=\"og:title\" content=\"Mojo für den Browser: Hardboiled Webdesign mit HTML5 und CSS3 - Liechtenecker\" />\n\u003Cmeta property=\"og:description\" content=\"Oft wird erwartet, dass Websites in gängigen Browsern gleich aussehen. Kunden wollen punktgenaue Pixelperfektionen, die sich moderner Technologien bedienen, auf einer wachsenden Vielfalt von Endgeräten korrekt dargestellt werden und am besten auch noch bis IE6 abwärtskompatibel sind. Mit einem Wort: die eierlegende Wollmilchsau. Hier stellt sich allerdings die Frage, ob pixelgenaues Webdesign überhaupt noch zeitgemäß [&hellip;]\" />\n\u003Cmeta property=\"og:url\" content=\"https://liechtenecker.at/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3/\" />\n\u003Cmeta property=\"og:site_name\" content=\"Liechtenecker\" />\n\u003Cmeta property=\"article:published_time\" content=\"2011-07-18T09:00:28+00:00\" />\n\u003Cmeta property=\"og:image\" content=\"http://images.liechtenecker.at/2011/07/html5-boilerplate.jpg\" />\n\u003Cmeta name=\"twitter:card\" content=\"summary_large_image\" />\n\u003Cmeta name=\"twitter:label1\" content=\"Geschätzte Lesezeit\">\n\t\u003Cmeta name=\"twitter:data1\" content=\"3 Minuten\">\n\u003Cscript type=\"application/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https://liechtenecker.at/#website\",\"url\":\"https://liechtenecker.at/\",\"name\":\"Liechtenecker\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https://liechtenecker.at/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"de-DE\"},{\"@type\":\"ImageObject\",\"@id\":\"https://liechtenecker.at/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3/#primaryimage\",\"inLanguage\":\"de-DE\",\"url\":\"http://images.liechtenecker.at/2011/07/html5-boilerplate.jpg\"},{\"@type\":\"WebPage\",\"@id\":\"https://liechtenecker.at/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3/#webpage\",\"url\":\"https://liechtenecker.at/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3/\",\"name\":\"Mojo f\\u00fcr den Browser: Hardboiled Webdesign mit HTML5 und CSS3 - Liechtenecker\",\"isPartOf\":{\"@id\":\"https://liechtenecker.at/#website\"},\"primaryImageOfPage\":{\"@id\":\"https://liechtenecker.at/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3/#primaryimage\"},\"datePublished\":\"2011-07-18T09:00:28+00:00\",\"dateModified\":\"2011-07-18T09:00:28+00:00\",\"author\":{\"@id\":\"https://liechtenecker.at/#/schema/person/663b2d5142421ab394bf325c1b48cecf\"},\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https://liechtenecker.at/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3/\"]}]},{\"@type\":\"Person\",\"@id\":\"https://liechtenecker.at/#/schema/person/663b2d5142421ab394bf325c1b48cecf\",\"name\":\"Stephan\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https://liechtenecker.at/#personlogo\",\"inLanguage\":\"de-DE\",\"url\":\"https://secure.gravatar.com/avatar/400d5f8c531afb609b81aa66c8d56f01?s=96&d=mm&r=g\",\"caption\":\"Stephan\"}}]}\u003C/script>\n\u003C!-- / Yoast SEO plugin. -->",{"__typename":167,"id":168,"myRole":169,"name":170,"nickname":171},"User","23","langgedienter Frontend-Veteran","s-fletzberger","Stephan",{"latestKnowhow":173},[174,192,205],{"__typename":79,"id":175,"title":176,"path":177,"wpTeaserText":178,"wpPromotedTeaserImage":13,"wpHeaderImage":179},"1619","Behind the scenes: Ein Barrierefreiheits-Audit","/blog/behind-scenes-ein-barrierefreiheits-audit","”Entspricht unsere Website den gesetzlichen Anforderungen und wenn nicht, was genau müssen wir ändern?”\r\nDiese Frage lieben wir. Echt! Und so sieht unsere Antwort aus.",{"__typename":180,"id":181,"excludeFromScreenreader":13,"mediaImage":182,"name":190,"path":191,"status":20},"MediaImage","3364",{"__typename":183,"url":184,"width":185,"height":186,"alt":187,"title":13,"size":188,"mime":189},"Image","http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/2026-04/Headerbilder%20Blogartikel%20Behind%20the%20scene%20Accessibility%20Audit.jpg",2880,1300,"Headline mit Sujet: Tastatur mit Symbolen für Barrierefreiheit im Fokus auf hellem  Hintergrund",838204,"image/jpeg","Headerbilder Blogartikel Behind the scene Accessibility Audit.jpg","/media/3364/edit",{"__typename":79,"id":193,"title":194,"path":195,"wpTeaserText":196,"wpPromotedTeaserImage":13,"wpHeaderImage":197},"1616","Agentic KI trifft Design-System: Wie unser Presentation Maker entstand.","/blog/agentic-ki-trifft-design-system-wie-unser-presentation-maker-entstand","Nein, wir wollen euch jetzt nicht erzählen, was KI alles kann. Aber wir möchten euch zeigen, wie wir mit KI umgehen. \r\n",{"__typename":180,"id":198,"excludeFromScreenreader":13,"mediaImage":199,"name":203,"path":204,"status":20},"3355",{"__typename":183,"url":200,"width":185,"height":186,"alt":201,"title":13,"size":202,"mime":189},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/2026-03/BLOG_Presentation%20Tool_TITEL-2880x1300px_1.jpg","Lukas und Daniel  arbeiten an Computern im Büro.",2621988,"BLOG_Presentation Tool_TITEL-2880x1300px.jpg","/media/3355/edit",{"__typename":79,"id":206,"title":207,"path":208,"wpTeaserText":13,"wpPromotedTeaserImage":13,"wpHeaderImage":209},"1606","UI Trends 2026","/blog/ui-trends-2026",{"__typename":180,"id":210,"excludeFromScreenreader":21,"mediaImage":211,"name":215,"path":216,"status":20},"3303",{"__typename":183,"url":212,"width":185,"height":186,"alt":213,"title":13,"size":214,"mime":189},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/2026-01/BLOG_Trendbericht%202026.jpg","UI Trends 2026, gelber Hintergrund, schwarze Schrift.",4700748,"BLOG_Trendbericht 2026.jpg","/media/3303/edit",{"Language:de":218,"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1":219,"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c":223,"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c":226,"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741":229,"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a":232,"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5":235,"Menu:nuxt-main-menu":238,"ROOT_QUERY":252,"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e":268,"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195":271,"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db":274,"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d":277,"Menu:footer":280,"TermCategories:8":290,"TermTags:79":301,"TermTags:297":302,"TermTags:572":303,"TermTags:604":304,"TermTags:1076":305,"TermTags:1496":306,"User:23":307,"NodeWpPost:1159":308,"MediaImage:3364":337,"NodeWpPost:1619":339,"MediaImage:3355":342,"NodeWpPost:1616":344,"MediaImage:3303":347,"NodeWpPost:1606":349},["null","__typename",16,"id",17,"name",18,"direction",19],["null","__typename",10,"id",11,"title",12,"description",13,"url",14,"langcode",220,"internal",20,"expanded",21,"attributes",222],{"__ref":221},"Language:de",["null","__typename",23,"class",13],["null","__typename",10,"id",25,"title",26,"description",13,"url",27,"langcode",224,"internal",20,"expanded",21,"attributes",225],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",10,"id",30,"title",31,"description",13,"url",32,"langcode",227,"internal",20,"expanded",21,"attributes",228],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",10,"id",35,"title",36,"description",13,"url",37,"langcode",230,"internal",20,"expanded",21,"attributes",231],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",10,"id",40,"title",41,"description",13,"url",42,"langcode",233,"internal",20,"expanded",21,"attributes",234],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",10,"id",45,"title",46,"description",13,"url",47,"langcode",236,"internal",20,"expanded",21,"attributes",237],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",5,"id",6,"name",7,"items",239],[240,242,244,246,248,250],{"__ref":241},"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1",{"__ref":243},"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c",{"__ref":245},"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c",{"__ref":247},"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741",{"__ref":249},"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a",{"__ref":251},"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5",["null","__typename",253,"menu({\"name\":\"NUXT_MAIN_MENU\"})",254,"menu({\"name\":\"FOOTER\"})",256,"route({\"path\":\"/blog/mojo-fur-den-browser-hardboiled-webdesign-mit-html5-und-css3\"})",258,"latestKnowhow({\"excludeId\":\"1159\",\"limit\":3})",261],"Query",{"__ref":255},"Menu:nuxt-main-menu",{"__ref":257},"Menu:footer",["null","__typename",77,"entity",259],{"__ref":260},"NodeWpPost:1159",[262,264,266],{"__ref":263},"NodeWpPost:1619",{"__ref":265},"NodeWpPost:1616",{"__ref":267},"NodeWpPost:1606",["null","__typename",10,"id",55,"title",56,"description",13,"url",57,"langcode",269,"internal",20,"expanded",21,"attributes",270],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",10,"id",61,"title",62,"description",13,"url",63,"langcode",272,"internal",20,"expanded",21,"attributes",273],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",10,"id",66,"title",67,"description",13,"url",68,"langcode",275,"internal",20,"expanded",21,"attributes",276],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",10,"id",71,"title",72,"description",13,"url",73,"langcode",278,"internal",21,"expanded",21,"attributes",279],{"__ref":221},["null","__typename",23,"class",13],["null","__typename",5,"id",51,"name",52,"items",281],[282,284,286,288],{"__ref":283},"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e",{"__ref":285},"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195",{"__ref":287},"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db",{"__ref":289},"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d",["null","__typename",112,"id",113,"name",114,"path",115,"status",20,"weight",116,"description",291,"langcode",292,"changed",293,"metatag",294],["null","__typename",118,"processed",119,"format",120],{"__ref":221},["null","__typename",83,"timestamp",123,"timezone",85,"offset",86,"time",124],[295,297,299],["null","__typename",93,"tag",94,"attributes",296],["null","__typename",96,"name",97,"content",128],["null","__typename",93,"tag",94,"attributes",298],["null","__typename",96,"name",131,"content",132],["null","__typename",100,"tag",101,"attributes",300],["null","__typename",103,"href",135,"hreflang",13,"rel",105,"media",13,"sizes",13,"type",13],["null","__typename",138,"id",139,"name",140,"path",141,"weight",116],["null","__typename",138,"id",143,"name",144,"path",145,"weight",116],["null","__typename",138,"id",147,"name",148,"path",149,"weight",116],["null","__typename",138,"id",151,"name",152,"path",153,"weight",116],["null","__typename",138,"id",155,"name",156,"path",157,"weight",116],["null","__typename",138,"id",159,"name",160,"path",161,"weight",116],["null","__typename",167,"id",168,"myRole",169,"name",170,"nickname",171],["null","__typename",79,"id",80,"title",81,"changed",309,"created",310,"langcode",311,"path",90,"promote",21,"status",20,"sticky",21,"metatag",312,"category",319,"contentElements",13,"evergreen",13,"tags",321,"wpBody",334,"wpHeaderImage",13,"wpHeaderImageOld",13,"wpHeaderImageOldSmall",13,"wpOgImage",13,"wpPromotedTeaserImage",13,"wpShareDescription",13,"wpShareTitle",13,"wpTeaserText",13,"wpYoastHead",165,"author",335],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],{"__ref":221},[313,315,317],["null","__typename",93,"tag",94,"attributes",314],["null","__typename",96,"name",97,"content",98],["null","__typename",100,"tag",101,"attributes",316],["null","__typename",103,"href",104,"hreflang",13,"rel",105,"media",13,"sizes",13,"type",13],["null","__typename",107,"tag",94,"attributes",318],["null","__typename",109,"property",110,"content",81],{"__ref":320},"TermCategories:8",[322,324,326,328,330,332],{"__ref":323},"TermTags:79",{"__ref":325},"TermTags:297",{"__ref":327},"TermTags:572",{"__ref":329},"TermTags:604",{"__ref":331},"TermTags:1076",{"__ref":333},"TermTags:1496",["null","__typename",163,"processed",164,"format",120,"summary",13],{"__ref":336},"User:23",["null","__typename",180,"id",181,"excludeFromScreenreader",13,"mediaImage",338,"name",190,"path",191,"status",20],["null","__typename",183,"url",184,"width",185,"height",186,"alt",187,"title",13,"size",188,"mime",189],["null","__typename",79,"id",175,"title",176,"path",177,"wpTeaserText",178,"wpPromotedTeaserImage",13,"wpHeaderImage",340],{"__ref":341},"MediaImage:3364",["null","__typename",180,"id",198,"excludeFromScreenreader",13,"mediaImage",343,"name",203,"path",204,"status",20],["null","__typename",183,"url",200,"width",185,"height",186,"alt",201,"title",13,"size",202,"mime",189],["null","__typename",79,"id",193,"title",194,"path",195,"wpTeaserText",196,"wpPromotedTeaserImage",13,"wpHeaderImage",345],{"__ref":346},"MediaImage:3355",["null","__typename",180,"id",210,"excludeFromScreenreader",21,"mediaImage",348,"name",215,"path",216,"status",20],["null","__typename",183,"url",212,"width",185,"height",186,"alt",213,"title",13,"size",214,"mime",189],["null","__typename",79,"id",206,"title",207,"path",208,"wpTeaserText",13,"wpPromotedTeaserImage",13,"wpHeaderImage",350],{"__ref":351},"MediaImage:3303"]