[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"btz8hO-MXSFLpybqvfjYVBre4OvrEJO1wFySe3Zmv-s":3,"9_t0YFtO844PW3-iCfPxRTbw8yv0-2zzu2bChZFenjo":39,"_ac7ZFYA4ikjDsOApnt-65in8iQ6aCilX56h7EfIpOM":75,"M7IvqGJ7T6afK9z4k9DVDnzjNEck8KyAmKd5zEfGjT4":160,"_apollo:default":205},{"menu":4},{"__typename":5,"id":6,"name":7,"items":8},"Menu","footer","Fußzeile",[9,24,29,34],{"__typename":10,"id":11,"title":12,"description":13,"url":14,"langcode":15,"internal":20,"expanded":21,"attributes":22},"MenuItem","e2873307-b50a-4aab-b6b2-1950fd99c72e","Impressum",null,"/impressum",{"__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},"2cd9b7c9-142a-4ea3-b898-a0952c54a195","Datenschutz","/datenschutz",{"__typename":23,"class":13},{"__typename":10,"id":30,"title":31,"description":13,"url":32,"langcode":15,"internal":20,"expanded":21,"attributes":33},"a5effba3-5a8c-4125-8d78-0cdba09824db","AGB","/agb",{"__typename":23,"class":13},{"__typename":10,"id":35,"title":36,"description":13,"url":37,"langcode":15,"internal":21,"expanded":21,"attributes":38},"114bf071-bdbb-44cf-85c1-69e9d9e0777d","Newsletter","https://liechtenecker.at/newsletter-subscribe",{"__typename":23,"class":13},{"menu":40},{"__typename":5,"id":41,"name":42,"items":43},"nuxt-main-menu","Nuxt Hauptmenü",[44,50,55,60,65,70],{"__typename":10,"id":45,"title":46,"description":13,"url":47,"langcode":48,"internal":20,"expanded":21,"attributes":49},"9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1","Blog","/know-how",{"__typename":16,"id":17,"name":18,"direction":19},{"__typename":23,"class":13},{"__typename":10,"id":51,"title":52,"description":13,"url":53,"langcode":48,"internal":20,"expanded":21,"attributes":54},"1c7a5430-8a42-4b24-9544-252adabc2f4c","Projekte","/projekte",{"__typename":23,"class":13},{"__typename":10,"id":56,"title":57,"description":13,"url":58,"langcode":48,"internal":20,"expanded":21,"attributes":59},"9c4feedc-79e4-4fbf-b68c-065f33ebfe4c","Sparring","/workshop-ux-sparring-fuer-unternehmen",{"__typename":23,"class":13},{"__typename":10,"id":61,"title":62,"description":13,"url":63,"langcode":48,"internal":20,"expanded":21,"attributes":64},"3b77a27b-272a-489f-843e-53e23ed07741","Trainings","/liechtenecker-ux-academy",{"__typename":23,"class":13},{"__typename":10,"id":66,"title":67,"description":13,"url":68,"langcode":48,"internal":20,"expanded":21,"attributes":69},"ce0bb82b-e1ee-4036-be95-f693a62e9f4a","Über uns","/about",{"__typename":23,"class":13},{"__typename":10,"id":71,"title":72,"description":13,"url":73,"langcode":48,"internal":20,"expanded":21,"attributes":74},"04a19381-81a9-4694-8653-182d8855d2b5","Kontakt","/kontakt",{"__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":150,"wpHeaderImage":13,"wpHeaderImageOld":13,"wpHeaderImageOldSmall":13,"wpOgImage":13,"wpPromotedTeaserImage":13,"wpShareDescription":13,"wpShareTitle":13,"wpTeaserText":13,"wpYoastHead":153,"author":154},"NodeWpPost","1044","Element Queries",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},"DateTime",1372322052,"UTC","+00:00","2013-06-27T08:34:12+00:00",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},{"__typename":16,"id":17,"name":18,"direction":19},"/blog/element-queries",[92,99,106],{"__typename":93,"tag":94,"attributes":95},"MetaTagValue","meta",{"__typename":96,"name":97,"content":98},"MetaTagValueAttributes","title","Element Queries | 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/element-queries","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],{"__typename":138,"id":139,"name":140,"path":141,"weight":116},"TermTags","295","CSS","/tag/css",{"__typename":138,"id":143,"name":144,"path":145,"weight":116},"782","media queries","/tag/media-queries",{"__typename":138,"id":147,"name":148,"path":149,"weight":116},"1076","responsive webdesign","/tag/responsive-webdesign",{"__typename":151,"processed":152,"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\u003Ca href=\"/sites/default/files/styles/full_width/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg?itok=z5ArpnQT\" data-rel=\"lightbox-gallery-gVjQJQQt\" data-rl_title data-rl_caption title class=\"js-image-link\">\u003Cdiv alt=\"element-queries\" data-entity-type=\"media\" data-entity-uuid=\"d017b392-bb45-40c4-9da2-8ff68a6a1e33\" data-langcode=\"de\" class=\"embedded-entity\">\u003Cdiv>\n  \n  \n  \u003Cdiv>\n    \u003Cdiv class=\"visually-hidden\">Bild\u003C/div>\n              \u003Cdiv>    \u003Cpicture>\n                  \u003Csource srcset=\"/sites/default/files/styles/image_width_medium/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=WaDHWiUS 1x, /sites/default/files/styles/image_width_medium_x2/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=V90MeWAC 2x\" media=\"all and (min-width: 1024px) and (max-width: 1439px)\" type=\"image/webp\" width=\"900\" height=\"400\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_small/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=7gB9wDSI 1x, /sites/default/files/styles/image_width_small_x2/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=LSyTrJ8Q 2x\" media=\"all and (min-width: 745px) and (max-width: 1023px)\" type=\"image/webp\" width=\"900\" height=\"400\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xsmall/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=AGymlGbA 1x, /sites/default/files/styles/image_width_xsmall_x2/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=fBYEr8zC 2x\" media=\"all and (min-width: 480px) and (max-width: 744px)\" type=\"image/webp\" width=\"745\" height=\"331\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xxsmall/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=Doqan4Ky 1x, /sites/default/files/styles/image_width_xxsmall_x2/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=riSmaQL7 2x\" media=\"all and (max-width: 479px)\" type=\"image/webp\" width=\"480\" height=\"213\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_large/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=gL-wzTWd 1x, /sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.webp?itok=Q5huE5Dn 2x\" type=\"image/webp\" width=\"900\" height=\"400\">\n                  \u003Cimg loading=\"lazy\" width=\"900\" height=\"400\" src=\"/sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2013/06/element-queries11-1.jpg.jpg?itok=Q5huE5Dn\" alt=\"element-queries\" title=\"element-queries\">\n\n  \u003C/picture>\n\n\u003C/div>\n          \u003C/div>\n\n\u003C/div>\n\u003C/div>\n\u003C/a>\u003Cp>Wie ihr bereits wisst: wir lieben \u003Ca title=\"Responsive Webdesign\" href=\"/responsive-webdesign-die-basics/\" target=\"_blank\" rel=\"noopener noreferrer\">responsive Webdesign\u003C/a>! Bestehend aus fluid Grids und CSS Media Queries hat dieser Trend das Web und uns im Nu erobert. Aber neben all den positiven Eigenschaten gehen die negativen oft unter. Einer davon sind Media Queries.\u003Cbr>\n\u003C/p>\n\u003Ch3>Das Problem mit Media Queries\u003C/h3>\n\u003Cp>Media Queries sind ein Hack! Sie sind ein Mittel zum Zweck. Klar, diesen erfüllen sie sehr gut, aber sie wurden nicht für Responsive Webdesign geschaffen. Woran das liegt jetzt schauen wir uns jetzt genauer an.\u003Cbr>\nMedia Queries beziehen sich auf die Größe des Browserfensters. Elemente werden auf Grund der Größe dieses Fensters geändert. Ein Kalender wird zum Beispiel ab einer Browser-Breite von unter 320px in eine vertikale Liste umgewandelt um Platz zu sparen. Super einfach und praktisch, aber derzeit nicht modular umsetzbar.\u003Cbr>\nBei modularer Programmierung geht es darum Code einmal zu schreiben und überall zu verwenden. So ersparen wir uns unnötigen Codezeilen und die Adaptierung muss bei Änderungen nur an einer Stelle gemacht werden. So sollten und wollen wir arbeiten.\u003Cbr>\nDas Problem tritt auf wenn der Kalender auch anders im Layout eingesetzt wird. Beispiel hierfür wäre eine Sidebar. Dessen Breite ist entscheidend und nicht die des Browsers. Zur Zeit würden wir hier den Kalendar in der Sidebar extra ansprechen, wie es in folgendem Beispiel mit der Modifier-Klasse “calendar–mini” zu sehen ist.\u003Cbr>\n[code language=“css“].calendar li {\u003Cbr>\n  display: block;\u003Cbr>\n}\u003Cbr>\n@media all and (min-width: 480px) {\u003Cbr>\n  .calendar li {\u003Cbr>\n    float: left;\u003Cbr>\n   }\u003Cbr>\n}\u003Cbr>\n.calendar–mini li {\u003Cbr>\n    display: block;\u003Cbr>\n}\u003Cbr>\n[/code]\u003Cbr>\nEs funktioniert, aber es ist nicht gerade schön. Also was könnte uns hier helfen um wirklich modular zu arbeiten?\u003C/p>\n\u003Ch3>Die Lösung heißt Element Queries\u003C/h3>\n\u003Cp>Eine zur Zeit heiß diskutierte Lösung wären Element Queries. Diese beziehen sich im Gegensatz zu Media Queries auf das worauf es wirklich ankommt: Elemente. Diese werden mit einem Selektor und einer Bedingung angesprochen. Die Handhabung ist simpel, aber schauen wir uns gleich ein Beispiel an.\u003Cbr>\n[code language=“css“].mainnav (min-width: 400px) {\u003Cbr>\n    display: block;\u003Cbr>\n}\u003Cbr>\n[/code]\u003Cbr>\nSobald die Navigation eine Größe von mindestens 400px erreicht, wird diese angezeigt. Im Fall von unserem Kalender würde ein Element Query so aussehen können:\u003Cbr>\n[code language=“css“].calendar (min-width: 500px) &gt; li {\u003Cbr>\n    flaot: left;\u003Cbr>\n}\u003Cbr>\n[/code]\u003Cbr>\nIn dem wir unsere Bedingung mit dem Element selbst koppeln, sind wir unabhängig von der Browser Größe und damit auch dem Layout. Es ist jetzt egal ob der Kalander in der Sdiebar oder sonst wo vorkommt. Er passt sich je nach dem ihm zur Verfügung stehenden Platz an. Jetzt ist unser Code auch modular, denn wir müssen ihn nur einmal schreiben und können unseren Kalender überall verwenden. Genial!\u003C/p>\n\u003Ch3>Realität\u003C/h3>\n\u003Cp>So wo ist der Haken? Wie ihr euch vielleicht schon gedacht habt sind wir hier noch sehr weit von der Realität entfernt. Bist jetzt wird nur darüber diskutiert und man kann nicht davon ausgehen Element Queries in nächster Zeit verwenden zu können. Trotzdem interessant ist aber ein \u003Ca title=\"JavaScript Element Queries Polyfill\" href=\"https://github.com/tysonmatanich/elementQuery\" target=\"_blank\" rel=\"noopener noreferrer\">JavaScript Element Query Polyfill\u003C/a> von Tyson Matanich. &nbsp;Hiermit kann man sich schon jetzt mit dem Thema praktisch beschäftigen und die Vorteile testen.\u003Cbr>\nWeiters sind in Bezug auf Element Queries auch noch einige Punkte ungeklärt. Würde man z.B. die Größe eines Elements selbst ändern, greift die Bedingung nicht mehr.\u003Cbr>\n[code language=“css“].element (min-width: 500px) {\u003Cbr>\n    width: 200px;\u003Cbr>\n}\u003Cbr>\n[/code]\u003Cbr>\nZu lange haben wir Media Queries blind vertraut ohne deren Zweck und Sinnhaftigkeit zu hinterfragen. Der Wunsch nach einer neuen Art von Queries wird auf jeden Fall immer stärker und wir können gespannt sein was uns hier noch erwartet. Klar ist, dass es hier Bedarf an Verbesserungen gibt und Element Queries ein guter Ansatz in die richtige Richtung sind.\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://legacy.liechtenecker.dev/blog/element-queries/\" />\n\u003Cmeta property=\"og:locale\" content=\"de_DE\" />\n\u003Cmeta property=\"og:type\" content=\"article\" />\n\u003Cmeta property=\"og:title\" content=\"Element Queries - Liechtenecker\" />\n\u003Cmeta property=\"og:description\" content=\"Wie ihr bereits wisst: wir lieben responsive Webdesign! Bestehend aus fluid Grids und CSS Media Queries hat dieser Trend das Web und uns im Nu erobert. Aber neben all den positiven Eigenschaten gehen die negativen oft unter. Einer davon sind Media Queries. Das Problem mit Media Queries Media Queries sind ein Hack! Sie sind ein [&hellip;]\" />\n\u003Cmeta property=\"og:url\" content=\"https://legacy.liechtenecker.dev/blog/element-queries/\" />\n\u003Cmeta property=\"og:site_name\" content=\"Liechtenecker\" />\n\u003Cmeta property=\"article:published_time\" content=\"2013-06-27T10:34:12+00:00\" />\n\u003Cmeta property=\"og:image\" content=\"https://legacy.liechtenecker.dev/wp-content/uploads/2013/06/element-queries11-1.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://legacy.liechtenecker.dev/#website\",\"url\":\"https://legacy.liechtenecker.dev/\",\"name\":\"Liechtenecker\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https://legacy.liechtenecker.dev/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"de-DE\"},{\"@type\":\"ImageObject\",\"@id\":\"https://legacy.liechtenecker.dev/blog/element-queries/#primaryimage\",\"inLanguage\":\"de-DE\",\"url\":\"https://legacy.liechtenecker.dev/wp-content/uploads/2013/06/element-queries11-1.jpg\",\"width\":900,\"height\":400},{\"@type\":\"WebPage\",\"@id\":\"https://legacy.liechtenecker.dev/blog/element-queries/#webpage\",\"url\":\"https://legacy.liechtenecker.dev/blog/element-queries/\",\"name\":\"Element Queries - Liechtenecker\",\"isPartOf\":{\"@id\":\"https://legacy.liechtenecker.dev/#website\"},\"primaryImageOfPage\":{\"@id\":\"https://legacy.liechtenecker.dev/blog/element-queries/#primaryimage\"},\"datePublished\":\"2013-06-27T10:34:12+00:00\",\"dateModified\":\"2013-06-27T10:34:12+00:00\",\"author\":{\"@id\":\"https://legacy.liechtenecker.dev/#/schema/person/c6a4fab1680ccc1ec0ed63179501b4b1\"},\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https://legacy.liechtenecker.dev/blog/element-queries/\"]}]},{\"@type\":\"Person\",\"@id\":\"https://legacy.liechtenecker.dev/#/schema/person/c6a4fab1680ccc1ec0ed63179501b4b1\",\"name\":\"Christoph Rumpel\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https://legacy.liechtenecker.dev/#personlogo\",\"inLanguage\":\"de-DE\",\"url\":\"https://secure.gravatar.com/avatar/3191eb8b348673db049a15f94835ba83?s=96&d=mm&r=g\",\"caption\":\"Christoph Rumpel\"}}]}\u003C/script>\n\u003C!-- / Yoast SEO plugin. -->",{"__typename":155,"id":156,"myRole":157,"name":158,"nickname":159},"User","4","-","c-rumpel","Christoph Rumpel",{"latestKnowhow":161},[162,180,193],{"__typename":79,"id":163,"title":164,"path":165,"wpTeaserText":166,"wpPromotedTeaserImage":13,"wpHeaderImage":167},"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":168,"id":169,"excludeFromScreenreader":13,"mediaImage":170,"name":178,"path":179,"status":20},"MediaImage","3364",{"__typename":171,"url":172,"width":173,"height":174,"alt":175,"title":13,"size":176,"mime":177},"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":181,"title":182,"path":183,"wpTeaserText":184,"wpPromotedTeaserImage":13,"wpHeaderImage":185},"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":168,"id":186,"excludeFromScreenreader":13,"mediaImage":187,"name":191,"path":192,"status":20},"3355",{"__typename":171,"url":188,"width":173,"height":174,"alt":189,"title":13,"size":190,"mime":177},"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":194,"title":195,"path":196,"wpTeaserText":13,"wpPromotedTeaserImage":13,"wpHeaderImage":197},"1606","UI Trends 2026","/blog/ui-trends-2026",{"__typename":168,"id":198,"excludeFromScreenreader":21,"mediaImage":199,"name":203,"path":204,"status":20},"3303",{"__typename":171,"url":200,"width":173,"height":174,"alt":201,"title":13,"size":202,"mime":177},"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":206,"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e":207,"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195":211,"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db":214,"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d":217,"Menu:footer":220,"ROOT_QUERY":230,"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1":246,"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c":249,"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c":252,"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741":255,"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a":258,"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5":261,"Menu:nuxt-main-menu":264,"TermCategories:8":278,"TermTags:295":289,"TermTags:782":290,"TermTags:1076":291,"User:4":292,"NodeWpPost:1044":293,"MediaImage:3364":316,"NodeWpPost:1619":318,"MediaImage:3355":321,"NodeWpPost:1616":323,"MediaImage:3303":326,"NodeWpPost:1606":328},["null","__typename",16,"id",17,"name",18,"direction",19],["null","__typename",10,"id",11,"title",12,"description",13,"url",14,"langcode",208,"internal",20,"expanded",21,"attributes",210],{"__ref":209},"Language:de",["null","__typename",23,"class",13],["null","__typename",10,"id",25,"title",26,"description",13,"url",27,"langcode",212,"internal",20,"expanded",21,"attributes",213],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",10,"id",30,"title",31,"description",13,"url",32,"langcode",215,"internal",20,"expanded",21,"attributes",216],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",10,"id",35,"title",36,"description",13,"url",37,"langcode",218,"internal",21,"expanded",21,"attributes",219],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",5,"id",6,"name",7,"items",221],[222,224,226,228],{"__ref":223},"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e",{"__ref":225},"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195",{"__ref":227},"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db",{"__ref":229},"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d",["null","__typename",231,"menu({\"name\":\"FOOTER\"})",232,"menu({\"name\":\"NUXT_MAIN_MENU\"})",234,"route({\"path\":\"/blog/element-queries\"})",236,"latestKnowhow({\"excludeId\":\"1044\",\"limit\":3})",239],"Query",{"__ref":233},"Menu:footer",{"__ref":235},"Menu:nuxt-main-menu",["null","__typename",77,"entity",237],{"__ref":238},"NodeWpPost:1044",[240,242,244],{"__ref":241},"NodeWpPost:1619",{"__ref":243},"NodeWpPost:1616",{"__ref":245},"NodeWpPost:1606",["null","__typename",10,"id",45,"title",46,"description",13,"url",47,"langcode",247,"internal",20,"expanded",21,"attributes",248],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",10,"id",51,"title",52,"description",13,"url",53,"langcode",250,"internal",20,"expanded",21,"attributes",251],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",10,"id",56,"title",57,"description",13,"url",58,"langcode",253,"internal",20,"expanded",21,"attributes",254],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",10,"id",61,"title",62,"description",13,"url",63,"langcode",256,"internal",20,"expanded",21,"attributes",257],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",10,"id",66,"title",67,"description",13,"url",68,"langcode",259,"internal",20,"expanded",21,"attributes",260],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",10,"id",71,"title",72,"description",13,"url",73,"langcode",262,"internal",20,"expanded",21,"attributes",263],{"__ref":209},["null","__typename",23,"class",13],["null","__typename",5,"id",41,"name",42,"items",265],[266,268,270,272,274,276],{"__ref":267},"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1",{"__ref":269},"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c",{"__ref":271},"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c",{"__ref":273},"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741",{"__ref":275},"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a",{"__ref":277},"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5",["null","__typename",112,"id",113,"name",114,"path",115,"status",20,"weight",116,"description",279,"langcode",280,"changed",281,"metatag",282],["null","__typename",118,"processed",119,"format",120],{"__ref":209},["null","__typename",83,"timestamp",123,"timezone",85,"offset",86,"time",124],[283,285,287],["null","__typename",93,"tag",94,"attributes",284],["null","__typename",96,"name",97,"content",128],["null","__typename",93,"tag",94,"attributes",286],["null","__typename",96,"name",131,"content",132],["null","__typename",100,"tag",101,"attributes",288],["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",155,"id",156,"myRole",157,"name",158,"nickname",159],["null","__typename",79,"id",80,"title",81,"changed",294,"created",295,"langcode",296,"path",90,"promote",21,"status",20,"sticky",21,"metatag",297,"category",304,"contentElements",13,"evergreen",13,"tags",306,"wpBody",313,"wpHeaderImage",13,"wpHeaderImageOld",13,"wpHeaderImageOldSmall",13,"wpOgImage",13,"wpPromotedTeaserImage",13,"wpShareDescription",13,"wpShareTitle",13,"wpTeaserText",13,"wpYoastHead",153,"author",314],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],{"__ref":209},[298,300,302],["null","__typename",93,"tag",94,"attributes",299],["null","__typename",96,"name",97,"content",98],["null","__typename",100,"tag",101,"attributes",301],["null","__typename",103,"href",104,"hreflang",13,"rel",105,"media",13,"sizes",13,"type",13],["null","__typename",107,"tag",94,"attributes",303],["null","__typename",109,"property",110,"content",81],{"__ref":305},"TermCategories:8",[307,309,311],{"__ref":308},"TermTags:295",{"__ref":310},"TermTags:782",{"__ref":312},"TermTags:1076",["null","__typename",151,"processed",152,"format",120,"summary",13],{"__ref":315},"User:4",["null","__typename",168,"id",169,"excludeFromScreenreader",13,"mediaImage",317,"name",178,"path",179,"status",20],["null","__typename",171,"url",172,"width",173,"height",174,"alt",175,"title",13,"size",176,"mime",177],["null","__typename",79,"id",163,"title",164,"path",165,"wpTeaserText",166,"wpPromotedTeaserImage",13,"wpHeaderImage",319],{"__ref":320},"MediaImage:3364",["null","__typename",168,"id",186,"excludeFromScreenreader",13,"mediaImage",322,"name",191,"path",192,"status",20],["null","__typename",171,"url",188,"width",173,"height",174,"alt",189,"title",13,"size",190,"mime",177],["null","__typename",79,"id",181,"title",182,"path",183,"wpTeaserText",184,"wpPromotedTeaserImage",13,"wpHeaderImage",324],{"__ref":325},"MediaImage:3355",["null","__typename",168,"id",198,"excludeFromScreenreader",21,"mediaImage",327,"name",203,"path",204,"status",20],["null","__typename",171,"url",200,"width",173,"height",174,"alt",201,"title",13,"size",202,"mime",177],["null","__typename",79,"id",194,"title",195,"path",196,"wpTeaserText",13,"wpPromotedTeaserImage",13,"wpHeaderImage",329],{"__ref":330},"MediaImage:3303"]