Notkun Andstæður og bakgrunnslitir í vefhönnun

Bættu læsileika vefsvæðis þíns og notendaviðræður með fullnægjandi birtuskilum

Andstæður gegna mikilvægu hlutverki í velgengni hvers vefsvæðis. Frá leturriti þessa síðu , á myndunum sem notaðar eru á vefnum, að andstæða milli forgrunnsþátta og bakgrunnslita - vel hönnuð síða verður að hafa fullnægjandi birtuskil á öllum þessum sviðum til að tryggja góða notendavara og langtíma velgengni.

Lágt mótsögn er eins og slæm lærimeynsla

Vefsíður sem eru of litlar í andstæðu geta verið erfitt að lesa og nota, sem mun hafa neikvæð áhrif á velgengni síðunnar. Lélegt litaskilríki er oft auðvelt að bera kennsl á. Þú getur venjulega gert það bara með því að skoða síðu sem er sýnd í vafra og þú getur séð hvort textinn er of erfitt að lesa vegna lélegra valvala. Enn á meðan það getur verið auðvelt að ákveða hver litir virka ekki vel saman, getur það í raun verið mjög krefjandi að ákveða hvaða litir virka vel í mótsögn við aðra. Þú getur ekki það sem virkar ekki, en hvernig ákveður þú hvað vinnur? Myndin í þessari grein ætti að hjálpa þér að sýna ýmis mismunandi litum og hvernig þær eru andstæður sem forgrunni og bakgrunnslitir. Þú getur séð nokkrar "góðar" paringar og nokkrar "lélegar" pörun, sem hjálpa þér að gera réttar valmyndir í verkefnum þínum.

Varðandi andstæða

Eitt sem þú ættir að hafa í huga er að andstæða er meira en bara hversu skær litur er miðað við bakgrunninn. Eins og þú ættir að sjá í framangreindum mynd, eru sumar þessir litir mjög björt og sýna líflega á bakgrunnslitnum - eins og bláum á svörtu, en ég merkti það enn sem lélegt andstæða. Ég gerði þetta vegna þess að meðan liturinn gæti verið björt, gerir litasamsetningin ennþá erfitt með að lesa textann. Ef þú værir að búa til síðu í öllum bláum texta á svörtu bakgrunni, þá gætu lesendur þínar haft mjög augljós augnþrýsting. Þess vegna er andstæða ekki bara svart og hvítt (já, þessi orðspor var ætlað). Það eru reglur og bestu venjur í andstæðu, en sem hönnuður verður þú alltaf að meta þær reglur til að tryggja að þeir vinna í þínu tilviki.

Velja litir

Andstæður eru bara ein af þeim þáttum sem þarf að huga þegar þú velur lit fyrir hönnun vefsvæðisins, en það er mikilvægt. Þegar þú velur litir skaltu hafa í huga vörumerki staðla fyrirtækisins, en einnig vera reiðubúinn til að takast á við litaspjöld sem virka ekki vel á netinu meðan þau kunna að vera í samræmi við leiðbeiningar um vörumerki fyrirtækisins. Til dæmis hefur ég alltaf fundið gula og björtu grænu til að vera hræðilega krefjandi að nota á vefsíðum á öruggan hátt. Ef þessi liti eru í leiðbeiningum um vörumerki fyrirtækisins, munu þeir líklega þurfa að nota aðeins sem hreim litum, þar sem erfitt er að finna liti sem bregðast vel við annaðhvort.

Á sama hátt, ef vörumerkjalitir þínar eru svartir og hvítar, þá þýðir þetta frábær andstæða, en ef þú ert með síðu með langan fjölda texta, þá er svartur bakgrunnur með hvítum texta að lesa mjög erfitt. Jafnvel mótsögnin milli svörtu og hvítu er frábær, hvítur texti á svörtu bakgrunni veldur augnþrýstingi fyrir langar hliðar. Í þessu tilfelli myndi ég snúa litunum til að nota svörtu texta á hvítum bakgrunni. Það gæti ekki verið eins og sjónrænt áhuga, en þú munt ekki finna betri andstæða en það!

Online Tools

Til viðbótar við eigin hönnunarskynjun, eru nokkrar netverkfæri sem þú getur notað til að prófa litavalið þitt.

CheckMyColors.com mun prófa allar liti vefsvæðis þíns og tilkynna um birtuskilyrði milli þátta á síðunni.

Að auki, þegar þú hugsar um val á litum, ættir þú einnig að íhuga aðgengi vefsvæðis og fólk sem hefur form af litblinda. WebAIM.org getur hjálpað til með þetta, eins og hægt er ContrastChecker.com, sem mun prófa val þitt gegn WCAG leiðbeiningum.