[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"9_t0YFtO844PW3-iCfPxRTbw8yv0-2zzu2bChZFenjo":3,"btz8hO-MXSFLpybqvfjYVBre4OvrEJO1wFySe3Zmv-s":49,"woJmejaObDWkTAnCN3LejaAvD3_tuHc8awKViP5X_sg":75,"6D769I_TN8PfO4rcXiFGlNIrgSWV-aJGJCY8BQdWao4":164,"_apollo:default":209},{"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":154,"wpHeaderImage":13,"wpHeaderImageOld":13,"wpHeaderImageOldSmall":13,"wpOgImage":13,"wpPromotedTeaserImage":13,"wpShareDescription":13,"wpShareTitle":13,"wpTeaserText":13,"wpYoastHead":157,"author":158},"NodeWpPost","1051","Optimierungen von Webseiten für mobile Devices",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},"DateTime",1369804052,"UTC","+00:00","2013-05-29T05:07:32+00:00",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},{"__typename":16,"id":17,"name":18,"direction":19},"/blog/optimierungen-von-webseiten-fur-mobile-devices",[92,99,106],{"__typename":93,"tag":94,"attributes":95},"MetaTagValue","meta",{"__typename":96,"name":97,"content":98},"MetaTagValueAttributes","title","Optimierungen von Webseiten für mobile Devices | 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/optimierungen-von-webseiten-fur-mobile-devices","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],{"__typename":138,"id":139,"name":140,"path":141,"weight":116},"TermTags","822","mobile optimierung","/tag/mobile-optimierung",{"__typename":138,"id":143,"name":144,"path":145,"weight":116},"895","nui","/tag/nui",{"__typename":138,"id":147,"name":148,"path":149,"weight":116},"1076","responsive webdesign","/tag/responsive-webdesign",{"__typename":138,"id":151,"name":152,"path":153,"weight":116},"1331","touch","/tag/touch",{"__typename":155,"processed":156,"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\u003Cdiv alt=\"device\" data-entity-type=\"media\" data-entity-uuid=\"e3ab90c8-4307-42c4-9fa0-9cab2f268905\" 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/05/device11-1.jpg.webp?itok=Fk0cA0MQ 1x, /sites/default/files/styles/image_width_medium_x2/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=Z-TlMq56 2x\" media=\"all and (min-width: 1024px) and (max-width: 1439px)\" type=\"image/webp\" width=\"1000\" height=\"527\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_small/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=lE7AdZZF 1x, /sites/default/files/styles/image_width_small_x2/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=YPu4t_zM 2x\" media=\"all and (min-width: 745px) and (max-width: 1023px)\" type=\"image/webp\" width=\"1000\" height=\"527\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xsmall/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=gUQgnQ9n 1x, /sites/default/files/styles/image_width_xsmall_x2/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=StFnxUwj 2x\" media=\"all and (min-width: 480px) and (max-width: 744px)\" type=\"image/webp\" width=\"745\" height=\"393\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xxsmall/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=-xwbsCss 1x, /sites/default/files/styles/image_width_xxsmall_x2/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=pH1Eb_QQ 2x\" media=\"all and (max-width: 479px)\" type=\"image/webp\" width=\"480\" height=\"253\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_large/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=R7jw5XF6 1x, /sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.webp?itok=EiZTkBuA 2x\" type=\"image/webp\" width=\"1000\" height=\"527\">\n                  \u003Cimg loading=\"lazy\" width=\"1000\" height=\"527\" src=\"/sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2013/05/device11-1.jpg.jpg?itok=EiZTkBuA\" alt=\"device\" title=\"device\">\n\n  \u003C/picture>\n\n\u003C/div>\n          \u003C/div>\n\n\u003C/div>\n\u003C/div>\n\u003Cp>\u003Ca href=\"https://liechtenecker.at/responsive-webdesign-die-basics/\" target=\"_blank\" rel=\"noopener noreferrer\">Responsive Webdesign\u003C/a>&nbsp;ist mittlerweile kein exotisches Fremdwort mehr, sondern schon seit längerem in den Köpfen von Webworkern aber auch von vielen Kunden fix verankert. Es gehört schon zum guten Ton, neben der normalen Desktopvariante bei Launches und Relaunches auch Benutzer von Tablets und Smartphones nicht aussen vor zu lassen. Die Optimierung für solche Devices hört jedoch oft beim Umgestalten des Layouts auf – und das ist ein großer Fehler.\u003Cbr>\nImmer wieder wird auf die wichtigsten Eckpunkte vergessen, z.B. eine passende Contentstrategie (siehe \u003Ca href=\"https://liechtenecker.at/content-first-statt-mobile-first/\" target=\"_blank\" rel=\"noopener noreferrer\">Content First statt Mobile First\u003C/a>) einzuplanen oder – und das ist noch wesentlich wichtiger – das User Interface mit all seinen Funktionen im Kontext auch auf kleinen Bildschirmen benutzbar zu machen.\u003Cbr>\n\u003Cbr>\nIn meinem letzten Blogbeitrag habe ich mich mit dem Thema \u003Ca href=\"https://liechtenecker.at/tag/feature-detection/\" target=\"_blank\" rel=\"noopener noreferrer\">Feature Detection im Browser\u003C/a> beschäftigt, heute möchte ich das Thema aufgreifen und aufzeigen, welche Möglichkeiten die Feature Detection im Detail bietet, um das User Interface und die User Experience auf Devices mit kleinen Auflösungen deutlich zu verbessern.\u003C/p>\n\u003Ch2>Geschwindigkeit\u003C/h2>\n\u003Cp>Die Seite auf Geschwindigkeit bzw. Performance zu optimieren ist zwar auch auf dem Desktop essentiell – wird aber besonders bei mobilen Geräten ein muss. Warum? Mobile Geräte werden oft unterwegs mit schlechtem Netz benutzt, haben generell weniger Prozessorleistung als große Rechner und bezahlen daher aufwendige Berechnungen mit einem hohen Preis – der Akkulaufzeit.\u003Cbr>\nIn einem \u003Ca href=\"http://www.youtube.com/watch?v=Il4swGfTOSM\" data-rel=\"lightbox-video-0\" target=\"_blank\" rel=\"noopener noreferrer\">sehr sehenswerten Talk\u003C/a>&nbsp;spricht ein Google Engineer die Auswirkungen langsamer Seitenladezeiten an: Bei einer längeren Ladezeit um nur wenige hundert Millisekunden konnte Google eine signifikante Veränderung beim Verhalten der User auf der Webseite feststellen.\u003Cbr>\nWie kann die Geschwindigkeit davon profitieren, wenn die Webseite weiß, dass der User mit einem Smartphone surft? Oft wird die Seite für Desktopcomputer konzipiert und entwickelt und erst im Nachhinein über Media Queries mobil gemacht. Dabei kann es vorkommen, das Elemente die auf dem Desktop Sinn machen (z.B. eine Bildgalerie), auf mobilen Devices einfach nur ausgespart werden, weil der Platz besser genutzt werden muss. Mit dem reinen Ausblenden ist es aber meist nicht getan – die dazugehörigen JavaScript Libraries werden im Hintergrund trotzdem geladen, verbrauchen unnötig Bandbreite, Performance und Akkukapazität (ein \u003Ca href=\"http://www2012.wwwconference.org/proceedings/proceedings/p41.pdf\" target=\"_blank\" rel=\"noopener noreferrer\">interessantes Paper\u003C/a> von der World Wide Web Conference 2012 zeigt auf, wie viel Akku oft wirklich von unnötig geladenen Ressourcen verbraucht wird).\u003Cbr>\nDaher macht es durchaus Sinn, Libraries nur zu laden, wenn sie auch wirklich gebraucht werden, um so auf mobilen Geräten wertvolle Ressourcen zu sparen.\u003C/p>\n\u003Ch2>Optimierung von Interface-Elementen\u003C/h2>\n\u003Cp>Oft wird nur ein einziges UI-Element im reponsive Design verändert: das Hauptmenü. Es gibt unzählige Formen, in die sich das Hauptmenü &nbsp;transformieren kann. Von Dropdown-Menüs über aufklappbare Listen (siehe unsere Seite) bis hin zu Menüs, die nach einem Klick auf einen Button von der Seite auffahren.\u003Cbr>\nDie Veränderung des Menüs geschieht aus einem einzigen Grund: Weil es sonst auf mobilen Geräten nicht benutzbar wäre oder zu viel Platz einnehmen würde. Der Ansatz ist zwar per se nicht falsch, viel mehr sollte aber statt der Frage „Was ist kaputt, was müssen wir richten?“ vielmehr die Frage „Welche Elemente kann ich mobil optimieren, um ein deutlich gesteigertes Nutzererlebnis zu bieten?“ &nbsp;gestellt werden.\u003C/p>\n\u003Ch3>Device und Fingergröße\u003C/h3>\n\u003Cp>Oft wird bei responsive Webseiten vergessen, dass der Nutzer meist eine vollkommen andere Eingabemethode als auf klassichen Computern hat. Statt einer Maus benutzt er seine Finger auf einem (meist) Multitouch-Display. Elemente, die mit der Maus leicht bedient werden können, werden nicht zuletzt wegen der geringen Größe des Bildschirms auf mobilen Devices mit Fingern oft nur sehr schwer benutzbar (eine \u003Ca href=\"http://dl.acm.org/citation.cfm?id=1152260\" target=\"_blank\" rel=\"noopener noreferrer\">Studie\u003C/a> beschreibt die absolute Mindestgröße für klickbare Bereiche mit 9.2mm – je größer die Fläche desto besser).\u003Cbr>\nDaher liegt die Lösung für die Interaktion mit kleinen Elementen näher als man denkt – nämlich bei den Entwicklern der mobilen Betriebssysteme. Was am Desktop ein Dropdown Menü ist, welches direkt über dem Element das geklickt wurde und dann erscheint, wird dieses am z.B. iPhone zu einem Element, das fast die Hälfte des Bildschirmes einnimmt. Dieses Verhalten zieht sich über alle großen mobilen Betriebssysteme.\u003Cbr>\nDie größte Optimierung des UIs für mobile Geräte ist also, nach Möglichkeit&nbsp;auf die Standard-Interface-Elemente zurückzuführen. Dies garantiert die beste Kompatibilität mit allen Devices, egal welche Auflösungen und Größen sie haben und garantieren den Benutzern eine frustfreie Bedienung der Seite.\u003C/p>\n\u003Ch2>Die Zukunft\u003C/h2>\n\u003Cp>Touchbasierte Geräte werden immer beliebter – ob mobil aber auch am Desktop. Mit zunehmender Verbreitung wird in naher Zukunft auch ein weiterer, enormer Vorteil gegenüber klassichen Eingabemethoden wie der Maus genutzt werden: Multitouch. Während der Desktop auf einen Input begrenzt ist (dem Mauscursor) kann die Hand auf mobilen Geräten Kombinationen aus Bewegungen ausführen – Stichwort Gesten.\u003Cbr>\nWebseiten werden also in Zukunft bedeutsam intuitiver zu bedienen sein als heute, weil sie sich immer weiter von der klassischen Mausbedienung wegentwickeln. Hier ist ein älterer Artikel zu \u003Ca title=\"NUI ist das neue GUI – nämlich: natural User Interface\" href=\"https://liechtenecker.at/nui-ist-das-neue-gui-namlich-natural-user-interface/\">NUI statt GUI\u003C/a>, das Natural User Interface.\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/optimierungen-von-webseiten-fur-mobile-devices/\" />\n\u003Cmeta property=\"og:locale\" content=\"de_DE\" />\n\u003Cmeta property=\"og:type\" content=\"article\" />\n\u003Cmeta property=\"og:title\" content=\"Optimierungen von Webseiten für mobile Devices - Liechtenecker\" />\n\u003Cmeta property=\"og:description\" content=\"Responsive Webdesign ist mittlerweile kein exotisches Fremdwort mehr, sondern schon seit längerem in den Köpfen von Webworkern aber auch von vielen Kunden fix verankert. Es gehört schon zum guten Ton, neben der normalen Desktopvariante bei Launches und Relaunches auch Benutzer von Tablets und Smartphones nicht aussen vor zu lassen. Die Optimierung für solche Devices hört jedoch [&hellip;]\" />\n\u003Cmeta property=\"og:url\" content=\"https://liechtenecker.at/blog/optimierungen-von-webseiten-fur-mobile-devices/\" />\n\u003Cmeta property=\"og:site_name\" content=\"Liechtenecker\" />\n\u003Cmeta property=\"article:published_time\" content=\"2013-05-29T07:07:32+00:00\" />\n\u003Cmeta property=\"og:image\" content=\"https://liechtenecker.at/wp-content/uploads/2013/05/device11-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=\"4 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/optimierungen-von-webseiten-fur-mobile-devices/#primaryimage\",\"inLanguage\":\"de-DE\",\"url\":\"https://liechtenecker.at/wp-content/uploads/2013/05/device11-1.jpg\",\"width\":1000,\"height\":527},{\"@type\":\"WebPage\",\"@id\":\"https://liechtenecker.at/blog/optimierungen-von-webseiten-fur-mobile-devices/#webpage\",\"url\":\"https://liechtenecker.at/blog/optimierungen-von-webseiten-fur-mobile-devices/\",\"name\":\"Optimierungen von Webseiten f\\u00fcr mobile Devices - Liechtenecker\",\"isPartOf\":{\"@id\":\"https://liechtenecker.at/#website\"},\"primaryImageOfPage\":{\"@id\":\"https://liechtenecker.at/blog/optimierungen-von-webseiten-fur-mobile-devices/#primaryimage\"},\"datePublished\":\"2013-05-29T07:07:32+00:00\",\"dateModified\":\"2013-05-29T07:07:32+00:00\",\"author\":{\"@id\":\"https://liechtenecker.at/#/schema/person/663b2d5142421ab394bf325c1b48cecf\"},\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https://liechtenecker.at/blog/optimierungen-von-webseiten-fur-mobile-devices/\"]}]},{\"@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":159,"id":160,"myRole":161,"name":162,"nickname":163},"User","23","langgedienter Frontend-Veteran","s-fletzberger","Stephan",{"latestKnowhow":165},[166,184,197],{"__typename":79,"id":167,"title":168,"path":169,"wpTeaserText":170,"wpPromotedTeaserImage":13,"wpHeaderImage":171},"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":172,"id":173,"excludeFromScreenreader":13,"mediaImage":174,"name":182,"path":183,"status":20},"MediaImage","3364",{"__typename":175,"url":176,"width":177,"height":178,"alt":179,"title":13,"size":180,"mime":181},"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":185,"title":186,"path":187,"wpTeaserText":188,"wpPromotedTeaserImage":13,"wpHeaderImage":189},"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":172,"id":190,"excludeFromScreenreader":13,"mediaImage":191,"name":195,"path":196,"status":20},"3355",{"__typename":175,"url":192,"width":177,"height":178,"alt":193,"title":13,"size":194,"mime":181},"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":198,"title":199,"path":200,"wpTeaserText":13,"wpPromotedTeaserImage":13,"wpHeaderImage":201},"1606","UI Trends 2026","/blog/ui-trends-2026",{"__typename":172,"id":202,"excludeFromScreenreader":21,"mediaImage":203,"name":207,"path":208,"status":20},"3303",{"__typename":175,"url":204,"width":177,"height":178,"alt":205,"title":13,"size":206,"mime":181},"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":210,"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1":211,"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c":215,"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c":218,"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741":221,"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a":224,"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5":227,"Menu:nuxt-main-menu":230,"ROOT_QUERY":244,"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e":260,"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195":263,"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db":266,"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d":269,"Menu:footer":272,"TermCategories:8":282,"TermTags:822":293,"TermTags:895":294,"TermTags:1076":295,"TermTags:1331":296,"User:23":297,"NodeWpPost:1051":298,"MediaImage:3364":323,"NodeWpPost:1619":325,"MediaImage:3355":328,"NodeWpPost:1616":330,"MediaImage:3303":333,"NodeWpPost:1606":335},["null","__typename",16,"id",17,"name",18,"direction",19],["null","__typename",10,"id",11,"title",12,"description",13,"url",14,"langcode",212,"internal",20,"expanded",21,"attributes",214],{"__ref":213},"Language:de",["null","__typename",23,"class",13],["null","__typename",10,"id",25,"title",26,"description",13,"url",27,"langcode",216,"internal",20,"expanded",21,"attributes",217],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",10,"id",30,"title",31,"description",13,"url",32,"langcode",219,"internal",20,"expanded",21,"attributes",220],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",10,"id",35,"title",36,"description",13,"url",37,"langcode",222,"internal",20,"expanded",21,"attributes",223],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",10,"id",40,"title",41,"description",13,"url",42,"langcode",225,"internal",20,"expanded",21,"attributes",226],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",10,"id",45,"title",46,"description",13,"url",47,"langcode",228,"internal",20,"expanded",21,"attributes",229],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",5,"id",6,"name",7,"items",231],[232,234,236,238,240,242],{"__ref":233},"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1",{"__ref":235},"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c",{"__ref":237},"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c",{"__ref":239},"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741",{"__ref":241},"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a",{"__ref":243},"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5",["null","__typename",245,"menu({\"name\":\"NUXT_MAIN_MENU\"})",246,"menu({\"name\":\"FOOTER\"})",248,"route({\"path\":\"/blog/optimierungen-von-webseiten-fur-mobile-devices\"})",250,"latestKnowhow({\"excludeId\":\"1051\",\"limit\":3})",253],"Query",{"__ref":247},"Menu:nuxt-main-menu",{"__ref":249},"Menu:footer",["null","__typename",77,"entity",251],{"__ref":252},"NodeWpPost:1051",[254,256,258],{"__ref":255},"NodeWpPost:1619",{"__ref":257},"NodeWpPost:1616",{"__ref":259},"NodeWpPost:1606",["null","__typename",10,"id",55,"title",56,"description",13,"url",57,"langcode",261,"internal",20,"expanded",21,"attributes",262],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",10,"id",61,"title",62,"description",13,"url",63,"langcode",264,"internal",20,"expanded",21,"attributes",265],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",10,"id",66,"title",67,"description",13,"url",68,"langcode",267,"internal",20,"expanded",21,"attributes",268],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",10,"id",71,"title",72,"description",13,"url",73,"langcode",270,"internal",21,"expanded",21,"attributes",271],{"__ref":213},["null","__typename",23,"class",13],["null","__typename",5,"id",51,"name",52,"items",273],[274,276,278,280],{"__ref":275},"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e",{"__ref":277},"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195",{"__ref":279},"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db",{"__ref":281},"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d",["null","__typename",112,"id",113,"name",114,"path",115,"status",20,"weight",116,"description",283,"langcode",284,"changed",285,"metatag",286],["null","__typename",118,"processed",119,"format",120],{"__ref":213},["null","__typename",83,"timestamp",123,"timezone",85,"offset",86,"time",124],[287,289,291],["null","__typename",93,"tag",94,"attributes",288],["null","__typename",96,"name",97,"content",128],["null","__typename",93,"tag",94,"attributes",290],["null","__typename",96,"name",131,"content",132],["null","__typename",100,"tag",101,"attributes",292],["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",159,"id",160,"myRole",161,"name",162,"nickname",163],["null","__typename",79,"id",80,"title",81,"changed",299,"created",300,"langcode",301,"path",90,"promote",21,"status",20,"sticky",21,"metatag",302,"category",309,"contentElements",13,"evergreen",13,"tags",311,"wpBody",320,"wpHeaderImage",13,"wpHeaderImageOld",13,"wpHeaderImageOldSmall",13,"wpOgImage",13,"wpPromotedTeaserImage",13,"wpShareDescription",13,"wpShareTitle",13,"wpTeaserText",13,"wpYoastHead",157,"author",321],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],{"__ref":213},[303,305,307],["null","__typename",93,"tag",94,"attributes",304],["null","__typename",96,"name",97,"content",98],["null","__typename",100,"tag",101,"attributes",306],["null","__typename",103,"href",104,"hreflang",13,"rel",105,"media",13,"sizes",13,"type",13],["null","__typename",107,"tag",94,"attributes",308],["null","__typename",109,"property",110,"content",81],{"__ref":310},"TermCategories:8",[312,314,316,318],{"__ref":313},"TermTags:822",{"__ref":315},"TermTags:895",{"__ref":317},"TermTags:1076",{"__ref":319},"TermTags:1331",["null","__typename",155,"processed",156,"format",120,"summary",13],{"__ref":322},"User:23",["null","__typename",172,"id",173,"excludeFromScreenreader",13,"mediaImage",324,"name",182,"path",183,"status",20],["null","__typename",175,"url",176,"width",177,"height",178,"alt",179,"title",13,"size",180,"mime",181],["null","__typename",79,"id",167,"title",168,"path",169,"wpTeaserText",170,"wpPromotedTeaserImage",13,"wpHeaderImage",326],{"__ref":327},"MediaImage:3364",["null","__typename",172,"id",190,"excludeFromScreenreader",13,"mediaImage",329,"name",195,"path",196,"status",20],["null","__typename",175,"url",192,"width",177,"height",178,"alt",193,"title",13,"size",194,"mime",181],["null","__typename",79,"id",185,"title",186,"path",187,"wpTeaserText",188,"wpPromotedTeaserImage",13,"wpHeaderImage",331],{"__ref":332},"MediaImage:3355",["null","__typename",172,"id",202,"excludeFromScreenreader",21,"mediaImage",334,"name",207,"path",208,"status",20],["null","__typename",175,"url",204,"width",177,"height",178,"alt",205,"title",13,"size",206,"mime",181],["null","__typename",79,"id",198,"title",199,"path",200,"wpTeaserText",13,"wpPromotedTeaserImage",13,"wpHeaderImage",336],{"__ref":337},"MediaImage:3303"]