Milloreu la legibilitat del vostre lloc web i l'experiència de l'usuari amb un contrast adequat
El contrast té un paper important en l'èxit del disseny de qualsevol lloc web. Des de la tipografia d' aquest lloc , fins a les imatges utilitzades en tot el lloc, fins al contrast entre els elements del primer pla i els colors de fons, un lloc ben dissenyat ha de tenir un contrast adequat en totes aquestes àrees per garantir una experiència d'usuari de qualitat i un èxit a llarg termini.
El contrast baix equival a una experiència de lectura deficient
Els llocs web que són massa baixos en contrast poden ser difícils de llegir i utilitzar, la qual cosa tindrà un impacte negatiu en l'èxit de qualsevol lloc. Els problemes de contrast de color pocs són sovint fàcils d'identificar. Normalment, podeu fer-ho simplement mirant una pàgina que es renderitza en un navegador web i es pot veure si el text és massa difícil de llegir a causa d'opcions de color defectuoses. Tot i així, si bé és fàcil determinar quins colors no funcionen bé, en realitat, pot ser molt difícil decidir quins colors funcionen bé en contrast amb els altres. No és possible que no funcioni, sinó com determinarà què funciona? La imatge d'aquest article us ajudarà a mostrar-vos una varietat de colors diferents i com contrasten com a colors de primer pla i de fons. Podeu veure algunes combinacions "bones" i un maridatge "pobre" que us ajudarà a fer les opcions correctes del color als vostres projectes.
Respecte al contrast
Una cosa que ha de tenir en compte és que el contrast és més que el brillant color que es compara amb el fons. Com s'ha de veure en aquesta imatge abans esmentada, alguns d'aquests colors són molt brillants i apareixen vibrantment en el color de fons, com el blau en negre, però encara ho he etiquetat amb un contrast pobre. Ho vaig fer perquè, tot i que pot ser brillant, la combinació de colors encara fa que el text sigui difícil de llegir. Si creeu una pàgina en tot el text blau en un fons negre, els vostres lectors tindrien resultats molt ràpids. Per aquest motiu, el contrast no és només blanc i negre (sí, es tracta d'un joc de paraules). Hi ha regles i bones pràctiques per al contrast, però com a dissenyador, sempre heu d'avaluar aquestes regles per assegurar-vos que funcionen en la vostra instància particular.
Elecció de colors
El contrast és només un dels factors a tenir en compte a l'hora d'escollir colors per al disseny del vostre lloc web, però és important. Al triar els colors, tingueu en compte els estàndards de la marca de l'empresa, però també estigui disposat a abordar paletes de colors que, tot i que siguin coherents amb les directrius de marca d'una organització, no funcionin bé en línia. Per exemple, sempre he trobat els verds grocs i brillants que són molt difícils d'utilitzar eficaçment als llocs web. Si aquests colors es troben en les directrius de la marca d'una empresa, probablement hauran de ser utilitzats només com a colors d'accent, ja que és difícil trobar colors que contrastin bé amb qualsevol dels dos.
De la mateixa manera, si els colors de la vostra marca són en blanc i negre, això significa un gran contrast, però si teniu un lloc amb quantitats de text llargues, tenir un fons negre amb text en blanc farà que la lectura sigui molt dura. Fins i tot el contrast entre blanc i negre és gran, el text blanc sobre fons negre provoca tensions oculars per llargs passos. En aquest cas, invertiré els colors per utilitzar text negre sobre fons blanc. Potser no sigui tan visualment interessat, però no trobareu millor contrast que això.
Eines en línia
A més del propi sentit del disseny, hi ha algunes eines en línia que podeu utilitzar per provar l'elecció del color del vostre lloc.
CheckMyColors.com provarà tots els colors del vostre lloc i informarà sobre la relació de contrast entre els elements de la pàgina.
A més, quan penseu en les opcions de color, també heu de considerar l'accessibilitat del lloc web i les persones que tenen formes de ceguesa del color. WebAIM.org pot ajudar-ho, com pot ContrastChecker.com, que provarà les vostres eleccions amb les directrius WCAG.