[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"9_t0YFtO844PW3-iCfPxRTbw8yv0-2zzu2bChZFenjo":3,"btz8hO-MXSFLpybqvfjYVBre4OvrEJO1wFySe3Zmv-s":49,"8Db5rln3_zoeN8km4O7WwrjKIsyPr4BgBU9raSCAimo":75,"PKANosYKoAmTsWRlM0uav8gQsR1Lct9PjnIWNqNqu-A":180,"_apollo:default":222},{"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":91,"path":92,"promote":21,"status":20,"sticky":21,"metatag":93,"postCategory":117,"postContentElements":13,"evergreen":13,"tags":142,"postWpBody":148,"wpHeaderImage":152,"wpHeaderImageOld":13,"wpHeaderImageOldSmall":13,"wpOgImage":164,"wpPromotedTeaserImage":13,"wpShareDescription":13,"wpShareTitle":13,"wpTeaserText":151,"wpYoastHead":173,"author":174},"NodeWpPost","725","Web Accessibility - Wie wir Schriftgrößenanpassung & High Contrast Switch umsetzen",{"__typename":83,"timestamp":84,"timezone":85,"offset":86,"time":87},"DateTime",1725883465,"UTC","+00:00","2024-09-09T12:04:25+00:00",{"__typename":83,"timestamp":89,"timezone":85,"offset":86,"time":90},1709537484,"2024-03-04T07:31:24+00:00",{"__typename":16,"id":17,"name":18,"direction":19},"/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen",[94,101,108,113],{"__typename":95,"tag":96,"attributes":97},"MetaTagValue","meta",{"__typename":98,"name":99,"content":100},"MetaTagValueAttributes","title","Web Accessibility - Wie wir Schriftgrößenanpassung & High Contrast Switch umsetzen | Liechtenecker UX Design Studio",{"__typename":102,"tag":103,"attributes":104},"MetaTagLink","link",{"__typename":105,"href":106,"hreflang":13,"rel":107,"media":13,"sizes":13,"type":13},"MetaTagLinkAttributes","http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen","canonical",{"__typename":109,"tag":96,"attributes":110},"MetaTagProperty",{"__typename":111,"property":112,"content":81},"MetaTagPropertyAttributes","og:title",{"__typename":109,"tag":96,"attributes":114},{"__typename":111,"property":115,"content":116},"og:image","http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/styles/meta_og_image/public/wp-migration/wordpress-media-image/2024/02/BLOG_WebAccessibility_SHARING-1204x630px.jpg?h=3ecc83bb&itok=JZK3cjYe",{"__typename":118,"id":119,"name":120,"path":121,"status":20,"weight":122,"description":123,"langcode":127,"changed":128,"metatag":131},"TermCategories","8","UX/UI Design","/kategorie/design",0,{"__typename":124,"processed":125,"format":126},"Text","Themen aus dem Bereich Design & User Experience","wp_html",{"__typename":16,"id":17,"name":18,"direction":19},{"__typename":83,"timestamp":129,"timezone":85,"offset":86,"time":130},1713772777,"2024-04-22T07:59:37+00:00",[132,135,139],{"__typename":95,"tag":96,"attributes":133},{"__typename":98,"name":99,"content":134},"UX/UI Design | Liechtenecker UX Design Studio",{"__typename":95,"tag":96,"attributes":136},{"__typename":98,"name":137,"content":138},"description","Themen aus dem Bereich Design & User Experience",{"__typename":102,"tag":103,"attributes":140},{"__typename":105,"href":141,"hreflang":13,"rel":107,"media":13,"sizes":13,"type":13},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/kategorie/design",[143],{"__typename":144,"id":145,"name":146,"path":147,"weight":122},"TermTags","45","Accessibility","/tag/accessibility",{"__typename":149,"processed":150,"format":126,"summary":151},"TextSummary","\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Ch2>Warum ist Web Accessibility so wichtig und woran scheitert es in der Praxis?\u003C/h2>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Damit Menschen mit unterschiedlichen Fähigkeiten und Sehbeeinträchtigungen auf Websites zugreifen und sie nutzen können, sollte auf jeder Website sichergestellt werden, dass diese barrierefrei gestaltet ist. In Österreich müssen öffentliche Stellen sowie private Unternehmen mit öffentlichem Auftrag ihre Website WCAG (Web Content Accessibility Guideline) konform gestalten. Die Nichteinhaltung dieser Standards kann zu rechtlichen Konsequenzen führen. Es ist also nicht nur eine ethische Verpflichtung, sondern oft auch eine rechtliche Anforderung.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Hört sich gut an, ist in der Praxis leider trotzdem nicht die Norm. Unterschiedliche internationale Untersuchungen beschreiben die Web-Accessibility noch immer als mangelhaft. Laut einer \u003Ca href=\"https://webaim.org/projects/million/\" target=\"_blank\" rel=\"noreferrer noopener\">diesjährigen Studie von WebAim\u003C/a> sind 96 % der meistgenutzten Websites nicht barrierefrei.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-xwc\">\u003Cdiv class=\"ckeditor-grid-col x-wide-center col-xsmall-12 col-medium-10 col-medium-offset-1\">\u003Cfigure role=\"group\" class=\" wp-block-image size-large is-resized\">\n\u003Cdiv alt=\"Gelbe Grafik auf schwarzem Hintergrund\n96,3% der Websites weisen 2023 wcag2-verstöße auf\" data-entity-type=\"media\" data-entity-uuid=\"fc11e6ac-1bf0-48fa-9960-4662237d3c27\" 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/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=XVUmXWqM 1x, /sites/default/files/styles/image_width_medium_x2/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=YK30062w 2x\" media=\"all and (min-width: 1024px) and (max-width: 1439px)\" type=\"image/webp\" width=\"1440\" height=\"810\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_small/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=NDdftEUf 1x, /sites/default/files/styles/image_width_small_x2/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=FQy-oUsq 2x\" media=\"all and (min-width: 745px) and (max-width: 1023px)\" type=\"image/webp\" width=\"1024\" height=\"576\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xsmall/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=WSFKjhYD 1x, /sites/default/files/styles/image_width_xsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=KS0ksFcD 2x\" media=\"all and (min-width: 480px) and (max-width: 744px)\" type=\"image/webp\" width=\"745\" height=\"419\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xxsmall/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=p8yF9Pwx 1x, /sites/default/files/styles/image_width_xxsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=dWxdfSx5 2x\" media=\"all and (max-width: 479px)\" type=\"image/webp\" width=\"480\" height=\"270\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_large/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=Cxsym-_v 1x, /sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.webp?itok=WKKSrRkS 2x\" type=\"image/webp\" width=\"1620\" height=\"912\">\n                  \u003Cimg loading=\"lazy\" width=\"2758\" height=\"1552\" src=\"/sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Accessibility-Versto%CC%88sse-2023.png.jpg?itok=WKKSrRkS\" alt=\"Gelbe Grafik auf schwarzem Hintergrund\n96,3% der Websites weisen 2023 wcag2-verstöße auf\" title=\"Accessibility-Verstösse-2023\">\n\n  \u003C/picture>\n\n\u003C/div>\n          \u003C/div>\n\n\u003C/div>\n\u003C/div>\n\n\u003Cfigcaption>96,3% der Startseiten wiesen WCAG-2-Verstöße auf! Über die letzten 4 Jahre hinweg hat sich der Anteil der Seiten mit nachweisbaren WCAG-Verstößen nur um 1,5% verringert, ausgehend von 97,8%.\u003C/figcaption>\n\u003C/figure>\n\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Eine schockierend hohe Zahl. Doch warum ist das so? Die mangelnde Umsetzung von Web Accessibility kann auf verschiedene Gründe zurückgeführt werden:\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 standard-list\">\u003Col>\u003Cli>Fehlende Schulung und Kenntnisse: Webentwickler:innen und Designer:innen müssen Kenntnisse über barrierefreies Design haben, um sicherzustellen, dass ihre Websites für alle Benutzer:innen zugänglich sind. Diese Fachkenntnisse fehlen häufig, umso wichtiger ist die Zusammenarbeit mit Partner:innen, die wissen wie’s läuft. 🤓\u003C/li>\u003Cli>Zeit und Kosten: Die Umsetzung von Barrierefreiheit erfordert zusätzliche Zeit und Ressourcen. In vielen Fällen werden diese Aspekte nicht ausreichend berücksichtigt, insbesondere wenn der Fokus auf schneller Entwicklung und niedrigen Kosten liegt. Inklusion sollte aber keine Frage von Kosten und Aufwand sein!\u003C/li>\u003Cli>Veraltete Technologien: Einige ältere Websites basieren möglicherweise auf veralteten Technologien, die nicht standardmäßig barrierefrei sind. Die Aktualisierung solcher Websites kann zeitaufwändig und kostspielig sein. Und auch hier gilt: Accessibility is priceless.\u003C/li>\u003Cli>Mangelnde Priorität: Für einige Unternehmen und Organisationen mag Barrierefreiheit möglicherweise nicht die oberste Priorität haben im Vergleich zu anderen Aspekten wie Ästhetik, Funktionen oder Umsatz. Aber es ist jetzt an der Zeit, umzudenken…\u003C/li>\u003C/ol>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Diese Gründe zeigen, dass es noch immer Herausforderungen gibt, die es zu überwinden gilt, um eine umfassende Barrierefreiheit im Web zu erreichen. Es ist wichtig, dass alle Beteiligten, von Entwickler:innen und Designer:innen bis hin zu Website-Betreiber:innen zusammenarbeiten, um die Web-Accessibility voranzutreiben.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>In unserem heutigen Blogartikel wollen wir speziell auf 2 Punkte der Web Accessibility in der Praxis eingehen:\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cdiv class=\"ckeditor-spacer spacer spacer-10\"> \u003C/div>\u003Cdiv class=\"ckeditor-spacer spacer spacer-2\"> \u003C/div>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Ch2>1. High Contrast Switch\u003C/h2>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Ch3>Was ist das und wozu brauche ich es?\u003C/h3>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Einer der ersten Schritte zu einer barrierefreien Website ist der Einbau eines High Contrast Switchs. Doch wem genau nutzt dieser etwas? Viele Menschen mit Sehbehinderung leiden unter extremer Lichtempfindlichkeit (sogenannter Photophobie). Helles Licht macht für diese Menschen das Sehen schwierig oder unmöglich und verursacht Augen- und Kopfschmerzen. Deshalb ist für sie die normale Helligkeit eines Computerbildschirms mit hellem Hintergrund nicht lesbar und schmerzhaft. Ein High Contrast Switch auf einer Website ermöglicht es den Benutzer:innen schnell zwischen einem konventionellen Farbschema und einem High-Contrast-Modus zu wechseln.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-xwc\">\u003Cdiv class=\"ckeditor-grid-col x-wide-center col-xsmall-12 col-medium-10 col-medium-offset-1\">\u003Cfigure role=\"group\" class=\" wp-block-image size-large is-resized\">\n\u003Cdiv alt=\"Screenshot der Belvedere.at Startseite im nomalen Modus\n(man sieht das Obere Belvedere, das Untere Belvedere und das Belvedere 21)\" data-entity-type=\"media\" data-entity-uuid=\"24fa7667-8e4b-404f-8d3a-e9f3eb0227dc\" 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/2024/01/Untitled-7-scaled.jpg.webp?itok=VPhfP0pw 1x, /sites/default/files/styles/image_width_medium_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=jysqE4gU 2x\" media=\"all and (min-width: 1024px) and (max-width: 1439px)\" type=\"image/webp\" width=\"1440\" height=\"791\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_small/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=Hgnmxf5p 1x, /sites/default/files/styles/image_width_small_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=Yc7P3MRa 2x\" media=\"all and (min-width: 745px) and (max-width: 1023px)\" type=\"image/webp\" width=\"1024\" height=\"563\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xsmall/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=qDe6PE5Z 1x, /sites/default/files/styles/image_width_xsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=KlTbGqPA 2x\" media=\"all and (min-width: 480px) and (max-width: 744px)\" type=\"image/webp\" width=\"745\" height=\"409\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xxsmall/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=6mk8Bx5I 1x, /sites/default/files/styles/image_width_xxsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=His2Uv8B 2x\" media=\"all and (max-width: 479px)\" type=\"image/webp\" width=\"480\" height=\"264\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_large/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=v3eaQOQq 1x, /sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.webp?itok=KwlyNTT9 2x\" type=\"image/webp\" width=\"1620\" height=\"890\">\n                  \u003Cimg loading=\"lazy\" width=\"2560\" height=\"1407\" src=\"/sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-7-scaled.jpg.jpg?itok=KwlyNTT9\" alt=\"Screenshot der Belvedere.at Startseite im nomalen Modus\n(man sieht das Obere Belvedere, das Untere Belvedere und das Belvedere 21)\" title=\"Untitled-7\">\n\n  \u003C/picture>\n\n\u003C/div>\n          \u003C/div>\n\n\u003C/div>\n\u003C/div>\n\n\u003Cfigcaption>Belvedere.at “before”.\u003C/figcaption>\n\u003C/figure>\n\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-xwc\">\u003Cdiv class=\"ckeditor-grid-col x-wide-center col-xsmall-12 col-medium-10 col-medium-offset-1\">\u003Cfigure role=\"group\" class=\" wp-block-image size-large is-resized\">\n\u003Cdiv alt=\"Screenshot der Startseite Belvedere.at im High Contrast Mode\n(Schwarzer Hintergrund mit hellem Text)\nBelvedere.at nachdem der High Contrast Switch im Browser aktiviert wurde.\n(man sieht das Obere Belvedere, das Untere Belvedere und das Belvedere 21)\" data-entity-type=\"media\" data-entity-uuid=\"d1cf2c9a-6360-4203-b280-edf411cd5881\" 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/2024/01/Untitled-8-scaled.jpg.webp?itok=5ZcXXnvA 1x, /sites/default/files/styles/image_width_medium_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=0O9HT57W 2x\" media=\"all and (min-width: 1024px) and (max-width: 1439px)\" type=\"image/webp\" width=\"1440\" height=\"805\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_small/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=SIBmB1wy 1x, /sites/default/files/styles/image_width_small_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=4-XwLHS_ 2x\" media=\"all and (min-width: 745px) and (max-width: 1023px)\" type=\"image/webp\" width=\"1024\" height=\"573\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xsmall/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=30zaxOiz 1x, /sites/default/files/styles/image_width_xsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=iUtx_zbv 2x\" media=\"all and (min-width: 480px) and (max-width: 744px)\" type=\"image/webp\" width=\"745\" height=\"417\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xxsmall/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=QIS3MsIo 1x, /sites/default/files/styles/image_width_xxsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=Rkr35PM6 2x\" media=\"all and (max-width: 479px)\" type=\"image/webp\" width=\"480\" height=\"269\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_large/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=WP1FEjXP 1x, /sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.webp?itok=q3XdvSuu 2x\" type=\"image/webp\" width=\"1620\" height=\"906\">\n                  \u003Cimg loading=\"lazy\" width=\"2560\" height=\"1432\" src=\"/sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Untitled-8-scaled.jpg.jpg?itok=q3XdvSuu\" alt=\"Screenshot der Startseite Belvedere.at im High Contrast Mode\n(Schwarzer Hintergrund mit hellem Text)\nBelvedere.at nachdem der High Contrast Switch im Browser aktiviert wurde.\n(man sieht das Obere Belvedere, das Untere Belvedere und das Belvedere 21)\" title=\"Untitled-8\">\n\n  \u003C/picture>\n\n\u003C/div>\n          \u003C/div>\n\n\u003C/div>\n\u003C/div>\n\n\u003Cfigcaption>Belvedere.at nachdem der High Contrast Switch im Browser aktiviert wurde.\u003C/figcaption>\n\u003C/figure>\n\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Ch3>High Contrast Switch in der Praxis – Was gilt es zu beachten?\u003C/h3>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Gemeinsam mit der Österreichischen Galerie Belvedere durften wir dieses Jahr einen High Contrast Switch umsetzen. Hier sind unsere Top 3 Tipps für Designer:innen, die ihr bei der Umsetzung des High Contrast Switches beachten solltet:\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 standard-list\">\u003Cul>\u003Cli>\u003Cstrong>Nutze kein reines Schwarz/Weiß\u003C/strong>\u003C/li>\u003C/ul>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Rein weiße Schrift kann auf schwarzem Hintergrund für Menschen mit einer Hornhautverkrümmung schnell verschwommen bzw. unscharf wirken.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-xwc\">\u003Cdiv class=\"ckeditor-grid-col x-wide-center col-xsmall-12 col-medium-10 col-medium-offset-1\">\u003Cfigure role=\"group\" class=\" wp-block-image size-large is-resized\">\n\u003Cdiv alt=\"You think this is the best solution, but  it is not\nAnsicht der Strasse in der Nacht mit Lichtern eines LKW\" data-entity-type=\"media\" data-entity-uuid=\"69bd0475-831b-421f-9b71-99aab5d4c1f0\" 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/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=AGPBo4RC 1x, /sites/default/files/styles/image_width_medium_x2/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=nZgs4PPy 2x\" media=\"all and (min-width: 1024px) and (max-width: 1439px)\" type=\"image/webp\" width=\"571\" height=\"306\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_small/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=JGhiNejv 1x, /sites/default/files/styles/image_width_small_x2/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=V0ZQ9fdR 2x\" media=\"all and (min-width: 745px) and (max-width: 1023px)\" type=\"image/webp\" width=\"571\" height=\"306\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xsmall/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=cc702nr6 1x, /sites/default/files/styles/image_width_xsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=Zwcdtu4h 2x\" media=\"all and (min-width: 480px) and (max-width: 744px)\" type=\"image/webp\" width=\"571\" height=\"306\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xxsmall/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=_N7aRmpv 1x, /sites/default/files/styles/image_width_xxsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=UbuEQU3G 2x\" media=\"all and (max-width: 479px)\" type=\"image/webp\" width=\"480\" height=\"257\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_large/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=t54lIhHX 1x, /sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.webp?itok=TM8svHIY 2x\" type=\"image/webp\" width=\"571\" height=\"306\">\n                  \u003Cimg loading=\"lazy\" width=\"571\" height=\"306\" src=\"/sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Bildschirmfoto-2023-12-14-um-14.29.32.png.jpg?itok=TM8svHIY\" alt=\"You think this is the best solution, but  it is not\nAnsicht der Strasse in der Nacht mit Lichtern eines LKW\" title=\"Bildschirmfoto-2023-12-14-um-14.29.32\">\n\n  \u003C/picture>\n\n\u003C/div>\n          \u003C/div>\n\n\u003C/div>\n\u003C/div>\n\n\u003Cfigcaption>Bild mit Hornhautverkrümmung (ASTAGMATISMUS)\u003C/figcaption>\n\u003C/figure>\n\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 standard-list\">\u003Cul>\u003Cli>\u003Cstrong>Nutze Farben alleine nicht als Alleinunterscheidung\u003C/strong>\u003C/li>\u003C/ul>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Generell sollten Farben nicht als einziges Mittel zur Unterscheidung verwendet werden. Zusätzlich können Zeichen und Muster eingesetzt werden um z.B. den Status eines Toggles anzuzeigen.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-xwc\">\u003Cdiv class=\"ckeditor-grid-col x-wide-center col-xsmall-12 col-medium-10 col-medium-offset-1\">\u003Cfigure role=\"group\" class=\" wp-block-image size-large is-resized\">\n\u003Cdiv alt=\"Schwarzer Hintergrund mit Symbolen- Schieber und einem Balkendiagramm mit unterschiedlichen Strukturen\" data-entity-type=\"media\" data-entity-uuid=\"a1fdd597-b619-4afc-a652-2fda82c325e4\" 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/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=-C4cABFT 1x, /sites/default/files/styles/image_width_medium_x2/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=-MLXb5sV 2x\" media=\"all and (min-width: 1024px) and (max-width: 1439px)\" type=\"image/webp\" width=\"1440\" height=\"810\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_small/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=XFTOCbaq 1x, /sites/default/files/styles/image_width_small_x2/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=iUTxMCQ0 2x\" media=\"all and (min-width: 745px) and (max-width: 1023px)\" type=\"image/webp\" width=\"1024\" height=\"576\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xsmall/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=Z6jy7vhl 1x, /sites/default/files/styles/image_width_xsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=0bQyPJ6Z 2x\" media=\"all and (min-width: 480px) and (max-width: 744px)\" type=\"image/webp\" width=\"745\" height=\"419\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_xxsmall/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=dVq-gUNN 1x, /sites/default/files/styles/image_width_xxsmall_x2/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=F13REs4G 2x\" media=\"all and (max-width: 479px)\" type=\"image/webp\" width=\"480\" height=\"270\">\n              \u003Csource srcset=\"/sites/default/files/styles/image_width_large/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=_XtraOVF 1x, /sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.webp?itok=HOJtSYhl 2x\" type=\"image/webp\" width=\"1620\" height=\"912\">\n                  \u003Cimg loading=\"lazy\" width=\"2758\" height=\"1552\" src=\"/sites/default/files/styles/image_width_large_x2/public/wp-migration/wordpress-media-image/2024/01/Farbe-nicht-als-einziges-mittel-zur-Unterscheidung.png.jpg?itok=HOJtSYhl\" alt=\"Schwarzer Hintergrund mit Symbolen- Schieber und einem Balkendiagramm mit unterschiedlichen Strukturen\" title=\"Farbe-nicht-als-einziges-mittel-zur-Unterscheidung\">\n\n  \u003C/picture>\n\n\u003C/div>\n          \u003C/div>\n\n\u003C/div>\n\u003C/div>\n\n\u003Cfigcaption>So könntest du zusätzlich zur Farbe mit Symbolen oder Strukturen Unterscheidungen schaffen.\u003C/figcaption>\n\u003C/figure>\n\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3 standard-list\">\u003Cul>\u003Cli>\u003Cstrong>Setze einen Fokus!\u003C/strong>\u003C/li>\u003C/ul>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Ist die Fokusanzeige der Tastatur auf der Website sichtbar, gilt es folgende Punkte zu beachten: Die Umrandung sollte mindestens 2 Pixel größer sein als die nicht umrandeten Komponenten. Das Kontrastverhältnis zwischen den fokussierten und den unfokussierten Komponenten sollte 3:1 sein.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-xwc\">\u003Cdiv class=\"ckeditor-grid-col x-wide-center col-xsmall-12 col-medium-10 col-medium-offset-1\">\u003Cfigure class=\"wp-block-video\">\u003Cdiv data-entity-type=\"media\" data-entity-uuid=\"ed1bee95-d9a7-4c65-95d6-93bd34205cc1\" data-langcode=\"de\" class=\"embedded-entity\">\u003Cdiv>\n  \n  \n            \u003Cdiv>\u003Cvideo controls=\"controls\" width=\"640\" height=\"480\">\n      \u003Csource src=\"/sites/default/files/wp-migration/wordpress-media-video/2024/04/belv-screen.mp4\" type=\"video/mp4\">\n  \u003C/video>\n\u003C/div>\n      \n\u003C/div>\n\u003C/div>\n\u003C/figure>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Ansonsten ist es wichtig, bei der farblichen Umstellung gründlich und umfangreich zu testen, um sicherzustellen, dass wirklich alle Elemente, Seiten und Funktionen berücksichtigt und angepasst wurden. Im Idealfall hilft auch ein kurzer Blick von Expert:innen und/oder Betroffenen über deine Seite, um mögliche Lücken aufzudecken.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cdiv class=\"ckeditor-spacer spacer spacer-10\"> \u003C/div>\u003Cdiv class=\"ckeditor-spacer spacer spacer-2\"> \u003C/div>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Ch2>2. Schriftgrößenanpassung\u003C/h2>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Ch3>Was ist das und wozu brauche ich es?\u003C/h3>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Manche Menschen brauchen unterschiedliche Textgrößen, um die Buchstaben zu erkennen. Obwohl eine Vergrößerung in der Praxis am häufigsten vorkommt, bevorzugen manche Menschen mit Tunnelblick und guter Sehschärfe kleinere Buchstaben, damit sie mehr Wörter auf einmal sehen können. Den Benutzer:innen soll es möglich gemacht werden, die Textgröße (Schriftgröße) des gesamten Textes zu ändern, ohne die Benutzeroberfläche zu vergrößern (was der Fall wäre, wenn die Benutzer „heranzoomen“ oder Browserfunktionen verwenden würden). Laut den Web Content Accessibility Guidelines (WCAG) 2.0 und der Barrierefreien Informationstechnik-Verordnung – BITV 2.0 ist eine Textvergrößerung von 200% erforderlich.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Ch3>Beispiel BBRZ\u003C/h3>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Eine variable Schriftgröße ermöglicht es Menschen mit Sehbeeinträchtigungen, die Website besser zu lesen. Durch die Anpassung der Schriftgröße konnten wir auch “Reha-Billi” inklusiver gestalten.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-xwc\">\u003Cdiv class=\"ckeditor-grid-col x-wide-center col-xsmall-12 col-medium-10 col-medium-offset-1\">\u003Cdiv alt=\"Ansicht Grössenanpassung des BBRZ-Kundinnenportals\" data-langcode=\"de\" data-entity-type=\"media\" data-entity-uuid=\"86ee9c62-5c07-4fd8-90fe-dba19c731a4e\" class=\"embedded-entity\">\u003Cdiv>\n  \n  \n  \u003Cdiv>\n    \u003Cdiv class=\"visually-hidden\">Bild\u003C/div>\n              \u003Cdiv>  \u003Cimg title=\"Rehabilli-Schriftgrössenanpassung\" alt=\"Ansicht Grössenanpassung des BBRZ-Kundinnenportals\" loading=\"lazy\" src=\"/sites/default/files/wp-migration/wordpress-media-image/2024/01/Rehabilli-Schriftgro%CC%88ssenanpassung.gif\" width=\"1200\" height=\"637\">\n\n\u003C/div>\n          \u003C/div>\n\n\u003C/div>\n\u003C/div>\n\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Ch2>Web Accessibility – Zusammenfassung und Ausblick\u003C/h2>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>Jeder spricht darüber, aber wenige setzen es wirklich um. (Ja, auch wir haben teilweise Nachholbedarf bei unseren eigenen Seiten und sind dran das zu verbessern).\u003Cbr>Web Accessibility wird derzeit noch als „nice to have“ betrachtet, das man sich auch leisten können muss. Wir sind noch weit davon entfernt, einen weltweiten Standard zu haben, da es immer noch an Erfahrung, Know-how und Verantwortung mangelt. Gerade deshalb ist es so wichtig, sich in den Diskurs einzubringen, Erfahrungen auszutauschen, mit Betroffenen zu sprechen und einfach anzufangen. Auf diese Weise können wir gemeinsam einige Schritte in die richtige Richtung machen. Denn darum geht es bei Accessibility: Gemeinsam mehr zu erreichen.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp>\u003Ca href=\"/kontakt\" target=\"_blank\" rel=\"noreferrer noopener\">Hast du Fragen oder möchtest du das Thema angehen? \u003C/a>\u003Cbr>Wir helfen dir gerne in der Umsetzung deiner Accessibility-Projekte.\u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp> \u003C/p>\u003C/div>\u003C/div>\u003C/div>\u003Cdiv class=\"grid-wrapper\">\u003Cdiv class=\"row ckeditor-grid grid-100-dl\">\u003Cdiv class=\"ckeditor-grid-col default-left col-xsmall-12 col-medium-6 col-medium-offset-2 col-large-6 col-large-offset-3\">\u003Cp> \u003C/p>\u003C/div>\u003C/div>\u003C/div>","Wir haben uns in letzter Zeit wieder intensiver mit dem Thema Web Accessibility beschäftigt und durften auch für ein paar unserer Kund:innen Projekte in diesem Bereich umsetzen. Unsere Insights und Erfahrungen mit Schriftvergrößerung und High Contrast Switch wollen wir gerne mit euch teilen. Ok, let’s go!",{"__typename":153,"id":154,"excludeFromScreenreader":13,"mediaImage":155,"name":160,"path":163,"status":20},"MediaImage","169",{"__typename":156,"url":157,"width":158,"height":159,"alt":13,"title":160,"size":161,"mime":162},"Image","http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/wp-migration/wordpress-media-image/2024/02/BLOG_MT_NF_Accessibility-2880x1300px-scaled.jpg",2560,1156,"BLOG_MT_NF_Accessibility-2880x1300px",415583,"image/jpeg","/media/169/edit",{"__typename":153,"id":165,"excludeFromScreenreader":13,"mediaImage":166,"name":170,"path":172,"status":20},"168",{"__typename":156,"url":167,"width":168,"height":169,"alt":13,"title":170,"size":171,"mime":162},"http://liechtenecker-cms.liechtenecker-cms.svc.cluster.local/sites/default/files/wp-migration/wordpress-media-image/2024/02/BLOG_WebAccessibility_SHARING-1204x630px.jpg",1204,630,"BLOG_WebAccessibility_SHARING-1204x630px",365793,"/media/168/edit","\u003C!-- This site is optimized with the Yoast SEO plugin v15.7 - https://yoast.com/wordpress/plugins/seo/ -->\r\n\u003Cmeta name=\"description\" content=\"Wir haben uns in letzter Zeit wieder intensiver mit dem Thema Web Accessibility beschäftigt und durften auch für ein paar unserer Kund:innen Projekte in diesem Bereich umsetzen. Unsere Insights und Erfahrungen mit Schriftvergrößerung und High Contrast Switch wollen wir gerne mit euch teilen. Ok, let’s go!\" />\r\n\u003Cmeta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" />\r\n\u003Clink rel=\"canonical\" href=\"https://legacy.liechtenecker.dev/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen/\" />\r\n\u003Cmeta property=\"og:locale\" content=\"de_DE\" />\r\n\u003Cmeta property=\"og:type\" content=\"article\" />\r\n\u003Cmeta property=\"og:title\" content=\"Web Accessibility - Wie wir Schriftgrößenanpassung & High Contrast Switch umsetzen - Liechtenecker\" />\r\n\u003Cmeta property=\"og:description\" content=\"Wir haben uns in letzter Zeit wieder intensiver mit dem Thema Web Accessibility beschäftigt und durften auch für ein paar unserer Kund:innen Projekte in diesem Bereich umsetzen. Unsere Insights und Erfahrungen mit Schriftvergrößerung und High Contrast Switch wollen wir gerne mit euch teilen. Ok, let’s go!\" />\r\n\u003Cmeta property=\"og:url\" content=\"https://legacy.liechtenecker.dev/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen/\" />\r\n\u003Cmeta property=\"og:site_name\" content=\"Liechtenecker\" />\r\n\u003Cmeta property=\"article:published_time\" content=\"2024-03-04T08:31:24+00:00\" />\r\n\u003Cmeta property=\"article:modified_time\" content=\"2024-04-09T12:53:52+00:00\" />\r\n\u003Cmeta property=\"og:image\" content=\"https://legacy.liechtenecker.dev/wp-content/uploads/2024/01/Accessibility-Verstösse-2023.png\" />\r\n\u003Cmeta name=\"twitter:card\" content=\"summary_large_image\" />\r\n\u003Cmeta name=\"twitter:label1\" content=\"Geschätzte Lesezeit\">\r\n\t\u003Cmeta name=\"twitter:data1\" content=\"6 Minuten\">\r\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/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen/#primaryimage\",\"inLanguage\":\"de-DE\",\"url\":\"https://legacy.liechtenecker.dev/wp-content/uploads/2024/01/Accessibility-Versto\\u0308sse-2023.png\",\"width\":2758,\"height\":1552},{\"@type\":\"WebPage\",\"@id\":\"https://legacy.liechtenecker.dev/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen/#webpage\",\"url\":\"https://legacy.liechtenecker.dev/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen/\",\"name\":\"Web Accessibility - Wie wir Schriftgr\\u00f6\\u00dfenanpassung & High Contrast Switch umsetzen - Liechtenecker\",\"isPartOf\":{\"@id\":\"https://legacy.liechtenecker.dev/#website\"},\"primaryImageOfPage\":{\"@id\":\"https://legacy.liechtenecker.dev/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen/#primaryimage\"},\"datePublished\":\"2024-03-04T08:31:24+00:00\",\"dateModified\":\"2024-04-09T12:53:52+00:00\",\"author\":{\"@id\":\"https://legacy.liechtenecker.dev/#/schema/person/67300f9ded2b30de7dbfb4e9ee1434d9\"},\"description\":\"Wir haben uns in letzter Zeit wieder intensiver mit dem Thema Web Accessibility besch\\u00e4ftigt und durften auch f\\u00fcr ein paar unserer Kund:innen Projekte in diesem Bereich umsetzen. Unsere Insights und Erfahrungen mit Schriftvergr\\u00f6\\u00dferung und High Contrast Switch wollen wir gerne mit euch teilen. Ok, let\\u2019s go!\",\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https://legacy.liechtenecker.dev/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen/\"]}]},{\"@type\":\"Person\",\"@id\":\"https://legacy.liechtenecker.dev/#/schema/person/67300f9ded2b30de7dbfb4e9ee1434d9\",\"name\":\"Martina Thaler\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https://legacy.liechtenecker.dev/#personlogo\",\"inLanguage\":\"de-DE\",\"url\":\"https://secure.gravatar.com/avatar/8063a20550cff20feda8fc68db4fd33f?s=96&d=mm&r=g\",\"caption\":\"Martina Thaler\"}}]}\u003C/script>\r\n\u003C!-- / Yoast SEO plugin. -->",{"__typename":175,"id":176,"myRole":177,"name":178,"nickname":179},"User","12","Account Managerin","martina-thaler","Martina Thaler",{"latestKnowhow":181},[182,197,210],{"__typename":79,"id":183,"title":184,"path":185,"wpTeaserText":186,"wpPromotedTeaserImage":13,"wpHeaderImage":187},"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":153,"id":188,"excludeFromScreenreader":13,"mediaImage":189,"name":195,"path":196,"status":20},"3364",{"__typename":156,"url":190,"width":191,"height":192,"alt":193,"title":13,"size":194,"mime":162},"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,"Headerbilder Blogartikel Behind the scene Accessibility Audit.jpg","/media/3364/edit",{"__typename":79,"id":198,"title":199,"path":200,"wpTeaserText":201,"wpPromotedTeaserImage":13,"wpHeaderImage":202},"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":153,"id":203,"excludeFromScreenreader":13,"mediaImage":204,"name":208,"path":209,"status":20},"3355",{"__typename":156,"url":205,"width":191,"height":192,"alt":206,"title":13,"size":207,"mime":162},"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":211,"title":212,"path":213,"wpTeaserText":13,"wpPromotedTeaserImage":13,"wpHeaderImage":214},"1606","UI Trends 2026","/blog/ui-trends-2026",{"__typename":153,"id":215,"excludeFromScreenreader":21,"mediaImage":216,"name":220,"path":221,"status":20},"3303",{"__typename":156,"url":217,"width":191,"height":192,"alt":218,"title":13,"size":219,"mime":162},"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":223,"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1":224,"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c":228,"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c":231,"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741":234,"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a":237,"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5":240,"Menu:nuxt-main-menu":243,"ROOT_QUERY":257,"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e":273,"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195":276,"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db":279,"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d":282,"Menu:footer":285,"TermCategories:8":295,"TermTags:45":306,"MediaImage:169":307,"MediaImage:168":309,"User:12":311,"NodeWpPost:725":312,"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",225,"internal",20,"expanded",21,"attributes",227],{"__ref":226},"Language:de",["null","__typename",23,"class",13],["null","__typename",10,"id",25,"title",26,"description",13,"url",27,"langcode",229,"internal",20,"expanded",21,"attributes",230],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",10,"id",30,"title",31,"description",13,"url",32,"langcode",232,"internal",20,"expanded",21,"attributes",233],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",10,"id",35,"title",36,"description",13,"url",37,"langcode",235,"internal",20,"expanded",21,"attributes",236],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",10,"id",40,"title",41,"description",13,"url",42,"langcode",238,"internal",20,"expanded",21,"attributes",239],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",10,"id",45,"title",46,"description",13,"url",47,"langcode",241,"internal",20,"expanded",21,"attributes",242],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",5,"id",6,"name",7,"items",244],[245,247,249,251,253,255],{"__ref":246},"MenuItem:9ffc5019-cbd8-4b2e-8eb7-9feae486d4a1",{"__ref":248},"MenuItem:1c7a5430-8a42-4b24-9544-252adabc2f4c",{"__ref":250},"MenuItem:9c4feedc-79e4-4fbf-b68c-065f33ebfe4c",{"__ref":252},"MenuItem:3b77a27b-272a-489f-843e-53e23ed07741",{"__ref":254},"MenuItem:ce0bb82b-e1ee-4036-be95-f693a62e9f4a",{"__ref":256},"MenuItem:04a19381-81a9-4694-8653-182d8855d2b5",["null","__typename",258,"menu({\"name\":\"NUXT_MAIN_MENU\"})",259,"menu({\"name\":\"FOOTER\"})",261,"route({\"path\":\"/blog/web-accessibility-wie-wir-schriftgroessenanpassung-high-contrast-switch-umsetzen\"})",263,"latestKnowhow({\"excludeId\":\"725\",\"limit\":3})",266],"Query",{"__ref":260},"Menu:nuxt-main-menu",{"__ref":262},"Menu:footer",["null","__typename",77,"entity",264],{"__ref":265},"NodeWpPost:725",[267,269,271],{"__ref":268},"NodeWpPost:1619",{"__ref":270},"NodeWpPost:1616",{"__ref":272},"NodeWpPost:1606",["null","__typename",10,"id",55,"title",56,"description",13,"url",57,"langcode",274,"internal",20,"expanded",21,"attributes",275],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",10,"id",61,"title",62,"description",13,"url",63,"langcode",277,"internal",20,"expanded",21,"attributes",278],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",10,"id",66,"title",67,"description",13,"url",68,"langcode",280,"internal",20,"expanded",21,"attributes",281],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",10,"id",71,"title",72,"description",13,"url",73,"langcode",283,"internal",21,"expanded",21,"attributes",284],{"__ref":226},["null","__typename",23,"class",13],["null","__typename",5,"id",51,"name",52,"items",286],[287,289,291,293],{"__ref":288},"MenuItem:e2873307-b50a-4aab-b6b2-1950fd99c72e",{"__ref":290},"MenuItem:2cd9b7c9-142a-4ea3-b898-a0952c54a195",{"__ref":292},"MenuItem:a5effba3-5a8c-4125-8d78-0cdba09824db",{"__ref":294},"MenuItem:114bf071-bdbb-44cf-85c1-69e9d9e0777d",["null","__typename",118,"id",119,"name",120,"path",121,"status",20,"weight",122,"description",296,"langcode",297,"changed",298,"metatag",299],["null","__typename",124,"processed",125,"format",126],{"__ref":226},["null","__typename",83,"timestamp",129,"timezone",85,"offset",86,"time",130],[300,302,304],["null","__typename",95,"tag",96,"attributes",301],["null","__typename",98,"name",99,"content",134],["null","__typename",95,"tag",96,"attributes",303],["null","__typename",98,"name",137,"content",138],["null","__typename",102,"tag",103,"attributes",305],["null","__typename",105,"href",141,"hreflang",13,"rel",107,"media",13,"sizes",13,"type",13],["null","__typename",144,"id",145,"name",146,"path",147,"weight",122],["null","__typename",153,"id",154,"excludeFromScreenreader",13,"mediaImage",308,"name",160,"path",163,"status",20],["null","__typename",156,"url",157,"width",158,"height",159,"alt",13,"title",160,"size",161,"mime",162],["null","__typename",153,"id",165,"excludeFromScreenreader",13,"mediaImage",310,"name",170,"path",172,"status",20],["null","__typename",156,"url",167,"width",168,"height",169,"alt",13,"title",170,"size",171,"mime",162],["null","__typename",175,"id",176,"myRole",177,"name",178,"nickname",179],["null","__typename",79,"id",80,"title",81,"changed",313,"created",314,"langcode",315,"path",92,"promote",21,"status",20,"sticky",21,"metatag",316,"category",325,"contentElements",13,"evergreen",13,"tags",327,"wpBody",330,"wpHeaderImage",331,"wpHeaderImageOld",13,"wpHeaderImageOldSmall",13,"wpOgImage",333,"wpPromotedTeaserImage",13,"wpShareDescription",13,"wpShareTitle",13,"wpTeaserText",151,"wpYoastHead",173,"author",335],["null","__typename",83,"timestamp",84,"timezone",85,"offset",86,"time",87],["null","__typename",83,"timestamp",89,"timezone",85,"offset",86,"time",90],{"__ref":226},[317,319,321,323],["null","__typename",95,"tag",96,"attributes",318],["null","__typename",98,"name",99,"content",100],["null","__typename",102,"tag",103,"attributes",320],["null","__typename",105,"href",106,"hreflang",13,"rel",107,"media",13,"sizes",13,"type",13],["null","__typename",109,"tag",96,"attributes",322],["null","__typename",111,"property",112,"content",81],["null","__typename",109,"tag",96,"attributes",324],["null","__typename",111,"property",115,"content",116],{"__ref":326},"TermCategories:8",[328],{"__ref":329},"TermTags:45",["null","__typename",149,"processed",150,"format",126,"summary",151],{"__ref":332},"MediaImage:169",{"__ref":334},"MediaImage:168",{"__ref":336},"User:12",["null","__typename",153,"id",188,"excludeFromScreenreader",13,"mediaImage",338,"name",195,"path",196,"status",20],["null","__typename",156,"url",190,"width",191,"height",192,"alt",193,"title",13,"size",194,"mime",162],["null","__typename",79,"id",183,"title",184,"path",185,"wpTeaserText",186,"wpPromotedTeaserImage",13,"wpHeaderImage",340],{"__ref":341},"MediaImage:3364",["null","__typename",153,"id",203,"excludeFromScreenreader",13,"mediaImage",343,"name",208,"path",209,"status",20],["null","__typename",156,"url",205,"width",191,"height",192,"alt",206,"title",13,"size",207,"mime",162],["null","__typename",79,"id",198,"title",199,"path",200,"wpTeaserText",201,"wpPromotedTeaserImage",13,"wpHeaderImage",345],{"__ref":346},"MediaImage:3355",["null","__typename",153,"id",215,"excludeFromScreenreader",21,"mediaImage",348,"name",220,"path",221,"status",20],["null","__typename",156,"url",217,"width",191,"height",192,"alt",218,"title",13,"size",219,"mime",162],["null","__typename",79,"id",211,"title",212,"path",213,"wpTeaserText",13,"wpPromotedTeaserImage",13,"wpHeaderImage",350],{"__ref":351},"MediaImage:3303"]