Det uppskattas att cirka 8% av männen och 0,5% av kvinnorna är födda colorblind. Det kan verka som ett lågt antal men om du designar för en stor publik, är det definitivt mindre än önskvärt att ha en webbplats som är oanvändbar för åtta av hundra män.
Lyckligtvis kan du ganska enkelt se till att din webbplats är färgblindvänlig genom att alltid ha i åtanke informationen nedan. Vi tar en titt på vilken färgblindhet som verkligen betyder och hur du kan anpassa dina mönster baserat på några enkla principer.
Jag vill börja med att säga att även om jag inte alls är en opthamolog, är de flesta männen i min familj färgblind och några exempel som anges nedan har drivits av bonafide colorblind män. Om du är en färgblind person kan din beskrivning av exemplen nedan vara något eller till och med väsentligt annorlunda eftersom inga två uppsättning färgblindade ögon kommer att vara desamma.
Vetenskapen
En diskussion om färgblindhet kan bli riktigt vetenskaplig väldigt snabb. Villkor som protanopia och anomalous trichromacy är tillräckligt för att få till och med betydligt intelligenta folk som är bundna och förvirrade.
Lyckligtvis, som designer behöver du inte bli expert på färgblindhet. Istället kan du göra allmänt tillämpliga generaliseringar om vilka färgblind användare som gör och inte har problem att uppfatta. Detta sparar inte bara en vetenskaplig lektion, det hjälper till att säkerställa att du utformar så att nästan alla färgblind användare effektivt kan använda din webbplats i stället för bara en enda typ.
Tänk på detta när du läser informationen nedan. Varje uttalande som görs kommer inte att vara sant för alla colorblind-användare, men åtminstone en del av det kommer att gälla för en stor majoritet av dem.
Om du är intresserad av vetenskapen, kolla in Wikipedias förklaring eftersom det är mycket mer avancerat som passar i den här artikeln.
Busting myten
Först och främst kan du betrakta att ingen du vet är bokstavligen färgblind. Titeln är faktiskt (i de flesta fall) en komplett missnomer. En liten andel människor är födda med verkligt monokromatisk syn.
Många mer exakta villkor inkluderar? Färgskada? eller? färgbrist.? I stället för att se världen i svart och vitt kan färgblindade människor vanligtvis förstå och förstå nästan alla färger i spektret. En av de snyggaste och mest irriterande frågorna du kan fråga färgblinda människor är huruvida de kan? Se? gul, grön eller någon annan färg.
Det verkliga problemet är att det är ganska svårt för färgblind användare att skilja mellan två färger som liknar varandra. Det här är väldigt knepigt att räkna ut när du anser att färger som inte verkar som liknar dig åtminstone kan tyckas mycket liknar en färgblind person och vice versa.
Det handlar om nyanser
För att göra det enklare att förstå, tänk på alla nyanser av alla färger du någonsin sett. Till exempel när du tänker på färgen? Grön? Tänk på hur många helt olika färgprov kan matcha din definition av grön. Ljus, mörk, dämpad, akvarell, neon; på och på. Detta inkluderar de minsta variationerna där en grön kan innehålla bara en liten bit mer rött eller blått ljus än det andra gröna.
Tänk nu att du räknade alla dessa olika nyanser av grönt som dina ögon kan uppleva och de motsvarade, säg 1 miljon (helt godtyckligt tal). Ge nu samma uppgift till en färgblind person och de kan komma upp med 500 000 eller mindre.
Så du ser, det är inte att färgblindiga människor (i de flesta fall) är oförmögna eller uppfattar? Grön? i stället skiljer de bara färre nyanser av grönt än vad du gör. Så där du ser tre liknande nyanser av grönt kan en färgblind användare bara se en ny grön
För att göra det ännu mer komplicerat, rinner liknande nyanser av olika färger ofta ihop och gör det svårt att bestämma exakt vilken färg något egentligen är.
exempel
Det är alltid lite lättare att förstå med några soliga exempel framför dig. Tänk på följande fyra färgprov.
Först titta på de två nedre stavarna. Tänk i första hand ljusets ljusstyrka, ännu mer än grundfärgen. Colorblind-användare ska enkelt kunna skilja mellan dessa två färgprover; precis som du kan. Oavsett om en färgblind person korrekt identifierar färgerna är en helt annan historia, men i alla fall är det lätt att säga att de är olika färger.
Nu är de två översta stegen en annan historia. Det föregående exemplet kan få dig att tro att färgblind användare enkelt kan skilja mellan brunt och grönt, men du skulle ha fel. Återigen, jämför endast den relativa ljusstyrkan / mörkret i de två färgproverna, du kan noga se hur dessa två färgprover ser mer liknar ut. Tänk nu att för de flesta färgblindade individer kommer de två översta stegen att vara identiska.
Att resa ännu längre ner kaninhålet, låt oss upprepa den mörkbruna och lägga till en mörkröd nyans.
Återigen ser vi två nyanser som är olika färger, men återigen är den relativa ljusstyrkan hos prickarna så lika att en färgblind användare kommer att ha problem att skilja mellan dem.
En uppsättning normala ögon bör se fem olika färgprov i arrangemanget ovan (en är upprepad). En uppsättning färgblindade ögon kommer troligen att se tre eller mindre!
Smärtsamma färgkombinationer
Blanda liknande nyanser som i exemplen ovan och dina colorblind-användare kommer inte heller att märka av att vara svagt irriterad. Men om du verkligen vill göra din webbplats fullständigt oanvändbar, börja överlappa nyanser av färger som har liknande ljusstyrka men har potential att på allvar störa.
Röda och blues, purpur och röda, pinks och blues och nästan alla kombinationer av dessa är ett bra exempel. Som exempel på vad du inte gör, överväg bilden nedan.
Medan du kanske bara ser en del stygg text, kommer många färgblindade användare att se sådana vibrerande färger som deras ögon nästan börjar vatten (ju längre bort är de värre det blir). Det är svårt att förklara ordentligt när man inte kan se det men i grunden vad som händer är att det är uppenbart att färgerna är väldigt olika men de är faktiskt lika stora att kanterna där de två färgerna möts blir mycket svåra att skilja. Detta orsakar en helt obehaglig upplevelse för många colorblind-användare när man tittar på en bild som den ovanstående.
Än sen då? Hur påverkar detta mina mönster?
Denna information är bra och bra, men hur är det praktiskt tillämpligt på design? Svaret är att det finns några viktiga områden där du verkligen bör uppmärksamma hur färgblind användare kan uppleva din webbplats annorlunda.
Ett av de vanligaste misstag som jag ser är i länkhuvudseffekter. Otaliga designers tillämpar helt enkelt ett färgskifte som en svängareffekt och kallar det en dag eftersom de kan uppfatta det bara bra.
När du är osäker, kom ihåg att färgblindanvändare kan uppleva ljusstyrka, för det mesta, precis som möjligt. En riktigt mörkblå och en riktigt ljusblå blir en uppenbar växel. Så om du byter färger på en svängare, se till att de två färgerna är väldigt olika i sin relativa ljusstyrka. Du kan växla från en mörkbrun till en ljusgrön, bara inte från en mörkbrun till en mörkgrön.
Vidare är det alltid bättre att lägga till något annat visuellt förutom färgskift. När användaren svänger över en länk lägger du till en stroke, drop shadow eller något annat du kan tänka dig för att skapa en ökad visuell skillnad som inte helt enkelt bygger på en färgförändring.
infographics
Ett annat viktigt område där färgskillnader är viktiga är med datavisualisering. Att välja fela färger för ett diagram kan göra det bokstavligt oläsligt för en färgblind användare.
Även om dina färger är väldigt olika är det ofta en bra idé att lägga till ett litet mönster eller en textur till olika delar av ett diagram för att underlätta visuell differentiering.
I exemplet ovan, trots att färgerna fortfarande är lika stora att en färgblind användare kanske inte kan se skillnaden, ger ränderna en snabb och enkel visuell referens för alla användare.
Spel
Som du kan föreställa dig, är möjligheterna för färgblind användare att vara utelämnade, men en sista plats jag vill diskutera var detta kan vara särskilt frustrerande för dem är med spel.
Tänk dig att du försöker spela iPhone-spelet nedan som en colorblind-användare. Att matcha färgerna för att slutföra pusset kan vara ganska svårt!
Många iPhone-spel har kompenserat för detta genom att ha ett valfritt färgblindläge, men för att göra det enkelt, bara överväga att lägga till symboler förutom färg för att underlätta för alla att spela. Som en illustration, överväga ett däck spelkort. Det går mer än röda kort och svarta kort. Alla som spelar, colorblind eller inte, vet att diamanterna och hjärtan är de röda korten medan klubbar och spader är svarta korten. Även när du ser dessa symboler på ett svartvitt fotografi kan du självklart skilja mellan de röda och de svarta korten. Detta är precis hur dina spel ska utvecklas.
Slutsats
Slutligen, kom ihåg att det faktiskt är väldigt enkelt att göra din webbplats tillgänglig för colorblind-användare. Du behöver bara lägga fram en medveten ansträngning, där det påverkar hur webbplatsen fungerar eller när färguppfattning kan försämra textens läsbarhet. Vem bryr sig Om du har en brun bakgrund som färgblind användare tycker är grön? För det mesta kommer det inte säkert.
Se bara till att när det är viktigt, som med länkar, diagram och spel, letar du efter sätt att lägga till kontrast. Använd starkt kontrasterande färger, implementera mönster, tillämpa symboler och använd tricks med slag, skuggor och liknande för att se till att det finns signifikant visuell skillnad på alla rätt ställen. Det kan ofta vara till hjälp att använda en färgblindhetssimulator för att bestämma hur färgerna på sidan påverkar den övergripande upplevelsen.
Lämna en kommentar nedan och meddela om du någonsin anser färgblind användare när du utformar en webbplats och hur du tillgodoser deras behov.