Veb Rəng Palitraları

Veb rəng palitraları nədir?

Rənglər veb-dizaynerlər və qrafik dizaynerlər üçün çox vacibdir. Dizaynerlər gündəlik həyatda mavi, qırmızı və yaşıl olaraq təsvir etdiyimiz rəngləri #fff002, #426215 kimi kodlarla təsvir edir. Hansı növ kodlaşdırma layihəsi ilə məşğul olmağınızdan asılı olmayaraq, yəqin ki, nə vaxtsa rənglərlə işləməyə başlayacaqsınız. Bir çox insanın veb səhifələrinin dizaynında etdiyi kimi HTML-dən istifadə edərək kodlaşdırmağı öyrənsəniz, bu xüsusilə faydalı olacaq.

Hex kodu rənglərdə nə deməkdir?

Hex kodu üç dəyəri birləşdirərək rəngi RGB formatında təmsil etmək üsuludur. Bu rəng kodları veb dizayn üçün HTML-nin ayrılmaz hissəsidir və rəng formatlarını rəqəmsal şəkildə təmsil etmək üçün vacib bir yol olaraq qalır.

Hex rəng kodları funt işarəsi və ya hashtag (#) və ardınca altı hərf və ya rəqəmlə başlayır. İlk iki hərf/rəqəm qırmızıya, sonrakı ikisi yaşıl rəngə və sonuncu ikisi maviyə uyğundur. Rəng dəyərləri 00 ilə FF arasındakı dəyərlərlə müəyyən edilir.

Dəyər 1-9 olduqda nömrələr istifadə olunur. Qiymət 9-dan böyük olduqda hərflərdən istifadə olunur. Məsələn:

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

Hex rəng kodları və RGB ekvivalentləri

Ən çox yayılmış hex rəng kodlarından bəzilərini yadda saxlamaq, yalnız həmin dəqiq rənglərdən istifadə etmək istədiyiniz zaman deyil, altıbucaqlı rəng kodunu görəndə başqa rənglərin nə olacağını daha yaxşı təxmin etməyə kömək edə bilər.

• Qırmızı = #FF0000 = RGB (255, 0, 0)
• Yaşıl = #008000 = RGB (1, 128, 0)v
• Mavi = #0000FF = RGB (0, 0, 255)
• Ağ = #FFFFFF = RGB (255,255,255)
• Fil Dişi = #FFFFF0 = RGB (255, 255, 240)
• Qara = #000000 = RGB (0, 0, 0)
• Boz = #808080 = RGB (128, 128, 128)
• Gümüş = #C0C0C0 = RGB (192, 192, 192)
• Sarı = #FFFF00 = RGB (255, 255, 0)
• Bənövşəyi = #800080 = RGB (128, 0, 128)
• Narıncı = #FFA500 = RGB (255, 165, 0)
• Bordo = #800000 = RGB (128, 0, 0)
• Fuşya = #FF00FF = RGB (255, 0, 255)
• Əhəng = #00FF00 = RGB (0, 255, 0)
• Aqua = #00FFFF = RGB (0, 255, 255)
• Mavi = #008080 = RGB (0, 128, 128)
• Zeytun = #808000 = RGB (128, 128, 0)
• Tünd göy = #000080 = RGB (0, 0, 128)

Veb sayt rəngləri niyə vacibdir?

Rənglərdən təsirlənmədiyinizi düşünə bilərsiniz, lakin bir araşdırmaya görə insanların 85%-i rəngin aldıqları məhsula böyük təsir etdiyini söyləyir. O, həmçinin deyir ki, bəzi şirkətlər düymələrin rənglərini dəyişdikdə, onların dönüşümlərində kəskin artım və ya azalma müşahidə ediblər.

Məsələn, proyeksiya ekranları istehsal edən Beamax şirkəti mavi linklərlə müqayisədə qırmızı linklərə kliklərin 53,1% böyük artdığını qeyd edib.

Rənglər təkcə kliklərə deyil, həm də markanın tanınmasına böyük təsir göstərir. Rənglərin zehni təsirinə dair araşdırma nəticəsində məlum olub ki, rənglər markanın tanınmasını orta hesabla 80% artırır. Məsələn, Coca-Cola haqqında düşünəndə, yəqin ki, canlı qırmızı qutuları təsəvvür edəcəksiniz.

Veb saytlar üçün rəng sxemini necə seçmək olar?

Veb saytınızda və ya veb tətbiqinizdə hansı rəngləri seçəcəyinizə qərar vermək üçün əvvəlcə nə satdığınızı yaxşı başa düşməlisiniz. Məsələn, daha yüksək keyfiyyətli, yüksək səviyyəli bir görüntü əldə etməyə çalışırsınızsa, seçməli olduğunuz rəng bənövşəyidir. Bununla belə, daha geniş auditoriyaya çatmaq istəyirsinizsə, mavi; Sağlamlıq və ya maliyyə kimi daha həssas mövzular üçün yaxşı uyğun gələn sakitləşdirici və yumşaq rəngdir.

Yuxarıdakı nümunələr bir çox tədqiqatlarla sübut edilmişdir. Ancaq veb saytınız üçün seçdiyiniz rəng dizaynınızın mürəkkəbliyindən və rəng birləşmələrinin növlərindən asılıdır. Məsələn, monoxrom veb dizayn palitrasından istifadə edirsinizsə, ekranda kifayət qədər müxtəliflik əldə etmək üçün sizə bu rəngin yeddi və ya daha çox çalarları lazım ola bilər. Mətn, arxa planlar, keçidlər, hover rəngləri, CTA düymələri və başlıqlar kimi saytınızın müəyyən hissələri üçün rənglər təyin etməlisiniz.

İndi "Vebsaytlar və veb proqramlar üçün rəng sxemini necə seçmək olar?" Gəlin buna addım-addım nəzər salaq:

1. Əsas rənglərinizi seçin.

Əsas rəngə qərar verməyin ən yaxşı yolu məhsul və ya xidmətinizin əhval-ruhiyyəsinə uyğun rəngləri araşdırmaqdır.

Aşağıda sizin üçün bəzi nümunələri sadaladıq:

• Qırmızı: Həyəcan və ya xoşbəxtlik deməkdir.
• Narıncı: Bu, mehriban, əyləncəli vaxt deməkdir.
• Sarı nikbinlik və xoşbəxtlik deməkdir.
• Yaşıl: Təravət və təbiət deməkdir.
• Mavi: etibarlılıq və əminlik deməkdir.
• Bənövşəyi: Keyfiyyət tarixi ilə seçilən brendi təmsil edir.
• Qəhvəyi: Hər kəsin istifadə edə biləcəyi etibarlı məhsul deməkdir.
• Qara lüks və ya zəriflik deməkdir.
• Ağ: Qəşəng, istifadəçi dostu məhsullara aiddir.

2. Əlavə rənglərinizi seçin.

Əsas rənginizi tamamlayan bir və ya iki əlavə rəng seçin. Bunlar ideal olaraq əsas rənginizi "çarpıcı" edən rənglər olmalıdır.

3. Fon rəngi seçin.

Əsas rənginizdən daha az "aqressiv" olacaq fon rəngi seçin.

4. Şrift rəngini seçin.

Veb saytınızdakı mətn üçün rəng seçin. Qeyd edək ki, bərk qara şrift nadirdir və tövsiyə edilmir.

Dizaynerlər üçün ən yaxşı veb rəng palitraları

Softmedal veb rəng palitrası kolleksiyasında axtardığınız rəngi tapa bilmirsinizsə, aşağıdakı alternativ rəng saytlarına nəzər sala bilərsiniz:

Rəng seçimi uzun bir prosesdir və çox vaxt düzgün rəngləri tapmaq üçün çox incə tənzimləmə tələb olunur. Bu nöqtədə, sıfırdan müvafiq rəng sxemlərini yaradan 100% pulsuz veb proqramlardan istifadə etməklə vaxtınıza qənaət edə bilərsiniz.

1. Paletton

Paletton bütün veb-dizaynerlərin bilməli olduğu veb proqramdır. Sadəcə bir toxum rəngi daxil edin və proqram qalanını sizin üçün edir. Paletton dizayn haqqında heç nə bilməyənlər və yeni başlayanlar üçün etibarlı seçim və əla veb proqramdır.

2. Rəng Təhlükəsiz

WCAG dizayn prosesinizdə hər hansı bir narahatlıq doğurursa, Color Safe istifadə etmək üçün ən yaxşı vasitədir. Bu veb tətbiqi ilə siz WCAG təlimatlarına uyğun olaraq mükəmməl qarışan və zəngin kontrast təklif edən rəng sxemləri yarada bilərsiniz.

Rəng Təhlükəsiz veb proqramından istifadə etməklə siz saytınızın WCAG qaydalarına uyğun olmasına və hər kəs üçün tam əlçatan olmasını təmin edirsiniz.

3. Adobe Color CC

O, ictimai istifadə üçün yaradılmış pulsuz Adobe alətlərindən biridir. Bu, hər kəsin sıfırdan rəng sxemləri yarada biləcəyi mükəmməl veb proqramdır. Bu, ehtiyaclarınıza ən uyğun olan bir çox müxtəlif rəng modelləri arasından seçim etməyə imkan verir. İnterfeys ilk baxışda bir az çaşqın görünə bilər, lakin buna öyrəşdikdən sonra gözəl rəng seçimlərini seçməkdə heç bir problem yaşamamalısınız.

4. Ambians

Pulsuz veb tətbiqi Ambiance internetdəki digər rəng saytlarından əvvəlcədən hazırlanmış veb rəng palitralarını təklif edir. O, profilinizdə rəngləri saxlaya və sıfırdan öz sxemlərinizi yarada biləcəyiniz ənənəvi veb proqramı kimi işləyir. Bütün bu veb rəng palitraları Colorlovers-dan gəlir. Ambiance interfeysi baxışı asanlaşdırır və UI dizaynı üçün rəng qarşılıqlılığına daha çox diqqət yetirir.

5. 0-255

0to255 tam olaraq rəng sxemi generatoru deyil, lakin mövcud rəng sxemlərini dəqiq tənzimləməkdə sizə kömək edə bilər. Veb proqramı sizə bütün müxtəlif çalarları göstərir ki, siz dərhal rəngləri qarışdırıb uyğunlaşdırasınız.

Əgər istifadə edilə bilən rəng sxemi yaratmaqda çətinlik çəkirsinizsə, yuxarıdakı tətbiqlərdən bəzilərini nəzərdən keçirə bilərsiniz.

Ən yaxşı veb rəng palitraları

Aşağıdakı saytlar böyük effekt əldə etmək üçün müxtəlif veb rəng palitralarından istifadə edir. Oyandırdıqları duyğulara və ötürdükləri duyğulara görə diqqətlə seçilirlər.

1. Odopod

Odopod monoton rəng palitrası ilə hazırlanmışdır, lakin əsas səhifəsində gradientlə darıxdırıcı görünməmək məqsədi daşıyırdı. Böyük tipoqrafiya böyük kontrast təqdim edir. Ziyarətçilərin harada klikləmək istədikləri aydındır.

2. Torinin Gözü

Tori's Eye monoxrom rəng sxeminin əla nümunəsidir. Burada yaşıl çalarları ətrafında mərkəzləşdirilmiş sadə, lakin güclü rəng palitrasının təsirləri görünür. Bu rəng sxemi adətən asanlıqla çəkilir, çünki bir rəngin bir kölgəsi demək olar ki, həmişə eyni rəngli başqa bir kölgə ilə işləyəcəkdir.

3. Pendirdən sağ qalma dəsti

Qırmızı vebsayt rəng palitrası üçün son dərəcə populyar rəngdir. O, emosiyaların zəngin qarışığını çatdıra bilər və onu çox yönlü edir. Pendir Survival Kit saytında gördüyünüz kimi, kiçik dozalarda istifadə edildikdə xüsusilə güclüdür. Qırmızı daha neytral rənglərlə yumşaldılır, mavi isə CTA-lara və biznesin ziyarətçinin diqqətini cəlb etmək istədiyi digər sahələrə kömək edir.

4. Ahrefs

Ahrefs, rəng palitrasından sərbəst istifadə edən veb-sayt nümunəsidir. Tünd mavi üstünlük təşkil edən rəng kimi çıxış edir, lakin saytın hər yerində varyasyonlar mövcuddur. Eyni şey narıncı, çəhrayı və firuzəyi rənglərə də aiddir.

Rənglərlə bağlı ən çox verilən suallar

1. Veb sayt üçün ən yaxşı rəng hansıdır?

Mavi ən etibarlı seçimdir, çünki 35% ilə ən populyar rəngdir. Bununla belə, rəqibləriniz hamısı mavi rəngdən istifadə edirsə, təklifinizi və markanızı "fərqləndirmək" mənasız ola bilər. Ancaq ziyarətçiləri sıxmadığınızdan əmin olmalısınız.

2. Saytda neçə rəng olmalıdır?

Nəzərə alın ki, brendlərin 51%-i monoxrom loqolara malikdir, 39%-i iki rəngdən istifadə edir, şirkətlərin isə yalnız 19%-i tam rəngli loqolara üstünlük verir. Buradan görə bilərsiniz ki, 1, 2 və 3 rəngli vebsaytlar göy qurşağı rəngləri ilə veb sayt yaratmağa çalışmaqdan daha məntiqlidir. Bununla belə, Microsoft və Google kimi brendlər dizaynlarında ən azı 4 bərk rəngdən istifadə etdikləri üçün daha çox rənglə işləməyin üstünlüyünə inanırlar.

3. Rəngləri harada istifadə etməliyəm?

Göz oxşayan rənglərdən az istifadə edilməlidir, əks halda təsirini itirəcək. Bu effekt "İndi al" düymələri kimi dönüşüm nöqtələrində olmalıdır.