Podcast Episode 3 – APCA & WCAG

Einführung in den Podcast

Oliver Haake-Klink (00:00)
Die Aufnahme läuft. Dann sage ich, herzlich willkommen zu einer heutigen Podcast Folge. Und zwar habe ich den geschätzten Experten und verrückten Webdesigner und auch so ein bisschen nerdigen Menschen Marvin Siefke eingeladen. Und das freut mich sehr, dass du heute da dran teilnimmst, Marvin, und du zugesagt hast diese Einladung. ist super cool.

Genau, ich wollte ganz kurz, bevor du dir vielleicht ein kleines Intro gönnst oder was sagst zu dir, noch zu Beginn auf unseren distriko Werte-Kompass hinweisen. Das ist nämlich so eine Art Guidelines oder ein paar Richtlinien, die da einfach stehen, nach denen wir unsere Arbeit aufstellen und nach denen wir versuchen auch zu leben. Das heißt, wenn jemand hier in dem Podcast zuhört und gegebenenfalls dort irgendwelche Anmerkungen hat, dann gerne auch im Nachhinein einfach per Mail an podcast@distriko.de

was schreiben. Genau. Ja, ansonsten wir haben uns heute ein spannendes Thema herausgesucht. Ich würde das mal ganz kurz anteasern, Marvin, und dann kannst du gleich loslegen. Und zwar ist es so, die WCAG 2.2, also die Web Content Accessibility Guidelines, die haben, wenn ich es richtig weiß, in Kriterium 1.4.3, was zu dem Thema Farbkontraste

Inne, kann man da nachlesen und das deckt halt so Farb, Vordergrund zum Hintergrundthemen ab und da gibt es einen neuen Ansatz, APCA, wenn ich es richtig abgekürzt sage, der deckt da noch ein bisschen mehr ab und zu dem Thema hat der Marvin was vorbereitet und ist da in Vorleistung gegangen mit einem ziemlich coolen Werkzeug. The Stage is yours Marvin.

Die Bedeutung von Farbkontrasten in der Barrierefreiheit

Marvin (01:38)
Ja, ja.

Hallo Oliver, danke nochmal für die Einladung. Ich werde immer ganz rot, so wie du mich ankündigst. Die Leute, die die Videoversion sehen, die haben das bestimmt bemerkt, aber ich freue mich hier zu sein und ja, gehen wir mal rein. Also ich finde es ein wahnsinnig großes Thema.

Oliver Haake-Klink (02:00)
Genau.

Marvin (02:03)
Es ist auch oft das erste Thema, finde ich, was einem einfällt, wenn es so um barrierefreies Webdesign geht, weil anders als viele andere Aspekte, zum Beispiel so ganz wesentliche Sachen wie Semantik oder so, das ist ja gar nicht sichtbar. Kontrast ist ja was, das kann man eigentlich erst mal gut erklären, auch für Leute, die gar nicht so tief drinstecken in dem Thema. Und deshalb wird das eigentlich oft erwähnt. Und gleichzeitig habe ich das Gefühl,

Oliver Haake-Klink (02:19)
Hm.

stimmt.

Marvin (02:32)
Wir reden aber gar nicht so viel darüber oder gar nicht so tief darüber. Das können wir heute vielleicht ein Stück weit nachholen.

Oliver Haake-Klink (02:37)
Tatsächlich, das ist so, das freut mich auch sehr. Ich kann auch wirklich das total transparent machen. Ich muss mich da nicht irgendwie aufschlauen oder so, sondern ich sage wirklich ganz klar, transparent, dass ich mich, also ich weiß zwar, dass es eine WCAG 3 gibt, die inhaltlich irgendwo in der Zukunft es geben wird und dass da auch darauf hingearbeitet wird mit verschiedenen Anmerkungen und auch so eine Art Katalog an Ideen, die man da einreichen kann und so weiter. Nur aktuell gültig ist

WCAG 2.2 und das ist auch das, wonach man im besten Fall versuchen soll seine Arbeit irgendwie auszurichten. Trotzdem, es geht ja hier auch um Perspektiven in diesem Podcast und deswegen finde ich es halt cool, wenn man so bisschen auch einen Blick über den Tellerrand hinaus wagt. Ja, also grundsätzlich ist halt mal die Frage, was kann man denn neben dem eigentlichen Farbkontrast Vordergrund zum Hintergrund noch so für

Barrieren mitdenken, im besten Fall.

APCA: Ein neuer Ansatz für Farbkontraste

Marvin (03:34)
Das ist eine gute Frage, die kann man ganz unterschiedlich beantworten. Zum einen darum soll es weniger gehen, dass man die Farben auch barrierefrei anwenden muss. Dass die Farben nicht der Informationsträger sein dürfen. Wenn ich jetzt ein Formularfeld habe, was nicht korrekt ausgefüllt ist, reicht nicht die rote Umrahmung als Signal.

oder was heißt natürlich, also es gibt ja Menschen mit rot und grün Schwäche, die das dann nicht wahrnehmen können, wenn sie ein Feld nicht richtig ausgefüllt haben. Darum soll es heute weniger gehen, also wenn es nach mir geht. Ich finde, du hast ja schon den APCA erwähnt, den

Oliver Haake-Klink (04:09)
Das ist so. ⁓

Marvin (04:15)
Accessible Perception Contrast Algorithm. Das ist eigentlich eine Problemlösung. Ich würde vorher noch mal darauf zu sprechen kommen, welche Probleme wir eigentlich haben. Ich weiß auch nicht, ob Probleme vielleicht ein zu großes Wort ist, weil…

Das ist auf jeden Fall eine großartige Sache, dass das gibt, dieses Kontrastverhältnis. Ich finde das ist auch in der Form wie es ist sehr solide. Aber ich glaube wir müssen uns über so ein paar Sachen Gedanken machen. Und ich wundere mich zum Beispiel manchmal darüber.

Gleichzeitig finde ich es auch sehr logisch. Ich habe das Gefühl, wir reden fast nur über die Mindestkontraste. Das ist logisch, weil die sind so in der Form natürlich auch niedergeschrieben, in dem Kriterium, dass du genannt hast. Und dadurch, ja, das ist…

Oliver Haake-Klink (04:53)
Das stimmt.

Das stimmt, das stimmt.

Wo ist da Minimum? Wenn man dafür sensibilisiert ist, ich denke da reden wir eine Sprache beide. Es ist teilweise unglaublich, jetzt unabhängig von irgendwelchem Know-how in Sachen Barrierefreiheit oder irgendwelchen Skills, was teilweise für, aus meiner Sicht, schlechte Design-Ergebnisse da draußen am Markt kursieren, wo einfach

in den primitivsten Szenarien Kontraste einfach nicht vernünftig funktionieren, wo diese Grundfunktion nicht da ist, dass ich auf einem Smartphone irgendwie einen blassen Text auf einem hellen Hintergrund bei minimalem Lichteinfall nicht mehr wahrnehmen kann. Dafür brauche ich ja nicht gar nichts mehr zu sehen, sondern das ist für jeden anderen, der vielleicht eingeschränkt sieht oder aufgrund von einer Brille, wie wir, besser sieht.

Marvin (05:49)
Ja, da kommen ganz viele Faktoren rein. Genau so geht es natürlich darum, wenn ich mich wirklich auf diesen Mindestkontrast stürze, der versucht eigentlich schon zu berücksichtigen, dass es geringe Kontrastintensität gibt, also zum Beispiel in Form einer kleinen Sehschwäche. Das ist ja eigentlich der Gedanke, der dahinter steckt. Das wird schon berücksichtigt.

Oliver Haake-Klink (06:03)
Macht das.

Hmm.

Marvin (06:14)
In der Praxis reiht sich dann doch irgendwie auch eins zum anderen. Wir haben nicht für jede Information, die wir aufnehmen müssen, haben wir fünf Minuten Zeit, sondern müssen das irgendwie ganz schnell auf dem Smartphone auch mal checken. Wir müssen irgendwie, manchmal sind wir in Eile, müssen Dinge schnell lesen, manchmal werden wir abgelenkt. Das spielt da ja auch alles mit rein. Und wenn ich mich denn immer nur an diesem unteren Minimum eigentlich orientiere, weil da passt gerade meine Farbpalette, das Corporate,

Design so schön zusammen. Ich glaube, das hat ein Problem und das liegt glaube ich auch so ein bisschen an den Kontrastrechnern teilweise. Also nicht nur daran, dass es einfach diese Werte gibt, die festgeschrieben sind als Mindestkontrast, sondern auch

Oliver Haake-Klink (06:44)
Ja.

Marvin (06:56)
Es gibt so ein paar Kontrastrechner, die machen das gut. Da ist zum Beispiel eine Skala. Da siehst du, wenn du diesen Mindestkontrast hast von 4,5 für den Fließtext, siehst du 4,5 von 21 ist auch nicht überragend viel. Und ansonsten, wenn diese Zahl so vom Himmel fällt, so WCAG, Kontrastverhältnis 4,5 kannst du gar nichts damit anfangen. Wenn du das auf einer Skala siehst, finde ich das schon mal so bisschen besser als Einordnung.

Oliver Haake-Klink (07:01)
Mhm.

Nein.

Nein, das ist…

Marvin (07:21)
dass wir ein bisschen davon wegkommen, dass das wirklich das Maß der Dinge ist, wenn ich diesen Kontrast erreiche. Und gleichzeitig ist es natürlich auch verständlich, wenn ich den Standard und auch das Gesetz zur Barrierefreiheit erfülle, ist es natürlich auch verständlich, wenn man denkt, man ist jetzt auch barrierefrei und ich will auch gar nicht so kleinlich sein, aber vielleicht lohnt es sich jetzt manchmal doch ein bisschen weiter nach oben zu schauen.

Oliver Haake-Klink (07:22)
Okay.

Genau.

Das ist so.

Das ist so. Ich habe auch absichtlich ja dieses Spektrum und auch diese Informationen zu diesen Podcast-Folgen, die hier hoffentlich noch ein paar weitere entstehen sollen, auch so bisschen breiter gefächert, weil dieses Barrierefreiheitsthema, da muss man eher fairerweise sagen, hat ja immer noch auch in einigen Bereichen einfach so einen vielleicht einen negativen Touch. Oder es gibt Leute im Designbereich, die sagen, ach nee, dann bin ich ja so eingeschränkt, wenn ich mich da an irgendwelche Vorgaben halten muss und so. Aus meiner Sicht ist es Quatsch. Muss man jetzt vielleicht nicht weiter irgendwie aus

Klamüsern oder sowas, was ich da jetzt genau für Meinung dazu habe oder wer noch welche andere Meinung hat. Wenn du eine eigene andere mit hast, natürlich ist die willkommen. Generell

Ist ja die Frage, was kann denn dieser Kontrastrechner, den du gebaut hast, also den würde ich auch natürlich im Anschluss hier an diese Folge entsprechend verlinken, dass dort der Weg dorthin möglichst leicht ist. Das vielleicht auch als Info für Zuhörende, die dann im Nachhinein vielleicht irgendwie neugierig geworden sind. Du hast dir da, also wirklich aus meiner Sicht, ein kleines Meisterwerk hin gezaubert und

Der Kontrastrechner: Funktionen und Vorteile

Was kann denn dieser Kontrastrechner gegenüber diesen herkömmlichen Tools, die es schon so bekannt sind, noch mehr abdecken?

Marvin (08:57)
Der ist über die Jahre gewachsen. Ich habe glaube ich vor fünf Jahren in der ersten Version damit angefangen und das war ja bisschen brüchig noch. Also der hat funktioniert, aber sah nicht schön aus und entstand aber tatsächlich aus einem eigenen Bedürfnis heraus. Also das heißt, ich nutze ihn auch selber.

Ich habe mir zum Beispiel sehr viel Mühe gegeben, was schon die Eingabe der Farben betrifft. Also es gibt zum Beispiel einen Farbpicker, wir können Farben reinkopieren. Und da gibt es auch so paar sinnvolle Hacks, also zum Beispiel gerade bei den Hexadezimalwerten. Es ist egal, wenn da eine Raute vorangestellt ist oder nicht, weil zum Beispiel Photoshop hat diese oder Illustrator hat diese Raute neben Hexadezimalwerten nicht. Und wenn man das darüber kopiert, andere Farbrechner wollen die unbedingt haben. Also da gibt es auch irgendwie

Oliver Haake-Klink (09:42)
Ja, das stimmt.

Marvin (09:46)
Das ist eigentlich

auch eine Sache von Barrierefreiheit, dass man eigentlich… Also sind manchmal so Kleinigkeiten. Und mir war es eigentlich immer ein Anliegen, deshalb finde ich ganz spannend, dass du das auch angesprochen hast, dass du das nicht so empfindest.

Oliver Haake-Klink (09:49)
Genial. Ja, ist gut.

Marvin (10:07)
dass man irgendwie so streng sein will mit den Gesetzen. Ich finde, es ist manchmal schon relativ viel und wir müssen schon schauen, also wir auch als Gesellschaft oder wir als wer auch immer, müssen schon schauen, dass man eigentlich diese Regeln zur Barrierefreiheit, dass man die auch einigermaßen zugänglich abbildet. Und da habe ich auf jeden Fall manchmal einen Bedarf gesehen, da irgendwie noch was dran zu verändern. Es machen inzwischen auch sehr viele andere gut. Also es gibt auch andere gute Kontrastrechner. Ich will da meinen gar nicht so hervorheben. Aber

Oliver Haake-Klink (10:16)
Ja.

stimmt.

Marvin (10:36)
Man kann zum Beispiel die Schriftgröße einstellen, den Schrift Schnitt und muss dann gar nicht so tief jetzt schauen, nochmal nachlesen, was ist jetzt nach WCAG 2, eine große oder eine kleine Schrift. Man sieht die Skala, ich angesprochen habe und man sieht auch eine Vorschau. Man kann die Farbwerte auch teilen, also wenn man das zum Beispiel einem Kollegen schicken will oder einer Kollegin. Das ist glaube ich auch eine praktische Funktion oder manchmal auch, darauf aufmerksam zu machen. Also ich habe das…

Oliver Haake-Klink (11:02)
komplett. Das ist so.

Marvin (11:06)
Ich will gar nicht so spießig sein, aber ich habe das auch schon mal gemacht. Der hat eine Social Media Post gehabt und die auf hellgrau, hatten die grauen Texte stehen und ich dachte so, verstehe ich das nicht, eigentlich müsst ihr euch an, mal hier frei teilen. Ich kann das selber kaum lesen, ich trage eine Brille, aber mit einigermaßen gesunden Augen. Da habe ich mich sehr darüber gewundert, also man kann diese Farbwerte auch teilen.

Oliver Haake-Klink (11:16)
Besser. Besser. Ist… besser.

So.

Marvin (11:30)
und

Oliver Haake-Klink (11:30)
Ich…

Ich melde auch gerne proaktiv Barrieren, wenn die mir auffallen. Einfach aus dem Grund, weil ich das selber sehe, dass man irgendwo anpacken muss. Das kann einen manchmal triggern, kann einen manchmal belasten, wenn man selber einen hohen Anspruch an diese Dinge hat. Wenn man dann sieht, wie wenig andere dort vielleicht irgendwo auch einen Fokus drauf haben. Ganz ehrlich, ich habe einen Kontrastrechner, der ist sogar erwähnt in dem YouTube-Video, was ich mal vor geraumer Zeit gedreht habe,

wo es auch um dieses Kriterium 1.4.3 ging, weil da hab ich mich nämlich auch schon mal mit ein paar Leuten in der Branche so ein bisschen in die Haare kriege, weil da war nicht so richtig Einheit über diese Notwendigkeit dieser Kontrastverhältnisse da und ich habe dann auch einfach ohne da jetzt irgendjemanden persönlich vorzuführen auch nochmal für mich selber so ein Video abgedreht, das ist also auch auf dem YouTube Kanal bei uns online und da habe ich einen Kontrastrechner auch erwähnt namentlich, falls den jemand sich im Vergleich nochmal irgendwie anschauen möchte. So und das Spannende an der Sache ist, die Oberfläche dieses Kontrastrechners hat

erfüllt die Kriterien nicht. Was für Shit. Das ist ein namhaftes Tool von einem großen Unternehmen, was in dem Bereich hauptberuflich Produkte vermarktet. Da ist sogar der Name gefallen von einem dieser Produkte, die du vorhin schon genannt hast. Da frage ich mich auch, wie schwach wird damit umgegangen. Auf der einen Seite werden Werkzeuge vermarktet oder auch bereitgestellt, was ja wichtig ist.

Marvin (12:50)
Ja.

Oliver Haake-Klink (12:50)
und zum anderen zeigt man, aber man guckt nicht, wer nutzt denn diese Tools alles und deswegen fand ich das eben gerade spannend, auch mit diesem Raute-Symbol oder der Zugänglichkeit, weil was mir aufgefallen ist jetzt auch, ich habe jetzt nicht das im Detail tief getestet und jetzt vorab und so weiter, aber ich habe mir einfach eben auch noch mal kurz in Vorbereitung so paar Sachen angeguckt, wie zum Beispiel auch die Keyboard-Navigation und so weiter. Das macht alles auf mich einen sehr, sehr schlüssigen Eindruck und also…

Das scheint ziemlich gut zugänglich zu sein in der Richtung. Ich hoffe, ich sag da nichts Falsches, aber so wirkt es auf mich auf den ersten Blick.

Marvin (13:16)
Ja.

Ja, also ich fand das auch gut, was du gerade eben gesagt hast, dass du auch manchmal darauf aufmerksam machst. Es geht ja gar nicht darum, dass man unfehlbar ist. Das will ich auch von meinen eigenen Werkzeugen nicht sagen und ich freue mich da auch über jeden Hinweis. Also das kann ich auch so vorweg sagen. Ich habe also, ich habe natürlich versucht, vieles zu berücksichtigen, was sozusagen geht. Ich glaube…

Da ergibt sich ein hohes Maß an Barrierefreiheit, aber ich freue mich da auch immer, wenn mich jemand darauf hinweist. Ist ja, also was Besseres kann es ja eigentlich nicht geben. Also weil es gibt, wir haben eigentlich alle irgendwo, also diese Vorstellung von 100 Prozent Barrierefreiheit, da haben wir auch schon mal privat drüber gesprochen, das ist ja auch einfach schwierig. Manchmal tut sich da einfach was auf, was man vielleicht gar nicht bemerkt und

Oliver Haake-Klink (14:04)
Ja.

Herausforderungen der WCAG 2 und Lesbarkeit

Marvin (14:08)
Das ist doch super, wenn man da einen Hinweis bekommt. Also gerne auch bei mir. nochmal auf das Kontrastverhältnis zurückzukommen und auf, du hast vorhin auch schon von schlechter Gestaltung gesprochen. Es ist ja auch so, die Vorgaben sind ja auch wenig granular. Also es gibt ja jetzt eigentlich in den WCAG 2

Wir haben natürlich die zwei Konformitätsstufen und dann gibt es eigentlich zwei Mindestkontrastwerte für grob gesagt, für normalen Text, so wird das, glaube ich, auch genannt, und großen Text, der noch mal unterscheidet mit Bold und Schriftgröße, aber alles recht grob. Und dadurch entsteht eigentlich auch so bisschen so ein Vakuum. Da würde mich auch mal deine Meinung interessieren, weil

Oliver Haake-Klink (14:42)
Hmm.

Marvin (15:01)
Es ist relativ interessant, dass die WCAG 2 gar keine Vorgaben haben zur Mindestschriftgröße. Ich weiß, das wird auch kritisch gesehen. Es gibt zumindest die Meinung, man kann das lösen, weil gleichzeitig ist vorgeschrieben, dass man die Seite skalieren kann. Andererseits, dass aber natürlich…

Oliver Haake-Klink (15:08)
Mhm.

Hmm.

Marvin (15:21)
Manchmal auch ein Problem der Lesbarkeit. Da gibt es ja auch Seiten, die stoße ich alle drei Tage wieder drauf auf so eine Seite. Die hat zum Beispiel so Light-Schnitt. Also ganz, ganz dünn. Vielleicht nicht die Größte. Also, sagen wir mal, Schriftschnitt irgendwie 300 und dann auch irgendwie 15 Pixel oder so. Und dann noch Fließ – Text. Da habe ich Mühe, mir die Information rauszusuchen. Das strengt mich richtig an. Da vergeht mir wirklich die Lust, mich auf dieser Seite zu bewegen.

Oliver Haake-Klink (15:27)
…

So.

Ja.

Das ist total frustrierend.

Marvin (15:49)
Und gleichzeitig ist das aber, also dieser Punkt, gar kein Problem im Sinne der WCAG 2. Und das ist schon auch interessant.

Oliver Haake-Klink (15:57)
Ich

gehe da komplett mit dir, bin ich mit dir in Übereinstimmung. Ob da jetzt nun der AA oder AAA Messwert oder die Grundlage als Regel irgendwie zugrunde liegt, ich finde immer diese Mindestanforderung ist nicht ausreichend oft.

Es muss eben den Anforderungen genüge tun und ich habe mir dann auch ein paar im Zuge von Webprojekten paar Skills angeeignet, wo ich dann intuitiv darauf achte, von vornherein gewisse Schriftgrößen nicht zu unterschreiten. Ist das richtig? Also, man von vornherein weiß, wenn ich Schriftgröße 12 als Messlatte in Pixel ausgedrückt vornehme, die nicht zu unterschreiten und dann auch das, was ich mit Headings

in einem chronologischen Maß das aufgebaut habe, wo ich das in einem Designsystem global verankere, dass ich das auch so bisschen hierarchisch von oben nach unten von einer großen Überschrift zu einer kleineren Überschrift anordne. Das ist einfach so wie soll ich das beschreiben? Da muss man auch nicht jetzt irgendwie sich mit barrierefrei im ersten Schritt beschäftigen, hauptberuflich denke ich, sondern das hat irgendwie einfach was mit einer guten Funktionalität zu tun.

Marvin (17:12)
Ja, natürlich auch, ich glaube vieles hängt auch sehr mit den Ausgangsbedingungen zusammen. Also es ist, ich glaube immer was anderes. Also ich meine, ich habe hier natürlich moderne Technik stehen, ich habe hier einen guten Monitor stehen, der die Farben eigentlich brillant darstellt. Ich habe hier eigentlich eine gute Beleuchtungssituation.

Oliver Haake-Klink (17:28)
Yep.

Marvin (17:34)
Da muss ich natürlich auch aufpassen, dass ich bei der Gestaltung nicht von diesen optimalen Situationen ausgehe. Ich brauche das natürlich professionell zu arbeiten, aber da muss man natürlich aufpassen. Und umgekehrt… Entschuldigung.

Oliver Haake-Klink (17:39)
Hmm.

Technische Bedingungen und Barrierefreiheit

Ich wollte auch gerade diese technischen Bedingungen da noch einfach nochmal den Ball zurückspielen. Ich habe da auch mal von einem selbst renommierten Menschen in dieser Branche mir eine auf die Mütze geholt, weil ich das Barrierefreiheitsthema angeführt habe und habe einen Post darüber gemacht. Das war seinerzeit in einem Urlaub, ich glaube in Griechenland gewesen. Und dort habe ich das Problem gehabt, dass ich auf einem Smartphone

einen sehr, sehr schwachen Empfang hatte. Es gab auch ein öffentliches Wlan, das war natürlich von vielen Leuten genutzt und grundsätzlich waren die mobilen Daten einfach…

miserabel. Ich habe dann einfach das für mich selbst erfahren, wie toll das ist. Ich muss jetzt nicht mir die Schulter streicheln, aber ich habe dann natürlich Vergleiche gemacht zu Seiten, die ich in Deutschland vielleicht regelmäßig aufrufe und dann wollte ich das als Test-Szenario genutzt, paar eigene Seiten mal anzugucken, die wir selber gehostet haben oder auch von Leuten, wo ich weiß, dass die sich damit auskennen und so.

geht einfach gar nicht anders. glaube, das geht dir so ähnlich. Das guckt man sich immer so an. Dieses Kriterium, dann wurde mir das zerpflückt, so von wegen, was hat jetzt die Internet-Verbindung mit der Barrierefreiheit zu tun? Natürlich hat die nichts damit zu tun. Ich kann auch eine Website mit, was weiß ich, was für riesengroßen Grafiken in einer PNG-Datei mit 10 Megabyte bauen, habe dann hinterher dort eine Website, die ist WCAG oder was weiß ich, was für BFSG konform, aber ist auf keinem Endgerät mehr in der mobilen

Marvin (18:50)
Ja.

Digitale Barrieren und Gerätevielfalt

Oliver Haake-Klink (19:15)
Situation irgendwie gescheit aufrufbar und ich finde das ist genauso eine digitale Barriere.

Marvin (19:20)
Ja, auf jeden Fall. das… Ich bin da komplett deiner Meinung. Ich glaube, wir sollten sowieso Websites immer von unterschiedlichen Geräten aus testen, ich glaube auch, um auch nochmal so auf die Schriftgröße zurückzukommen. Ich bin zwar zum Beispiel… Ich habe eben gesagt, ich gehe so von optimalen Bedingungen aus. Umgekehrt kann es auch ein Problem sein, wenn man zum Beispiel ein älteres Display hat. Also wenn man jetzt zum Beispiel…

Oliver Haake-Klink (19:32)
Yup.

Marvin (19:48)
Es gab ja die, also jetzt ist es relativ häufig, dass wir eine relativ hohe Pixeldichte haben, auch am Desktopcomputer. Apple nennt das ja Retina. Das ist ja relativ weit gebräuchlich. Wenn ich jetzt aber eine Website gestalte mit einem Display, der eine normale Pixeldichte hat und nehme da zum Beispiel einen Schrift-Schnitt, sagen wir mal 300, der irgendwie gut aussieht, dann sieht der tatsächlich bei mir, an meinem Retina-Display, aber wieder sehr, sehr, sehr dünn aus und kaum lesbar. Also

Oliver Haake-Klink (20:00)
Hm.

Marvin (20:17)
Wir müssen einfach auch unabhängig von den Regeln die Website auf verschiedenen Geräten im besten Fall testen können. Das ist eigentlich ganz wichtig. Und das sind auch Sachen, die kann man ja auch gar nicht niederschreiben in den WCAG, sondern es gehört einfach dazu. Also das sollte man einfach machen.

Oliver Haake-Klink (20:20)
Ja.

Hab ich.

Das sind auch die Dinge, da kann ich auch vielleicht für die Allgemeinheit sprechen. Ich meine, wir begeben uns hier beide am Markt irgendwie auch als, ich denke, Unternehmer, die in Eigenregie ein Stück weit auch vielleicht sogar eine Marktbegleitungssituation haben. Trotzdem, ja, wie soll ich sagen? Also da sieht man wirklich oftmals auch Dinge am Markt, die werden teilweise für horrendes Geld vermarktet, wo solche grundlegenden Features einfach nicht drin sind, wo noch nicht mal irgendwelche Responsivität gescheit funktioniert. Auf mehreren Geräten habe ich jetzt auch aktuell ein Projekt gehabt,

Farbkontraste und Wahrnehmung

eine mobile Ansicht, wo eine Darstellung so verändert, dass dann Textinhalte, die für jede Person lesbar sein sollten, einfach ausgeblendet waren in der responsiven Ansicht. Also in so einem Test habe ich das eben aufgedeckt.

Richtig richtig schwach. Okay, lassen wir uns noch mal ganz kurz, ohne jetzt irgendwie aufs Gas zu treten, aber ich versuche so vielleicht den Zeitrahmen so bisschen einzuhalten, dass wir nicht zu sehr das sprengen. Wir können das an anderer Stelle gerne, wenn wir mehrere Themen finden, ausdehnen, kein Thema. Aber noch mal kurz zurück zu diesem Farbkontrastthema und auch zu den Farben allgemein. Also jetzt haben wir uns über Kontraste unterhalten. Du hast auch vorhin schon was von der Rot-Grün-Schwäche gesagt.

Marvin (21:32)
Ja.

Oliver Haake-Klink (21:47)
Was ist denn da vielleicht auch noch, also verstehe ich das richtig, dass es neben diesen natürlich verschiedenen Farbsehschwächen, die es geben kann, dass diese APCA auch noch einfach dort mehr, also in diesem Schema Personen mitdenkt einfach, dass das auch gegebenenfalls auch Menschen, die Farben anders wahrnehmen, so was noch mitgedacht sind. Ist das richtig oder habe ich das falsch verstanden?

Marvin (22:13)
Bin mir gar nicht so sicher, ob ich das so formulieren würde. Ich glaube, ich würde mal ein bisschen weiter von vorne anfangen. Also dieser APCA, also das steht für Accessible Perception Contrast Algorithm. Also wenn man das auf Deutsch übersetzt, klingt das ein bisschen holprig, aber zugänglicher,

wahrnehmungsbeeinflusster Kontrast-Algorithmus. Also es geht sehr eigentlich um die Wahrnehmung und das ist eigentlich der Unterschied zu dem Kontrastverhältnis aus den WCAG 2. Also wir reden jetzt wirklich mehr über die Wahrnehmung, wie wir das auch als Menschen empfinden. Mit den WCAG 2 haben wir dieses Kontrastverhältnis und das ist sehr sehr sehr linear. Also das ist eine ganz einfache mathematische Formel.

Der Accessible Perception Contrast Algorithm (APCA)

Und so funktioniert aber unser Augenlicht nicht. Also es ist nicht mathematisch. Wir nehmen Farben nicht mathematisch wahr. Da gibt es einfach ein paar Sonderfälle. Die können dann nämlich auch zu theoretisch falsch positiven und falsch negativen Ergebnissen führen mit einem Kontrastrechner. Da gibt es dieses Beispiel. Man kann zum Beispiel

Oliver Haake-Klink (23:05)
Ja, spannend.

Ne.

Marvin (23:29)
Wir können das gerne mal tun, wenn ich hier den Bildschirm freigeben darf und du müsstest das beschreiben. Ist das für dich in Ordnung? Oder wollen wir lieber…

Oliver Haake-Klink (23:36)
Wir können.

Wir können das so versuchen. Ansonsten dadurch, dass diese Bildschirmteilung jetzt nicht so perfekt, glaube ich, für alle Endgeräte wahrnehmbar ist, auch je nachdem, wo jetzt diese Folge erscheint. Vielleicht versuchst du doch mal einfach so viel, wie es geht, irgendwie in Worten auszudrücken. Dann ist es zumindest auch für Menschen jetzt mit wahrnehmbar, die es ausschließlich nur hören oder irgendwie das Transkript lesen. Und dann ja, wie gesagt, ich verspreche, ich bearbeite das gescheit nach und dann ist da eine Verlinkung auch innerhalb dieser Podcast Folgen auf die

Marvin (23:54)
Ja.

Oliver Haake-Klink (24:07)
diesen genannten Inhalt drin. Dann kann das sowieso auch wie eingangs schon gesagt, wenn jetzt, wenn wir jetzt hier irgendwelche Fehler machen, wenn wir Dinge vergessen, Leute nicht mitdenken und so was im Nachhinein, bitte das auch wirklich kommentieren oder auch uns das Feedback dazu geben. Das ist wie gesagt hier alles semi-professionell und noch alles in der der Mache und im Einstieg. Also versuch doch mal einfach, dass so viel wie es geht, irgendwie mit Worten zu erklären, wenn es dir möglich ist.

Marvin (24:07)
Ja.

Ich glaube

das ist gut sich das mal anzuschauen, weil es gibt ganz spannende Beispiele. Mir geht es als Gestalter so, dass man manchmal denkt man hat so ein Gefühl für den Kontrast-Algorithmus, für das Kontrastverhältnis meine ich. Man hat eigentlich inzwischen sieht man an Websites sehr gut, das wird jetzt sehr eng nach dem WCAG 2, dass

Ich meine, dass man da manchmal ein Gefühl hat, aber man kann sich auch dolle täuschen, weil es gibt bestimmte Farbkombinationen, die eben von dem Auge anders wahrgenommen werden als diese Mathematik dahinter. Und ein ganz gutes Beispiel, ganz häufiges Beispiel ist zum Beispiel, ich habe zwei Buttons.

Auf einem Button, Button 1 sozusagen, haben wir schwarzen Text auf orangenem Hintergrund und auf Button 2 steht der weiße Text auf orangenem Hintergrund, gleiches Orange. Und wenn man nach den WCAG 2 geht, nach diesem Kontrastverhältnis, hat Schwarz auf Orange einen viel besseren Wert als Weiß auf Orange. Besser wahrgenommen in Umfragen und mir persönlich geht das auch so, wird aber weiß.

Oliver Haake-Klink (25:39)
Absolut.

Marvin (25:39)
auf orangenem Text

und weiß auf orangenem Text ist aber, also je nachdem welches Orange man dann nimmt, aber eigentlich in der Regel wird das sehr schwierig das regelkonform abzubilden, weil man da nicht über diesen Mindestkontrast kommt. Es ist aber für sehr viele Menschen aber besser lesbar als der schwarze Text auf orangenem Hintergrund. Und das finde ich schon insofern ganz spannend.

Oliver Haake-Klink (25:55)
ist so.

Marvin (26:07)
Da haben wir genau das, also da haben wir nämlich ein Ergebnis, was uns jetzt eigentlich nicht weiterhilft. Also wenn wir jetzt zum Beispiel diesen, es kann jetzt eine Schlussfolgerung sein, wir nehmen jetzt einfach den schwarzen Text auf dem orangenen Button, weil wir damit relativ sicher regelkonform sind. Gewonnen für die menschliche Wahrnehmung ist damit aber nichts, muss man ehrlicherweise sagen.

Oliver Haake-Klink (26:16)
stimmt.

Marvin (26:29)
Der APCA hat versucht diese Farben oder diese Wahrnehmung anzugleichen. Also es ist nicht mehr ganz linear, sondern ist deutlich komplexer und berechnet den Kontrast auch ganz anders. Da erhält man einen sogenannten LC-Wert zurück für Light Contrasts. Da können wir uns zum Beispiel ablesen.

Oliver Haake-Klink (26:39)
Hmm.

Hm.

Das

Marvin (26:58)
nochmal auf die beiden Button zurückzukommen, beide auf Orange, einer mit schwarzen Text, einer mit weißen Text, haben wir nämlich genau ein umgekehrtes Ergebnis. Da fällt der, je nachdem welche Schriftgröße man hat natürlich, aber da fällt der Button mit dem schwarzen Text eher durch und der Button mit dem weißen Text kommt eher durch. Also genau ein umgekehrtes Ergebnis, was sich aber eher mit der menschlichen Wahrnehmung deckt.

Oliver Haake-Klink (27:00)
Hm.

Ja.

Mhm.

Marvin (27:26)
Das ist auf jeden Fall eine spannende Sache und es wird angenommen, du hast ja auch schon angedeutet, so mit dem WCAG 3, du hast ja schon angesprochen, es wird wahrscheinlich in irgendeiner Art und Weise da eine Änderung geben, also vielleicht wird es implementiert. Ich bin da ehrlich gesagt nicht ganz up to date, ich glaube das ist auch sehr undurchsichtig, weil wir sind ja noch sehr am Anfang, also das, die…

Oliver Haake-Klink (27:42)
Hm.

Marvin (27:51)
Das dauert noch sehr lange, bis der Stein ins Rollen kommt. Wir haben vor ein paar Monaten, da ging es darum, den Zeitplan aufzustellen. Ich glaube, man war da auch schon bisschen im Verzug. Ehe das irgendwann in der finalen Version vorliegt, ehe das europäisches Recht ist, ehe das angeglichen wird an deutsches Recht, ich bin jetzt kein Jurist, aber ich glaube, da vergehen noch ein paar Jahre.

Oliver Haake-Klink (27:58)
Das stimmt.

Ja. Das kannst du annehmen.

Ja.

Marvin (28:20)
Ja, trotzdem ist

das aber sehr, sehr sinnvoll, sich da jetzt schon damit zu beschäftigen, weil wenn wir über Barrierefreiheit reden, wollen wir eigentlich nicht nur darüber reden, was jetzt regelkonform ist, sondern was auch tatsächlich und hilft, Barrieren abzubauen. Und das heißt aber natürlich auch, das kann nur eine zusätzliche Methode sein. Also wir müssen, wenn wir jetzt von Barrierefreiheit reden, wir müssen natürlich, auch wenn es jetzt

Oliver Haake-Klink (28:27)
Absolut.

Mh.

Richtig.

Regelkonformität versus Menschliche Wahrnehmung

Marvin (28:48)
diese angesprochenen ich habe das falsch positiv falsch negativ genannt wir müssen uns trotzdem an die WCAG 2 halten das ist ganz ganz ganz klar und können aber den APCA berücksichtigen zum Beispiel würde ich das unbedingt empfehlen wenn man jetzt darüber nachdenkt eine neue Farbpalette zu entwickeln für sein Corporate Design oder so also bei solchen Sachen die relativ komplex relativ umfassend sind würde ich sagen also auf jeden Fall jetzt schon berücksichtigen wenn man es kann

Oliver Haake-Klink (29:06)
Das

Absolut.

Marvin (29:19)
Ja und…

Oliver Haake-Klink (29:21)
Das ist so, das ist so. Ich hake da ganz kurz ein. Ich hoffe das ist in Ordnung. Ich möchte nicht unterbrechen, wenn du noch mehr zu sagen hast.

Marvin (29:25)
Ja.

Oliver Haake-Klink (29:27)
Ich kann das so zu 100 Prozent bestätigen, wie du das gerade auch gesagt hast. Frühzeitig Dinge mitdenken spart eine Menge Geld, spart eine Menge Arbeit und das zeigt vor allen Dingen auch, ich glaube, in diesen 30 Minuten, wo wir uns jetzt hier über das Thema unterhalten, auch noch mal vielleicht so bisschen kleiner Werbeblock für unsere Branche. Das Thema Webdesign wird ja immer vermeintlich leichter umsetzbar. Immer weniger Leute meinen jetzt irgendwie dort Expertise ins Haus zu holen oder trauen sich selbst zu mit irgendwelchen Page-Builder-Lösungen und so was zusammen

zu bauen. Eine professionelle Website, die ein Unternehmen nach außen hin repräsentiert, die sollte definitiv von Menschen gebaut werden, die das sich zur Aufgabe gemacht haben. Das kann einer von uns beiden hier sein natürlich. Das kann aber auch jemand sein, der das irgendwie zum Beruf sich gemacht hat. Fakt ist,

Es ist einfach keine Sache, dass ich irgendeinem AI-Tool, irgendeinen Prompt gebe und mir dann irgendeine Landing-Page mal eben schnell da ausgeben lasse. Klar kostet die dann halt eben nur 200 Euro oder 300, aber die hat nicht dieselbe Funktion wie jemand, der dort Expertise hat, der viele Jahre Erfahrung hat, der jetzt den Markt beobachtet.

Das vielleicht so für mich nochmal und für dich, Marvin, auch so als kleines Commitment. Ich glaube, die Kreativ-Branche ist noch lange nicht am Ende, nur weil jetzt Dinge dort als Unterstützungsinstrumente kommen. Das vielleicht noch so als fast schon Schlusswort, wenn das okay ist. Ich wollte nur ganz gerne einfach noch zum einen sagen, was ich auch gut fand eben, was du mit dieser Mathematikformel letztendlich gesagt hast. Wir reden hier ja nicht über irgendwelche mathematischen Formeln, die wir erfüllen wollen, wo hinterher das Ergebnis stimmt, sondern es

Es geht um Nutzbarkeit für Menschen. Wir haben hier eine Regelkonformität zur einen Seite, aber im Endeffekt das Ziel muss ja sein, dass Menschen dort möglichst in einem breiten Spektrum mit so einem Produkt hinterher arbeiten können. Und nur wenn das erfüllt ist, dann ist auch meiner Meinung nach das Ziel erreicht.

Und natürlich bringt diese ganze Gesetzgebung dort im besten Fall ein bisschen Tempo rein. Aber das sind alles Sachen, die sind normalerweise wie das kleine Einmaleins und wie ein ABC als Grundlage zu sehen. Das ist so mein Fazit, was ich schon fast ziehen will. Das kannst du natürlich auch noch gerne abrunden. Ansonsten viel mehr ist im ersten Step jetzt gar nicht dazu zu sagen, wie ich finde.

Marvin (31:42)
Ja.

Ja, ich glaube, ich würde noch kurz darauf zu sprechen kommen. Also wo man ein bisschen aufpassen muss, wir müssen schauen, dass die Regeln nicht zu komplex werden. Und ich glaube, das wird noch mal spannend, wie sich dann der APCA final entwickelt. Also das ist ja alles noch nicht in Stein gemeißelt. Und es ist immer eine Gratwanderung, die wir vorhin auch schon angesprochen haben, wie man das Thema einerseits, also diese Regeln zuständig zugänglich updatet.

Oliver Haake-Klink (32:00)
Ja.

Marvin (32:16)
nicht zuständig zugänglich abbildet und gleichermaßen auf Sonderfälle gegebenenfalls eingehen kann. Also nicht so grob zu sein, dass es für bestimmte Fälle nicht funktioniert. Das ist sehr sehr sehr schwer. Also wir merken das auch jetzt schon teilweise in manchen Kriterien. Muss ich jedes mal ein bisschen nachlesen, ehrlich gesagt. Also ich bin da ganz ehrlich. Also ja.

Oliver Haake-Klink (32:37)
Das ist so.

Das ist so,

das macht jeder Jurist so, Marvin. Die wenigsten haben die Paragraphen dort im Kopf und die haben ihre Lexika oder heute auch irgendwelche digitalen Dinge. Ist nichts anderes. Also so sehe es ich, persönlich ist meine Meinung. Man muss die Sachen nicht wissen, im Kopf haben oder auswendig können. Man muss wissen, wo sie stehen und man muss wissen, welche Sachen wendet man an und setzt man ein.

Marvin (32:45)
Ja.

Ja.

Ja.

Ja, und da gibt es zum Beispiel jetzt für den APCA, da gibt es eine Matrix, das ist noch relativ wichtig diese anzusprechen, also eine Art Tabelle. Da kann ich nämlich genau sehen, welche Schriftgröße habe ich, welcher Schrift-Schnitt und welcher LC-Wert, also letztendlich welcher Kontrast. Und daraus geht dann auch auf, welche Kontraste kann ich sozusagen verwenden und welche sind für Fließtext geeignet. Das ist ja auch noch mal eine neue Unterscheidung, die aber meines Erachtens auch sinnvoll ist. Ja, und zum Beispiel

Oliver Haake-Klink (33:20)
Ja.

Marvin (33:35)
Mein Kontrastrechner hat das integriert, da kann man das einstellen, welche Schriftgröße man hat, da muss man da nicht sozusagen diese Zelle in der Tabelle raussuchen, sondern das geht relativ easy. Es gibt, wie gesagt, auch andere gute Kontrastrechner. Ich will mich da gar nicht so hervorheben, weil ich habe das Gefühl, wir reden hier eher über, ja, Allgemeingut sozusagen und da haben auch andere ihre Aufmerksamkeit verdient. Aber ja, also das…

Oliver Haake-Klink (33:55)
Das war’s.

Marvin (34:03)
Das wird glaube ich nochmal der Punkt, wenn wir denn irgendwann über die WCAG 3 reden, wie das final aussieht, aber man kann davon ausgehen, dass irgendeine Art von Änderung kommt und meine Empfehlung wäre, jetzt wirklich ein Schlusswort zu finden, heute schon beides zu berücksichtigen. Das Kontrastverhältnis ist das Einfache, wie wir es kennen und den APCA.

Oliver Haake-Klink (34:24)
Das hast du sehr schön auf den Punkt gebracht. Ja, okay, ich denke das ist natürlich bei weitem nicht alles gesagt. Für die erste Episode zu dem Thema hier, denke ich, ist es ganz gut angesprochen und die ersten Dinge getan.

Zukunft der Barrierefreiheit im Web

Noch mal ganz vielen Dank, dass du meine Einladung angenommen hast, Marvin. Ich verspreche, ich verlinke wie gesagt die genannten Werkzeuge und kann auch jeden, allen Personen, die zuhören, empfehlen, die Ressourcen dort sich mal genauer anzuschauen. Wie gesagt, wenn Marvin nicht einer von denen wäre, die ich auch ganz ganz weit vorne sehe in der Branche, dann wäre er sicherlich nicht hier.

Marvin (35:03)
Ich werde sie wieder rot.

Oliver Haake-Klink (35:04)
Und er hat

wirklich, wie ich persönlich finde, einen sehr guten Drive und ein sehr, sehr hohes Verständnis dafür, wie man Ästhetik und Zugänglichkeit zusammenbringt. Kann ich so sagen. Das ist definitiv so, Marvin. Ich habe da großen Respekt. Du machst einen sehr guten Job und mir gefallen die Ergebnisse. Und das sieht alles sehr …

ansprechend aus und hat eine sehr hohe technische Qualität. Das ist so meine langjährige Meinung zu deiner Arbeit. Kann ich gerne ruhig so sagen, das ist wirklich so.

Marvin (35:38)
Vielen herzlichen Dank und schön, dass ich hier sein durfte. Ich freue mich ganz auf die weiteren Folgen deines Formats. Sehr spannend.

Oliver Haake-Klink (35:51)
Schauen wir, das ist ganz am Anfang und in den Kinderschuhen sozusagen. Wir gucken, ob die Resonanz entsprechend da ist. Das ist ein reines Freestyle-Format hier. Wir zahlen uns hier nicht irgendwelche horrenden Summen gegenseitig, sondern es geht einfach darum, ja, auch in spannenden Zeiten, wo es aktuell natürlich auch viele Dinge im Umbruch und so weiter sind, auch was die ganzen technologischen Dinge…

Marvin (36:07)
Ja.

Oliver Haake-Klink (36:15)
anbelangt, wo man einfach fast gar nicht mithalten kann, weil es einfach so permanent so viel Neues kommt, glaube ich, ist es ganz gut, wenn man sich dort so bisschen verbündet. Deswegen ist das bisschen die Initiative dahinter. In diesem Sinne, lasst das mal einfach im Raum stehen und wir machen mal den Deckel für heute drauf. Okay, vielen Dank.

Marvin (36:19)
Ja.

vielen herzlichen Dank.

Kontrastrechner als Werkzeug auf barrierefreies.design