Web Palete Boja

Što su web palete boja?

Boje su vrlo važne za web dizajnere i grafičke dizajnere. Dizajneri opisuju boje koje opisujemo kao plavu, crvenu i zelenu u svakodnevnom životu s kodovima kao što su #fff002, #426215. Bez obzira na to koju vrstu projekta kodiranja poduzimate, vjerojatno ćete u nekom trenutku početi raditi s bojama. Ovo će biti posebno korisno ako naučite kodirati pomoću HTML-a, kao što mnogi ljudi rade za dizajn web stranica.

Što hex kod znači u bojama?

Hex kod je način predstavljanja boje u RGB formatu kombiniranjem tri vrijednosti. Ovi kodovi boja sastavni su dio HTML-a za web dizajn i ostaju važan način za digitalno predstavljanje formata boja.

Hex kodovi boja počinju znakom funte ili hashtagom (#) nakon čega slijedi šest slova ili brojeva. Prva dva slova/broja odgovaraju crvenoj boji, sljedeća dva zelenoj, a posljednja dva plavoj boji. Vrijednosti boja definirane su u vrijednostima između 00 i FF.

Brojevi se koriste kada je vrijednost 1-9. Slova se koriste kada je vrijednost veća od 9. npr.:

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

Hex kodovi boja i RGB ekvivalenti

Pamćenje nekih od najčešćih heksadecimalnih kodova boja može vam pomoći da bolje predvidite koje će druge boje biti kada vidite heksadecimalni kod boja, a ne samo kada želite koristiti te točne boje.

• Crvena = #FF0000 = RGB (255, 0, 0)
• Zelena = #008000 = RGB (1, 128, 0)v
• Plava = #0000FF = RGB (0, 0, 255)
• Bijela = #FFFFFF = RGB (255,255,255)
• Bjelokost = #FFFFF0 = RGB (255, 255, 240)
• Crna = #000000 = RGB (0, 0, 0)
• Siva = #808080 = RGB (128, 128, 128)
• Srebro = #C0C0C0 = RGB (192, 192, 192)
• Žuta = #FFFF00 = RGB (255, 255, 0)
• Ljubičasta = #800080 = RGB (128, 0, 128)
• Narančasta = #FFA500 = RGB (255, 165, 0)
• Bordo = #800000 = RGB (128, 0, 0)
• Fuksija = #FF00FF = RGB (255, 0, 255)
• Lime = #00FF00 = RGB (0, 255, 0)
• Aqua = #00FFFF = RGB (0, 255, 255)
• Teal = #008080 = RGB (0, 128, 128)
• Maslina = #808000 = RGB (128, 128, 0)
• Mornarsko plava = #000080 = RGB (0, 0, 128)

Zašto su boje web stranice važne?

Možda mislite da boje ne utječu na vas, ali prema studiji, 85% ljudi kaže da boja ima veliki utjecaj na proizvod koji kupuju. Također kaže da kada neke tvrtke promijene boje gumba, primijetile su nagli porast ili smanjenje konverzija.

Na primjer, Beamax, tvrtka koja proizvodi ekrane za projekcije, primijetila je ogroman porast klikova na crvene linkove od 53,1% u usporedbi s plavim linkovima.

Boje imaju ogroman utjecaj ne samo na klikove već i na prepoznatljivost brenda. Studija o mentalnom utjecaju boja pokazala je da boje povećavaju prepoznatljivost marke u prosjeku za 80%. Na primjer, kada pomislite na Coca-Colu, vjerojatno ćete zamisliti živopisne crvene limenke.

Kako odabrati shemu boja za web stranice?

Kako biste odlučili koje boje odabrati na svojoj web stranici ili web aplikaciji, prvo morate dobro razumjeti što prodajete. Na primjer, ako pokušavate postići kvalitetniju, vrhunsku sliku, boja koju biste trebali odabrati je ljubičasta. Međutim, ako želite doprijeti do šire publike, plava; To je umirujuća i nježna boja koja je prikladna za osjetljivije teme kao što su zdravlje ili financije.

Gore navedeni primjeri su dokazali mnoge studije. Ali boja koju odaberete za svoju web stranicu ovisi o složenosti vašeg dizajna i vrstama kombinacija boja. Na primjer, ako koristite jednobojnu paletu web dizajna, možda će vam trebati sedam ili više nijansi te boje da biste dobili dovoljno raznolikosti na zaslonu. Morate postaviti boje za određene dijelove svoje web stranice, kao što su tekst, pozadine, veze, boje lebdenja, CTA gumbi i zaglavlja.

Sada "Kako odabrati shemu boja za web stranice i web aplikacije?" Pogledajmo to korak po korak:

1. Odaberite svoje primarne boje.

Najbolji način da se odlučite za primarnu boju je ispitati boje koje odgovaraju raspoloženju vašeg proizvoda ili usluge.

U nastavku smo naveli neke primjere za vas:

• Crvena: znači uzbuđenje ili sreću.
• Narančasta: Označava prijateljsko, zabavno vrijeme.
• Žuta znači optimizam i sreću.
• Zelena: znači svježinu i prirodu.
• Plava: označava pouzdanost i sigurnost.
• Ljubičasta: Predstavlja istaknutu marku s poviješću kvalitete.
• Smeđa: To znači pouzdan proizvod koji svi mogu koristiti.
• Crna znači luksuz ili eleganciju.
• Bijela: Odnosi se na elegantne proizvode prilagođene korisniku.

2. Odaberite svoje dodatne boje.

Odaberite jednu ili dvije dodatne boje koje nadopunjuju vašu glavnu boju. To bi idealno trebale biti boje koje vašu glavnu boju čine "zapanjujućom".

3. Odaberite boju pozadine.

Odaberite boju pozadine koja će biti manje "agresivna" od vaše primarne boje.

4. Odaberite boju fonta.

Odaberite boju za tekst na svojoj web stranici. Imajte na umu da je čvrst crni font rijedak i da se ne preporučuje.

Najbolje web palete boja za dizajnere

Ako ne možete pronaći boju koju tražite u kolekciji Softmedal web paleta boja, možete pogledati alternativne stranice boja u nastavku:

Odabir boja je dug proces i često zahtijeva puno finog podešavanja kako bi se pronašle prave boje. U ovom trenutku možete uštedjeti vrijeme korištenjem 100% besplatnih web aplikacija koje stvaraju relevantne sheme boja od nule.

1. Paletton

Paletton je web aplikacija koju bi svi web dizajneri trebali znati. Samo unesite boju sjemena i aplikacija će učiniti ostalo umjesto vas. Paletton je pouzdan izbor i odlična web aplikacija za one koji ne znaju ništa o dizajnu i za početnike.

2. Sigurno u boji

Ako je WCAG problem u vašem procesu dizajna, Color Safe je najbolji alat za korištenje. Pomoću ove web aplikacije možete kreirati sheme boja koje se savršeno uklapaju i nude bogat kontrast prema WCAG smjernicama.

Korištenjem web-aplikacije Color Safe osiguravate da je vaša stranica u skladu sa smjernicama WCAG i da je potpuno dostupna svima.

3. Adobe Color CC

To je jedan od besplatnih Adobe alata stvorenih za javnu upotrebu. To je razrađena web aplikacija u kojoj svatko može kreirati sheme boja od nule. Omogućuje vam odabir između mnogih različitih modela boja koji najbolje odgovaraju vašim potrebama. Sučelje se u početku može činiti pomalo zbunjujućim, ali kada se naviknete na njega ne biste trebali imati problema s odabirom prekrasnih opcija boja.

4. Ambijent

Ambiance, besplatna web aplikacija, nudi unaprijed izrađene web palete boja s drugih web-mjesta boja na webu. Radi kao tradicionalna web aplikacija u kojoj možete spremati boje na svoj profil i stvarati vlastite sheme ispočetka. Sve ove web palete boja dolaze od Colorloversa. Sučelje Ambiance olakšava pregledavanje i stavlja više fokusa na međusobnu igru ​​boja za dizajn korisničkog sučelja.

5. 0 do 255

0to255 nije baš generator sheme boja, ali može vam pomoći da fino prilagodite postojeće sheme boja. Web-aplikacija vam prikazuje sve različite nijanse tako da možete odmah miješati i uskladiti boje.

Ako vam je teško stvoriti upotrebljivu shemu boja, možete pregledati neke od gore navedenih aplikacija.

Najbolje web palete boja

Sljedeća web-mjesta koriste različite web palete boja za odličan učinak. Pomno su odabrani prema emocijama koje izazivaju i emocijama koje prenose.

1. Odopod

Odopod je dizajniran s monotonom paletom boja, ali je nastojao izbjeći da izgleda dosadno s gradijentom na svojoj početnoj stranici. Velika tipografija nudi veliki kontrast. Jasno je gdje posjetitelji žele da kliknu.

2. Torijevo oko

Torijevo oko izvrstan je primjer jednobojne sheme boja. Ovdje se vide učinci jednostavne, ali moćne palete boja usredsređene na nijanse zelene. Ovu shemu boja obično je lako izvući, jer će jedna nijansa jedne boje gotovo uvijek funkcionirati s drugom nijansom iste boje.

3. Cheese Survival Kit

Crvena je izuzetno popularna boja za paletu boja web stranice. Može prenijeti bogatu mješavinu emocija, što ga čini svestranim. Kao što možete vidjeti na web stranici Cheese Survival Kit, posebno je moćan kada se koristi u malim dozama. Crvena je omekšana neutralnijim bojama, a plava pomaže kod CTA-ova i drugih područja na kojima tvrtka želi privući pozornost posjetitelja.

4. Ahrefs

Ahrefs je primjer web stranice koja slobodno koristi paletu boja. Tamnoplava djeluje kao prevladavajuća boja, ali varijacije postoje na cijelom web mjestu. Isto vrijedi i za boje narančaste, ružičaste i tirkizne.

Najčešća pitanja o bojama

1. Koja je najbolja boja za web stranicu?

Plava je definitivno najsigurniji izbor jer je najpopularnija boja s 35%. Međutim, ako svi vaši konkurenti koriste plavu boju, možda bi imalo smisla "razlikovati" svoju ponudu i robnu marku. Ali morate paziti da ne preopterećujete posjetitelje.

2. Koliko boja treba imati web stranica?

Uzmite u obzir da 51% brendova ima jednobojne logotipe, 39% koristi dvije boje, a samo 19% tvrtki preferira logotipe u punoj boji. Odavde možete vidjeti da web stranice s 1, 2 i 3 boje imaju više smisla od pokušaja izrade web stranice s duginim bojama. Međutim, robne marke poput Microsofta i Googlea vjeruju u prednost rada s više boja jer koriste najmanje 4 jednobojne boje u svom dizajnu.

3. Gdje da koristim boje?

Boje koje upadaju u oči treba koristiti štedljivo, inače će izgubiti učinak. Ovaj učinak mora biti u točkama konverzije kao što su gumbi "Kupi sada".