{"id":1092,"date":"2025-01-31T15:31:55","date_gmt":"2025-01-31T14:31:55","guid":{"rendered":"http:\/\/sat-govtech.pl\/blog\/welcher-kontrast-auf-einer-website-entspricht-den-wcag-richtlinien\/"},"modified":"2025-01-31T15:31:55","modified_gmt":"2025-01-31T14:31:55","slug":"welcher-kontrast-auf-einer-website-entspricht-den-wcag-richtlinien","status":"publish","type":"post","link":"https:\/\/sat-govtech.pl\/de\/blog\/welcher-kontrast-auf-einer-website-entspricht-den-wcag-richtlinien\/","title":{"rendered":"Welcher Kontrast auf einer Website entspricht den WCAG-Richtlinien?"},"content":{"rendered":"

Website-Betreiber sollten auf einen h\u00e4ufigen Fehler achten, der bei der Gestaltung einer Website auftritt. Dieser Fehler ist eine h\u00e4ufige Ursache f\u00fcr digitale Ausgrenzung. Es geht um den Kontrast zwischen Text und Hintergrund. Ist dieser zu gering, kann der Inhalt unlesbar werden, insbesondere f\u00fcr \u00e4ltere Menschen und Menschen mit Sehbehinderungen. Wie kann man den Kontrast auf einer Website \u00fcberpr\u00fcfen und ihn an die WCAG-Richtlinien anpassen?
\u00dcbersetzt mit DeepL.com (kostenlose Version) <\/span><\/b> <\/span><\/p>\n

Kontrast \u2013 WCAG regelt dessen St\u00e4rke<\/h2>\n

Gem\u00e4\u00df den neuesten WCAG 2.2-Richtlinien sollte der Kontrast von der Schriftgr\u00f6\u00dfe abh\u00e4ngig sein. F\u00fcr normalen Text betr\u00e4gt der Mindestkontrastfaktor 4,5:1, w\u00e4hrend f\u00fcr gr\u00f6\u00dferen Text (z. B. 14 Punkt in Fettdruck oder 18 Punkt in Standardschrift) ein Kontrast von 3:1 ausreicht. Der Kontrast von 3:1 gilt auch f\u00fcr alle Arten von grafischen Inhalten wie Infografiken, Bilder, Banner oder Schaltfl\u00e4chen. <\/span> <\/span><\/p>\n

Die Verpflichtung zur Einhaltung der genannten Richtlinien gilt nicht f\u00fcr das Logo und andere Elemente der visuellen Identit\u00e4t. Gleiches gilt f\u00fcr Texte und Grafiken, die eine dekorative Funktion haben, nicht zur aktiven Benutzeroberfl\u00e4che der Website geh\u00f6ren oder Teil eines anderen grafischen Elements sind. <\/span> <\/span><\/p>\n

Wenn eine Website aufgrund ihrer visuellen Gestaltung die oben genannten WCAG-Richtlinien nicht erf\u00fcllt, sollte sie die M\u00f6glichkeit bieten, die Farben zu \u00e4ndern<\/strong>. Zu den Optionen k\u00f6nnen auch Versionen mit hohem Kontrast geh\u00f6ren.<\/span> <\/span><\/p>\n

Hochkontrastreiche Version der Website <\/span>\u2013 welche Farben?<\/span> <\/span><\/h2>\n

Die beliebteste und effektivste Variante f\u00fcr hohen Kontrast auf einer Website ist die Kombination aus schwarzem Hintergrund und gelbem Text. Diese Kombination sorgt f\u00fcr maximale Sichtbarkeit und minimiert das Risiko von Augenerm\u00fcdung. <\/span><\/p>\n

Die Farbanpassung in der kontrastreichen Version sollte die Bed\u00fcrfnisse verschiedener Sehbehinderungen ber\u00fccksichtigen. Daher sollte die Hinzuf\u00fcgung weiterer Farboptionen in Betracht gezogen werden, wie beispielsweise ein wei\u00dfer Hintergrund mit schwarzem Text (h\u00f6chstm\u00f6glicher Kontrast). <\/span>\u2013 21:1). Vielleicht <\/span> damit es f\u00fcr manche Nutzer komfortabler ist.<\/span> <\/span><\/p>\n

Warum ist Kontrast so wichtig?<\/span> <\/span><\/h2>\n

Ein angemessener Kontrast erm\u00f6glicht ein klares Lesen des Textes und eine einfachere Navigation auf der Website. Menschen mit Farbsehst\u00f6rungen<\/strong> haben Schwierigkeiten, die Elemente der Website zu unterscheiden, wenn der Kontrast zu gering ist. Hoch <\/span> Der Kontrast auf der Website verbessert die Lesbarkeit und reduziert die Belastung der Augen, was auch f\u00fcr \u00e4ltere Menschen von Bedeutung ist. <\/span><\/p>\n

Wie \u00fcberpr\u00fcft man den Kontrast auf einer Website?<\/h2>\n

Es lohnt sich, Online-Tools zu nutzen, mit denen Sie den Kontrast auf einer Website bewerten k\u00f6nnen. Eines davon ist unsere SAT-Plattform, die alle Elemente der Website analysiert und auf potenzielle Probleme hinweist. Im Zusammenhang mit <\/span>WCAG<\/a>-Kontrast enth\u00e4lt pr\u00e4zise Richtlinien \u2013 das Programm hat Zugriff darauf und kann selbst \u00fcberpr\u00fcfen, ob die Domain diese erf\u00fcllt. Es \u00fcberpr\u00fcft die Schriftgr\u00f6\u00dfe und den Hintergrund und hilft bei der Anpassung des Kontrasts, wenn Unregelm\u00e4\u00dfigkeiten festgestellt werden. <\/span> <\/span><\/p>\n

Wie kann man den Kontrast auf der Website \u00e4ndern?<\/h2>\n

Um den Kontrast einer Website \u00e4ndern zu k\u00f6nnen, muss deren Betreiber diese Option zur Verf\u00fcgung stellen. Die Funktion muss leicht zug\u00e4nglich sein \u2013 in der Regel in Form von Kacheln oder Schaltfl\u00e4chen, die im oberen Bereich der Seite angezeigt werden<\/strong>. Durch Anklicken einer solchen Kachel kann der Benutzer die gew\u00fcnschte Farbversion ausw\u00e4hlen. Die Website sollte dann automatisch die Farbt\u00f6ne \u00e4ndern. <\/span> <\/span><\/p>\n

\"\"

Kacheln zum \u00c4ndern des Kontrasts<\/p><\/div>\n

Wo sollte man noch auf den Kontrast achten?<\/span> <\/span><\/h2>\n

Es lohnt sich, nicht nur auf <\/span>den Kontrast auf Websites zu achten. Gem\u00e4\u00df <\/strong>dem Gesetz \u00fcber digitale Barrierefreiheit vom 4. April 2019<\/i><\/strong> sollten auch Inhalte, die in sozialen Medien und mobilen Anwendungen bereitgestellt werden, sowie Dokumente, die auf Websites ver\u00f6ffentlicht werden, einen angemessenen Kontrast aufweisen.<\/span> <\/span><\/p>\n

Durch die Verwendung eines angemessenen Kontrasts zwischen Text und Hintergrund auf der Website werden \u00e4ltere Menschen und Nutzer mit Sehbehinderungen nicht ausgeschlossen. Sie sollten Ihre Website daher unter diesem Gesichtspunkt analysieren und gegebenenfalls mehrere Kontrastversionen zur Auswahl hinzuf\u00fcgen. <\/span> <\/span><\/p>\n","protected":false},"excerpt":{"rendered":"

Website-Betreiber sollten auf einen h\u00e4ufigen Fehler achten, der bei der Gestaltung einer Website auftritt. Dieser Fehler ist eine h\u00e4ufige Ursache f\u00fcr digitale Ausgrenzung. Es geht um den Kontrast zwischen Text und Hintergrund. Ist dieser zu gering, kann der Inhalt unlesbar werden, insbesondere f\u00fcr \u00e4ltere Menschen und Menschen mit Sehbehinderungen. Wie kann man den Kontrast auf […]<\/p>\n","protected":false},"author":1,"featured_media":1186,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[24],"tags":[],"class_list":["post-1092","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-nicht-kategorisiert"],"acf":[],"_links":{"self":[{"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/posts\/1092","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/comments?post=1092"}],"version-history":[{"count":0,"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/posts\/1092\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/media\/1186"}],"wp:attachment":[{"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/media?parent=1092"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/categories?post=1092"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sat-govtech.pl\/de\/wp-json\/wp\/v2\/tags?post=1092"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}