Skip to content

Kuinka valita kontrastivärit luettavammille verkkosivustoille

19 de maaliskuu de 2021

Mitä tietää

  • Tämän artikkelin taulukon avulla voit määrittää parhaat taustan ja etualan väriyhdistelmät verkkosivujen suunnittelulle.
  • Käytä online-työkalua, kuten CheckMyColors.com, testataksesi sivustosi värejä ja raportoidaksesi sivun elementtien välisestä kontrastisuhteesta.
  • Testaa valintasi verkkosisällön esteettömyysohjeiden avulla kuten ContrastChecker.com.

Tässä artikkelissa kerrotaan, miten taustan ja etualan värien välinen kontrasti voidaan luoda tehokkaasti verkkosuunnittelussa.

Kuinka luoda vahva kontrasti

Jotkut värit voivat olla kirkkaita ja näkyä voimakkaasti tietyllä taustavärillä, kuten sininen mustalla, mutta ne ovat huonoja kontrastivalintoja. Jos luisit sivun esimerkiksi sinisellä tekstillä mustalla taustalla, lukijasi kokevat silmien rasituksen hyvin nopeasti.

Tutki alla olevaa kaaviota saadaksesi käsityksen parhaista tausta / etualan yhdistelmistä.

Kontrastille on olemassa sääntöjä ja parhaita käytäntöjä, mutta suunnittelijana sinun on aina arvioitava nämä säännöt varmistaaksesi, että ne toimivat juuri sinun tapauksessasi.

Käytä online-kontrastin tarkistustyökaluja

Oman suunnittelutajusi lisäksi kokeile joitain verkkotyökaluja testataksesi sivustosi värivalintaa. CheckMyColors.com testaa kaikki sivustosi värit ja raportoi sivun elementtien välisestä kontrastisuhteesta.

Kun harkitset värivalintoja, sinun on myös otettava huomioon verkkosivustojen saavutettavuus ja ihmiset, joilla on värisokeuden muotoja. WebAIM.org voi auttaa tässä, samoin kuin ContrastChecker.com, joka testaa valintasi verkkosisällön esteettömyysohjeiden mukaan.

Miksi kontrasti on tärkeää?

Vahvalla kontrastilla on tärkeä rooli minkä tahansa verkkosivuston suunnittelun onnistumisessa. Riittävä kontrasti varmistaa laadukkaan käyttökokemuksen ja helpomman luettavuuden, mikä edistää sivuston pitkäaikaista menestystä. Sitä vastoin liian pieniä verkkosivustoja voi olla vaikea lukea ja käyttää, mikä vaikuttaa kielteisesti minkä tahansa sivuston tehokkuuteen.

Vaikka voi olla helppo määrittää, mitkä värit eivät toimi hyvin yhdessä, on vaikeampi kysymys päättää, mitkä värit pariksi tehokkaasti, toisin kuin muut ja verkkosivuston suunnittelussa.

Tuotemerkkistandardit ja kontrastivärivaihtoehdot

Kontrasti on vain yksi huomioon otettavista tekijöistä, kun valitset värejä verkkosivustosi ulkoasuun. Kun valitset värejä, sinun on todennäköisesti myös pidettävä mielessä asiakkaan tuotemerkkistandardit, olipa kyseessä yritys, muu organisaatio tai jopa yksityishenkilö. Vaikka väripaletit saattavat olla yhdenmukaisia ​​organisaation tuotemerkin ohjeiden kanssa, ne eivät välttämättä käänny hyvin verkkoesittelyä varten.

Esimerkiksi keltaiset ja kirkkaat vihreät ovat erittäin haastavia käyttää tehokkaasti verkkosivustoilla. Jos nämä värit ovat yrityksen tuotemerkin ohjeissa, niitä on todennäköisesti käytettävä vain korostusväreinä, koska on vaikea löytää värejä, jotka sopivat hyvin yhteen.

Vastaavasti, jos tuotemerkkisi värit ovat mustavalkoisia, tämä tarkoittaa suurta kontrastia, mutta jos sinulla on sivusto, jossa on pitkiä tekstimääriä, musta tausta valkoisella tekstillä tekee lukemisesta erittäin silmää rasittavan kokemuksen siitä huolimatta, että kontrasti mustan ja valkoisen välillä. Tässä tapauksessa on suositeltavaa kääntää värit kääntämällä mustaa tekstiä valkoisella pohjalla. Se ei ehkä ole visuaalisesti yhtä mielenkiintoista, mutta se on paljon parempi kontrasti ja luettavuus.