Tīmekļa Krāsu Paletes

Kas ir tīmekļa krāsu paletes?

Krāsas ir ļoti svarīgas tīmekļa dizaineriem un grafiskajiem dizaineriem. Dizaineri ikdienas dzīvē apraksta krāsas, kuras mēs raksturojam kā zilu, sarkanu un zaļu, izmantojot tādus kodus kā #fff002, #426215. Neatkarīgi no tā, kāda veida kodēšanas projektu jūs veicat, jūs, iespējams, kādā brīdī sāksit strādāt ar krāsām. Tas būs īpaši noderīgi, ja iemācīsities kodēt, izmantojot HTML, kā daudzi cilvēki to dara, veidojot tīmekļa lapas.

Ko Hex kods nozīmē krāsās?

Hex kods ir veids, kā attēlot krāsu RGB formātā, apvienojot trīs vērtības. Šie krāsu kodi ir neatņemama tīmekļa dizaina HTML sastāvdaļa un joprojām ir svarīgs veids, kā digitāli attēlot krāsu formātus.

Hex krāsu kodi sākas ar mārciņas zīmi vai atsauci (#), kam seko seši burti vai cipari. Pirmie divi burti/cipari atbilst sarkanajam, nākamie divi – zaļajam un pēdējie divi – zilajam. Krāsu vērtības ir noteiktas vērtībās no 00 līdz FF.

Cipari tiek izmantoti, ja vērtība ir no 1 līdz 9. Burti tiek izmantoti, ja vērtība ir lielāka par 9. Piemēram:

• A = 10
• B = 11
• C = 12
• D = 13
• E = 14
• F = 15

Hex krāsu kodi un RGB ekvivalenti

Dažu visizplatītāko sešstūra krāsu kodu iegaumēšana var būt noderīga, lai palīdzētu jums labāk paredzēt, kādas būs citas krāsas, kad redzat sešstūra krāsu kodu, nevis tikai tad, kad vēlaties izmantot precīzās krāsas.

• Sarkans = #FF0000 = RGB (255, 0, 0)
• Zaļš = #008000 = RGB (1, 128, 0) v
• Zils = #0000FF = RGB (0, 0, 255)
• Balts = #FFFFFF = RGB (255 255 255)
• Ziloņkauls = #FFFFF0 = RGB (255, 255, 240)
• Melns = #000000 = RGB (0, 0, 0)
• Pelēks = #808080 = RGB (128, 128, 128)
• Sudrabs = #C0C0C0 = RGB (192, 192, 192)
• Dzeltens = #FFFF00 = RGB (255, 255, 0)
• Violeta = #800080 = RGB (128, 0, 128)
• Oranžs = #FFA500 = RGB (255, 165, 0)
• Bordo = #800000 = RGB (128, 0, 0)
• Fuksija = #FF00FF = RGB (255, 0, 255)
• Laima = #00FF00 = RGB (0, 255, 0)
• Aqua = #00FFFF = RGB (0, 255, 255)
• Teal = #008080 = RGB (0, 128, 128)
• Olīva = #808000 = RGB (128, 128, 0)
• Tumši zils = #000080 = RGB (0, 0, 128)

Kāpēc vietņu krāsas ir svarīgas?

Jums var šķist, ka krāsas jūs neietekmē, taču saskaņā ar pētījumu 85% cilvēku apgalvo, ka krāsai ir liela ietekme uz iegādāto preci. Viņš arī saka, ka, mainot pogu krāsas, daži uzņēmumi ir pamanījuši strauju reklāmguvumu pieaugumu vai samazināšanos.

Piemēram, uzņēmums Beamax, kas ražo projekcijas ekrānus, pamanīja milzīgu klikšķu skaita pieaugumu uz sarkanajām saitēm par 53,1%, salīdzinot ar zilajām saitēm.

Krāsām ir milzīga ietekme ne tikai uz klikšķiem, bet arī uz zīmola atpazīstamību. Pētījums par krāsu garīgo ietekmi atklāja, ka krāsas palielina zīmola atpazīstamību vidēji par 80%. Piemēram, domājot par Coca-Cola, jūs, iespējams, iztēlojaties koši sarkanas skārdenes.

Kā izvēlēties vietņu krāsu shēmu?

Lai izlemtu, kuras krāsas jums vajadzētu izvēlēties savā tīmekļa vietnē vai tīmekļa lietojumprogrammā, vispirms ir labi jāsaprot, ko jūs pārdodat. Piemēram, ja mēģināt iegūt augstākas kvalitātes augstas klases attēlu, jāizvēlas violeta krāsa. Tomēr, ja vēlaties sasniegt plašāku auditoriju, zilā krāsā; Tā ir pārliecinoša un maiga krāsa, kas ir labi piemērota jutīgākām tēmām, piemēram, veselībai vai finansēm.

Iepriekš minētie piemēri ir pierādīti daudzos pētījumos. Taču jūsu vietnei izvēlētā krāsa ir atkarīga no jūsu dizaina sarežģītības un krāsu kombināciju veidiem. Piemēram, ja izmantojat vienkrāsainu tīmekļa dizaina paleti, jums var būt nepieciešami septiņi vai vairāk šīs krāsas toņu, lai ekrānā būtu pietiekami daudzveidīga. Jums ir jāiestata krāsas noteiktām vietnes daļām, piemēram, tekstam, foniem, saitēm, kursora virzīšanas krāsām, CTA pogām un galvenēm.

Tagad “Kā izvēlēties krāsu shēmu vietnēm un tīmekļa lietojumprogrammām?” Apskatīsim to soli pa solim:

1. Izvēlieties primārās krāsas.

Labākais veids, kā izlemt par primāro krāsu, ir izpētīt krāsas, kas atbilst jūsu produkta vai pakalpojuma noskaņojumam.

Tālāk mēs jums piedāvājam dažus piemērus:

• Sarkans: tas nozīmē sajūsmu vai laimi.
• Oranžs: tas apzīmē draudzīgu, jautru laiku.
• Dzeltens nozīmē optimismu un laimi.
• Zaļš: tas nozīmē svaigumu un dabu.
• Zils: apzīmē uzticamību un pārliecību.
• Violeta: pārstāv izcilu zīmolu ar kvalitātes vēsturi.
• Brūns: tas nozīmē uzticamu produktu, ko var izmantot ikviens.
• Melns nozīmē greznību vai eleganci.
• Balts: attiecas uz stilīgiem, lietotājam draudzīgiem izstrādājumiem.

2. Izvēlieties papildu krāsas.

Izvēlieties vienu vai divas papildu krāsas, kas papildina jūsu galveno krāsu. Ideālā gadījumā tām vajadzētu būt krāsām, kas padara jūsu galveno krāsu "satriecošu".

3. Izvēlieties fona krāsu.

Izvēlieties fona krāsu, kas būs mazāk “agresīva” nekā jūsu primārā krāsa.

4. Izvēlieties fonta krāsu.

Izvēlieties teksta krāsu savā vietnē. Ņemiet vērā, ka vienkrāsains melns fonts ir reti sastopams un nav ieteicams.

Labākās tīmekļa krāsu paletes dizaineriem

Ja Softmedal tīmekļa krāsu palešu kolekcijā nevarat atrast meklēto krāsu, varat apskatīt tālāk norādītās alternatīvās krāsu vietnes:

Krāsu izvēle ir ilgs process, un bieži vien ir nepieciešama liela pielāgošana, lai atrastu pareizās krāsas. Šobrīd jūs varat ietaupīt laiku, izmantojot 100% bezmaksas tīmekļa lietojumprogrammas, kas no jauna izveido atbilstošās krāsu shēmas.

1. Paletons

Paletton ir tīmekļa lietojumprogramma, kas jāzina visiem tīmekļa dizaineriem. Vienkārši ievadiet sēklas krāsu, un lietotne paveiks pārējo jūsu vietā. Paletton ir uzticama izvēle un lieliska tīmekļa lietotne tiem, kas neko nezina par dizainu, un iesācējiem.

2. Droša krāsa

Ja WCAG jūsu projektēšanas procesā rada bažas, Color Safe ir labākais rīks, ko izmantot. Izmantojot šo tīmekļa lietojumprogrammu, varat izveidot krāsu shēmas, kas lieliski sajaucas un piedāvā bagātīgu kontrastu atbilstoši WCAG vadlīnijām.

Izmantojot tīmekļa lietotni Color Safe, jūs nodrošināsiet, ka jūsu vietne atbilst WCAG vadlīnijām un ir pilnībā pieejama ikvienam.

3. Adobe Color CC

Tas ir viens no bezmaksas Adobe rīkiem, kas izveidots publiskai lietošanai. Tā ir sarežģīta tīmekļa lietojumprogramma, kurā ikviens var izveidot krāsu shēmas no nulles. Tas ļauj jums izvēlēties no daudziem dažādiem krāsu modeļiem, kas vislabāk atbilst jūsu vajadzībām. Saskarne sākumā var šķist nedaudz mulsinoša, taču, kad esat pieraduši pie tā, jums nevajadzētu radīt problēmas ar skaistu krāsu opciju izvēli.

4. Atmosfēra

Ambiance, bezmaksas tīmekļa lietojumprogramma, piedāvā iepriekš izveidotas tīmekļa krāsu paletes no citām krāsu vietnēm tīmeklī. Tā darbojas kā tradicionāla tīmekļa lietotne, kurā varat saglabāt krāsas savā profilā un izveidot savas shēmas no nulles. Visas šīs tīmekļa krāsu paletes nāk no Colorlovers. Ambiance interfeiss atvieglo pārlūkošanu un vairāk uzmanības pievērš krāsu mijiedarbībai lietotāja interfeisa dizainā.

5. 0 līdz 255

0to255 nav gluži krāsu shēmu ģenerators, taču tas var palīdzēt precizēt esošās krāsu shēmas. Tīmekļa lietotne parāda visas dažādās nokrāsas, lai jūs varētu uzreiz sajaukt un saskaņot krāsas.

Ja jums ir grūti izveidot izmantojamu krāsu shēmu, varat pārskatīt dažas no iepriekš minētajām lietojumprogrammām.

Labākās tīmekļa krāsu paletes

Tālāk norādītajās vietnēs tiek izmantotas dažādas tīmekļa krāsu paletes, lai panāktu lielisku efektu. Tie ir rūpīgi atlasīti, ņemot vērā emocijas, ko tās izraisa, un emocijas, ko tās pauž.

1. Odopod

Odopod tika izstrādāts ar monotonu krāsu paleti, taču tā mērķis bija izvairīties no garlaicīga izskata ar gradientu mājaslapā. Liela tipogrāfija piedāvā lielisku kontrastu. Ir skaidrs, kur apmeklētāji vēlas noklikšķināt.

2. Tori acs

Tori's Eye ir lielisks vienkrāsainas krāsu shēmas piemērs. Šeit ir redzamas vienkāršas, bet spēcīgas krāsu paletes, kuras centrā ir zaļās nokrāsas, efekti. Šo krāsu shēmu parasti ir viegli noņemt, jo viens vienas krāsas tonis gandrīz vienmēr derēs ar citu tādas pašas krāsas toni.

3. Siera izdzīvošanas komplekts

Sarkanā krāsa ir ļoti populāra vietņu krāsu paletē. Tas var nodot bagātīgu emociju sajaukumu, padarot to daudzpusīgu. Kā redzat Cheese Survival Kit tīmekļa vietnē, tas ir īpaši spēcīgs, ja to lieto nelielās devās. Sarkano krāsu mīkstina neitrālākas krāsas, un zilā krāsa palīdz CTA un citās jomās, kurās uzņēmums vēlas pievērst apmeklētāja uzmanību.

4. Ahrefs

Ahrefs ir vietnes piemērs, kas brīvi izmanto krāsu paleti. Tumši zilā krāsa darbojas kā dominējošā krāsa, taču visā vietnē pastāv variācijas. Tas pats attiecas uz oranžām, rozā un tirkīza krāsām.

Visbiežāk uzdotie jautājumi par krāsām

1. Kāda krāsa ir vislabākā vietnei?

Zils noteikti ir drošākā izvēle, jo tā ir vispopulārākā krāsa ar 35%. Tomēr, ja visi jūsu konkurenti izmanto zilo krāsu, varētu būt lietderīgi “atšķirt” savu piedāvājumu un zīmolu. Bet jums ir jāpārliecinās, ka jūs nepārslogojat apmeklētājus.

2. Cik krāsām jābūt vietnei?

Ņemiet vērā, ka 51% zīmolu ir vienkrāsaini logotipi, 39% izmanto divas krāsas, un tikai 19% uzņēmumu dod priekšroku pilnkrāsu logotipiem. No šejienes jūs varat redzēt, ka tīmekļa vietnēm ar 1, 2 un 3 krāsām ir lielāka jēga nekā mēģināt izveidot vietni ar varavīksnes krāsām. Tomēr tādi zīmoli kā Microsoft un Google tic priekšrocībām, ko sniedz darbs ar vairākām krāsām, jo ​​to dizainā tiek izmantotas vismaz 4 vienkrāsainas krāsas.

3. Kur man vajadzētu izmantot krāsas?

Uzkrītošās krāsas jālieto taupīgi, pretējā gadījumā tās zaudēs savu efektu. Šim efektam ir jābūt reklāmguvumu punktos, piemēram, pogās “Pirkt tūlīt”.