SC 1.4.3/1.4.11: Zijn social media icoontjes die de bedrijfskleuren gebruiken uitgesloten van kleurcontrasteis?

[FerJo]

Vaak worden icoontjes gebruikt, als link, om aan te geven dat een artikel gedeeld kan worden op social media. Dat gebeurt soms met de specifieke bedrijfskleuren.

Facebook: een witte letter 'f' op een blauwe achtergrond Twitter: een wit vogeltje op een lichtblauwe achtergrond Linkedin: witte letters 'in' op een blauwe achtergrond enz...

Maar de bedrijfskleuren voldoen vaak niet aan de eisen. Voorbeeld: Twitter gebruikt een kleur blauw die niet voldoende contrasteert met het wit van het vogeltje. (Met 'voldoende' bedoel ik dan ≥ 3:1)

Discussiepunt

Omdat dit soort icoontjes gezien kunnen worden als logo's, hoeven ze niet te voldoen aan een contrasteis, óók als ze worden gebruikt als een interactief element (link/button ...).

[Aircl0wn]

Ik ken weinig websites die de wildgroei aan kleuren hanteert van verschillende socialmediakanalen. Meestal worden de iconen wel gebruikt, maar zijn de knoppen in een uniforme kleur en dan hou ik de contrasteis aan.

Ook voor eigen logo's geef ik er wel altijd feedback op als het niet voldoet.

Ik kan de redenatie volgen, maar heb tot nu toe altijd alleen maar het eigen logo als uitzondering gezien. Ze hebben de vrijheid om knoppen naar eigen stijl aan te passen zodat het wel voldoet.

[julezrulez]

Als de echte huisstijl wordt gebruikt zoals bijvoorbeeld de Twitter bird (zie https://about.twitter.com/en/who-we-are/brand-toolkit ), valt het wat mij betreft onder de uitzondering van logo's. Zodra afgeweken wordt van de Twitter-huisstijl en het contrast is te laag, dan voldoet het niet. Ik adviseer vaak wel om contrast te verhogen als het Twitter-logo conform de Twitterhuisstijl is gebruikt om contrast te verbeteren.

[gjccopinga]

Als logo's in hun 'eigen' kleuren op een webpagina worden gezet vallen ze wat mij betreft onder de uitzondering en zal ik geen opmerkingen maken over het contrast. Alleen als iemand er bewust voor kiest om de kleuren aan te passen dan moeten ze het ook zodanig doen dat het voldoende contrast heeft.

[rianrietveld]

Is de conclusie en de concensus dat het kleurcontrast van de oorspronkelijke logo's van social media niet hoeven te voldoen aan SC 1.4.3?

Geef een 👍 voor mee eens. Geef een 👎 voor niet mee eens en vertel waarom.

[rvantonisse]

👀

Omdat dit soort icoontjes gezien kunnen worden als logo's, hoeven ze niet te voldoen aan een contrasteis, óók als ze worden gebruikt als een interactief element (link/button ...).

👍 Ja een logo, exact bedoelt als uit de stijlgids van een organisatie, hoeft niet te voldoen aan contrast eisen voor tekst 1.4.3 en als graphic 1.4.11.

👀 Maar een knop is wat anders. Als deze alleen uit een icoon bestaat van betreffend merk, dan is dat het enige middel dat de vereiste visuele indicatie geeft dat er een knop zit.

👎 Hoewel het logo niet hoeft te voldoen, moet een knop of link met alleen dit logo erin wel voldoen aan de contrast eis! Een contrasterende knop rand, achtergrond of extra tekst is dan ook nodig voor de knop.

User Interface Components Visual information required to identify [user interface components](https://www.w3.org/TR/WCAG21/#dfn-user-interface components) and states, except for inactive components or where the appearance of the component is determined by the user agent and not modified by the author; - WCAG21#non-text-contrast

[gjccopinga]

Deze discussie is ook bij het W3C gevoerd. Zie onder andere https://github.com/w3c/wcag/issues/1739. Ik zie alleen nog niet echt een duidelijk antwoord daar. Maar, de discussie daar staat ook nog steeds open.

Volgens mij heb ik wel ergens gelezen dat ze voor Silver (WCAG 3.0) logo's niet meer onder de uitzondering voor contrast willen laten vallen. Maar ik kan het niet zo snel meer terug vinden. Weet iemand dit?

Maar, ik zie het voorbeeld van Roel ook nog niet helemaal voor me. Als ik een logo heb en voor de 'branding' hoeven de kleuren niet aangepast te worden, hoe maak ik er dan wel een interactieve component van die wel voldoende contrast heeft. Alleen het contrast met de achtergrond vergroten zegt nog niet veel meer. Dan weet ik misschien dat er 'iets' staat, maar hoe weet ik dan dat dat interactief is en wat het doel er van is? Als dat dan alsnog niet duidelijk is, wat is dan het nut van het vergroten van het contrast met een achtergrond (al dan niet door een rand of en andere achtergrondkleur?). Ja, met trial en error kan ik er dan wel op klikken om te kijken of er iets gebeurd en wat er dan gebeurd, maar is dat dan toegankelijker? Misschien beter dan dat je helemaal niet ziet dat er 'iets' staat, maar het wordt er niet veel beter op. Of mis ik iets?

Ik zie wel oplossingen in het aanbieden van een toegankelijk alternatief. Bijvoorbeeld een zelfde interactieve component die wel toegankelijk is. Dat zou bijvoorbeeld een link "Home" kunnen zijn in een menu als alternatief voor het logo wat ook naar de homepage verwijst. Maar moet dat dan ook voor social media icoontjes die verwijzen naar organisatie pagina's op die social media? Moet je dan ook tekst links aanbieden naast de icoon links? Dat zou het wel toegankelijker maken, maar de vraag is dus of we, linksom of rechtsom, dus wel een organisatie verplichten om bij logo's met een te laag contrast een toegankelijke oplossing te bieden als deze interactief is.

Een lastige discussie dit. Maar, ik ben denk ik wel over te halen om toch een toegankelijk alternatief dan te bieden. Alleen contrast verhogen met de achtergrond helpt voor mij niet genoeg. Dan ben ik meer voorstander van een toegankelijk alternatief bieden.