Design for og som en fargeblind person

Fargeblindhet er et mildt funksjonshemning der de berørte opplever en redusert evne til å skille farger fra andre. Dette kan være en reell ulempe for alle i designfeltet, siden fargeteori er en integrert funksjon i vellykket design, og mange avgjørelser er basert på følelsen og følelsen avledet fra designbeslutninger, i stedet for et generisk sett med retningslinjer og taksonomier.

Du har sikkert hørt mye om tilgjengelighet i webdesign allerede; Det er viktig å imøtekomme det bredeste publikum, som potensielt kan ha problemer med nettstedet ditt hvis det ikke er laget på riktig måte. Som en bonus, vil vi berøre det litt senere, men hovedfokuset i denne artikkelen er faktisk å se på hvordan en fargeblind designer kan fortsatt skreddersy et nettsteds design.

I dagens artikkel skal vi se på hvordan fargeblinde designere fremdeles kan skape en vellykket case studie for god bruk av farge og hvordan ikke-lider fortsatt kan ta hensyn til behovene til deres fargeblinde målgruppe.


Forstå fargeblindhet

Som jeg sa før, er fargeblindhet et mildt funksjonshemning hvor skillefarge kan være et problem. I et nøtteskall kan personer med fargeblindhet ikke identifisere visse farger blant lignende andre, eller bare ingen i det hele tatt.

Det er flere typer fargeblindhet. Total fargeblindhet ("monokromacy") er en svært sjelden tilstand, hvor folk bare ser forskjellige toner og lysstyrkenivåer, uten farge i det hele tatt. Men mer vanlige tilfeller er en manglende evne til å gjenkjenne blått / gult eller rødt / grønt, idet sistnevnte er de vanligste av de to.

Tester er utviklet for å gjenkjenne fargeblindhet, normalt ved å spørre potensialet for å kjenne igjen en melding som består av prikker. Lider og ikke-lider vil se forskjellige meldinger, slik at man kan avgjøre om de er en lidende.


Hva ser du i denne dotsirkelen? Ubehandlede personer bør se nummeret "74", men de med tilstanden kan se 21, eller ingenting i det hele tatt.

Forhåpentligvis representerer bildet ovenfor bedre det jeg prøver å komme over. Dine farger kan oppfattes annerledes av de to forskjellige gruppene (sufferers og non-sufferers), og dermed ugyldiggjør uomodifiserte fargevalg. En person kan se 74, men en lidende kan helt savner det og la det gå helt utenfor radaren.


Litt om fargen

Vi har allerede en artikkel her på Webdesigntuts + på fargeteori, som du sikkert bør lese før vi fortsetter. Thomas Cannon gjør en god jobb med å forklare hvilken fargeteori.

Fargeteori dekker faktisk en rekke ting, men på det mest grunnleggende nivå er det samspillet mellom farger i et design gjennom komplementering, kontrast og livsstil.

Som du sikkert er klar over, er farger på nettet generelt referert til som en heksadesimal kode; noe som # ff0000. Nettleseren vår oversetter så intelligent disse inn i RGB-verdier, for å gjengi fargen som vi har bedt om å vise. Hvis du vil dykke litt dypere, er heksadesimale koder faktisk veldig interessante, siden du kan bryte den ned for å finne ut spesifikasjonene for rød, grønn og blå, takket være verdiene fra 0-9 eller A-F.

Heldigvis har kreative typer hatt et ganske flott verktøy i lang tid for å hjelpe dem å finne ut hvilke farger som passer godt sammen: fargeskiven. Fargehjulet er en dun-lignende form av farger, som stammer fra de tre primære fargene: rød, gul og blå. Det er utenfor horisonten av denne artikkelen å gå inn for mye detalj her (og pluss, jeg ville gå i samme fotspor på Thomas), så jeg vil ikke gå mye lenger enn å si at dette hjulet kan hjelpe oss med å avgjøre hvilken farger har en naturlig kjemi.

Et fargevalg er bare et logisk sett med farger som går sammen, og disse stammer fra fargeskiven. Det er en håndfull forskjellige metoder for å plukke ut farger i fargeskiven, som du kan lære om i den siste halvdelen av Thomas 'artikkel.

Nå vet vi litt mer om hvordan farge og fargevalg, arbeid, la oss se på hvordan vi kan "anta" ordninger som naturlig passer sammen.


Design som: Monokromatiske farger

Monokromatiske fargesystemer skal ikke forveksles med monokromacy. Monokromacy er fargeblindheten vi snakket om tidligere, noe som er svært sjelden og gjør at den som lider, bare ser en enkelt farge i flere nyanser. Monokrom er faktisk ment å være på en slik måte, med design bestående av en enkelt farge i flere nyanser, i motsetning til bruk av flere farger.

Bruk av en monokromatisk fargevalg er ikke nødvendigvis en hindring. Faktisk kan det være en stor fordel å gi enhet i ditt design. Hva med svart? Visst, du kan klassen svart som en annen farge, men du kan fortsatt oppnå lignende kontrast med bare å bruke en veldig mørk variant av din valgte farge.

Å oppnå kontrast er super enkel når du bruker et monokromatisk fargeskjema. Siden de med fargeblindhet fortsatt kan gjenkjenne forskjellige nyanser av farge, er det ikke noe problem å introdusere kontrast, siden det blir anerkjent på samme måte.

Selvfølgelig kan en monokromatisk fargeskjema brukes med en hvilken som helst farge og kan være ganske effektiv på den måten. Men for de som umiddelbart tenkte "svart og hvitt" da jeg nevnte monokrom, er det også effektivt. Mange minimalistiske nettsteder bruker et gråtoneskala fargevalg, noe som ikke burde være noe problem for alle å se på den planlagte måten. Hvis du vil være trygg, kan gråtoner se fantastisk ut, så lenge det passer inn i den generelle tonen og følelsen av designet.


Design for: Høy kontrast

Høye mengder kontrast er veldig viktig her, fordi det er en fin måte å skape et konsistent fargeskjema på, uten å måtte bry seg om fargeparken. Vi kan skape veldig lys til svært mørke nyanser av en enkelt farge, noe som gir oss et vell av forskjellige verdier å bruke. Hvis du for eksempel bruker en lyseblå for bakgrunnen din, vil du bruke en mye mørkere blå for teksten for å holde teksten leselig.

Bruk av monokrom gir fargeblind besøkende muligheten til å sette pris på designet ditt, selv om de ikke nødvendigvis kan identifisere de tiltenkte fargene. Men høy kontrast gir en rekke lesbarhetsforbedringer til enhver bruker og er et designprinsipp som vi bør være oppmerksomme på borte fra tilgjengelighet.


Design for: Fargetone, Metning og Lysstyrke

Som å justere kontrast, kan modifisering av fargetone, metning og lysstyrke av farger hjelpe oss med å vise definisjon og tillate brukere å skille mellom, uten å bruke flere farger. Ved å stikke med et lite sett med farger, eller bare en, kan endring av metningen virkelig vise en skarp kontrast i to fargeprøver, og det kan også lyse og fargetone.

Disse metodene tillater fargeblinde designere å enkelt definere forskjellige biter av deres design gjennom farge, uten å måtte bekymre seg for mye om estetikken som om de tilføyer en ny farge til blandingen. For fargeblinde besøkende, gjør dette det mulig å skille forskjellige utseende deler enkelt.


Begge disse eksemplene startet som eksakte duplikater. Fargetonen har imidlertid blitt skrudd opp litt til høyre.

Utforming som: "Låne" farger

Dette er hovedsakelig et tips rettet mot fargeblinde designere, i stedet for de som bare vurderer deres fargeblind publikum.

Det er utrolig enkelt å "låne" farger fra andre webdesign, eller andre ikke-webbaserte design i dag. Ved å bare trekke ut eyedropper verktøyet fra vårt arsenal av grafiske redigeringsverktøy, kan vi enkelt identifisere farger i et design og begynne å bruke dem i vår. "Stealing" fargeskjemaer kan være en veldig effektiv måte å identifisere hva som fungerer bra og replikere det i en annen form, samtidig som man opprettholder de vellykkede intensjonene til en vellykket ordning.

Selvfølgelig er dette snill, men ikke så mye at det stjeler. Vi plukker ut farger i webdesign som fungerer bra, og går ikke inn og løfter hele elementene. Heldigvis er farge ikke opphavsrettsbeskyttet.

Når vi har identifisert farger og fått dem representert av hex-verdier, kan vi bruke den sammen med andre metoder (for eksempel å bruke en enkelt farge med flere nyanser, som beskrevet ovenfor). Det kan være vanskeligere, men sørg for at du varierer paletten din og finne den selv, uten å løfte hele ordningen fra en annenes design.


Design for: Velge farger med spesialverktøy

Hvis du designer mens du tar hensyn til fargeblinde personer, finnes det et par elektroniske verktøy som lar deg simulere individuelle farger under fargebindende forhold.

Disse verktøyene gir litt innsikt i hvilke fargeblind besøkende vil se, og lar deg nøye velge farger ved å sørge for at de ser bra ut til vanlige og lidende besøkende. Det første verktøyet, Color Laboratory, lar deg faktisk sjekke ut hvordan fargene ser ut i sammenheng med hverandre, slik at du enkelt kan lage fargeskjemaer som fungerer bra for alle - lider eller ikke - på hvilket som helst operativsystem.

Det andre verktøyet er en enkel form som lar deg lime inn i HTML-en din og bytte ut heksadesimale fargeværdier med fargeblindekvivalenten, slik at du enkelt kan finjustere dem for å lage en palett som er tiltalende for lider og ikke-lider lik.


Design for: Ikke tilknyt farge med tilbakemelding

Neste opp er et tips hovedsakelig rettet mot designere vurderer deres mulige fargeblind publikum. Vi tar selvfølgelig visse følelser med farge, for eksempel rød med fare eller grønn med sikkerhet. Å bruke dette prinsippet i våre webdesign er en fin måte å umiddelbart knytte resultatet av en bestemt handling til, men bare til de med vanlig visjon. Dine fargeblinde besøkende kan ikke gjøre øyeblikkelig tilknytning, noe som tyder på at du må integrere noen ekstra advarselsmetode eller ros.

Dette er mer av et brukspunkt, men det er en du bør sannsynligvis legge merke til for å minimere brukerfrustrasjon. Selvfølgelig er fargeblindene ikke helt blinde for å farge. I stedet ser de forskjellige farger enn det vi ser og har derfor naturlig tilknyttet forskjellige farger med forskjellige meldinger. Det er imidlertid mye lettere å sikre anerkjennelse også på andre måter.


Bonus: Bruk Colorblind Web Page Filter

Design for colorblind kan være plagsom for designere som egentlig ikke er fargeblind. Hvordan tar vi hensyn til tilgjengelighet når vi ikke lider av tilstanden i hånden?

Heldigvis finnes det en håndfull tilgjengelighet "simulatorer" tilgjengelig på nettet der en nettside gjengis på en bestemt måte. Eksempelet nedenfor, heter ganske generelt som "Colorblind Web Page Filter", tar nettstedet ditt og filtrerer det som om du var fargeblind.

Verktøyet er fortsatt i utvikling, og det kan ta litt tid for en gjengivelse å bli tilgjengelig for visning. Imidlertid er rekkevidden av fargefiltre som er tilgjengelige, ganske omfattende, og dekker alle hovedtyper av fargeblindhet.

En annen simulator for å forhåndsvise hva et fargeblind publikum ville se, er Vischeck, slik at du kan forhåndsvise en levende nettside, eller noen bilder, i en av tre typer fargesynhetsunderskudd. Det har til og med et verktøy som vil korrigere bilder, slik at fargeblinde seere kan se dem naturlig.


Konklusjon

Fargeblindhet av noe slag er ikke et sjeldent problem som bare påvirker en håndfull mennesker. Faktisk er det en utbredt tilstand som mange mennesker støter på i hverdagen. Vi bør som webdesignere prøve å ta hensyn til disse besøkende så godt vi kan. Hvis vi bruker farge, i forbindelse med et godt organisert layout, bør fargeblind ikke være et problem, når det gjelder lesbarhet eller estetikk.

Effektene av fargeblindhet vil bli mest følt når det er designeren som lider. Heldigvis kan vi designe i svart-hvitt og lage en universell, estetisk tiltalende design ved å bruke kontrast over flere farger. Det viser seg at kontrast er nøkkelen. Som designer bør dette ikke være noe vi ikke vet allerede, da kontrast er en nøkkel i lesbarheten til et design.

Selvfølgelig forstår vi at ethvert design - monokrom eller ikke - skal ha høy grad av kontrast for å øke lesbarheten av elementer på en side. Vi kan imidlertid "jukse" og låne farger, eller bruk ett av de nevnte verktøyene for å lage farger som automatisk vil fungere for alle.

Heldigvis er fargeblindhet ikke en massiv klage på nettet, som det er i andre felt. Ved å lære litt fargeteori, kan vi påta seg ordninger uten å se dem selv gjennom de rette øynene, slik at du får perfekte resultater hver gang.