İçindekiler
Web sitesi tasarlarken hem ziyaretçilerin dikkatini çekecek şekilde hem de uyumlu renk kodları kullanmak gereklidir. Zira web sitelerinde en çok nizam ve renk ahengi dikkat çeker.
Çoğu web sitesi sahibi, web tasarımı üzerine pek düşünmez. Renk kodlar konusundan çok, logolara daha çok değer gösterirler. Fakat renk seçimleri iddia edilenden çok daha kıymetlidir. Doğru renk kodlarının seçimleri ziyaretçilerinizin web sitenizi tercih etmesini ve web sitenizde geçirdiği süreyi etkilemektedir.
Web sitenizi yine tasarlıyorsanız yahut var olan bir siteyi güncelliyorsanız, web sitenizin içeriğine göre renk seçimi yapmanız çok değerlidir. Vakit zaman değişen renk trendlerini takip ederek siteniz için en hakikat renk kodları tercihlerini yapmalısınız. Bilhassa WordPress web tasarım yaparken bu renk kodları kullanmak daha kolay ve kıymetli olabilir.
İlk olarak web sitesini oluştururken, renk şemasını ayrıntılı olarak inceleyin. Yanlışsız renkler, kimliğinizi oluşturmaya ve ziyaretçilerinizi tutmaya fayda. Örneğin, birtakım araştırmalara nazaran mavi renk tercihlerinin, kırmızı renk tercihlerinden %53,1 daha az tıklanma aldığı görülmüştür.
Web Tasarımında Renk Seçimi Nasıl Yapılır?
Web sitenizin html renk kodları, kimliğinizi oluşturacağından uzun vadeli bir seçim yapmak gerekir. Yıllara nazaran ve içeriğinize nazaran seçim yapmanız, en doğru seçimi yapmanıza yardımcı olacaktır. Birebir vakitte bu seçim sizin karakterinizi ve gücünüzü de yansıtacaktır. Örnek olarak; kırmızı, pembe ve turuncu üzere renkler daha eğlenceli ve sıcak bir imaj verebilir.
2020 yılında daha soft renkler web sitelerinde tercih ediliyordu. 2021 yılında ise daha canlı, yeşil ve turuncu üzere renkler daha çok tercih edildi. 2022 yılında ise ana renkler ve toprak tonları her alanda trend renklerdi. 2023 yılında ise birbirinden daha zıt dikkat alımlı renkler kullanılmaya başlandı.
Web Dizaynında Ana Renk Seçimi
Renk seçimlerinin yapılması öncesinde hazır kombinasyonlara bakmak sürecinizi hızlandırabilir. Lakin kendinize nazaran seçmeniz özgünlük açısından daha yeterli olabilir. Renk kombinasyonunuzu oluşturmadan evvel bir ana renk seçmek birinci adım olacaktır. Her rengin kendine nazaran bir manası ve söz ettiği bir şey vardır. Bunların en çok kullanılanlarını sıralayacak olursak:
- Kırmızı: Heyecan, memnunluk, aşk ve tutkuyu söz eder. Tasarımlarınızda yavuz durur. (Coca-Cola, Netflix, KFC, Bosch)
- Turuncu: Dostluk, yaratıcılık ve enerjiyi temsil eder, kırmızıyla çabucak hemen birebir ifadeyi taşır. (Trendyol, Fanta, Hepsiburada)
- Sarı: Optimistlik, memnunluk, doğallık ve umut manasına gelir. Lakin kimi ülkelerde manası daha farklı olabilir. Orta Doğu’da yası tabir ederken, Afrika’da zenginliği ve neşeyi tabir etmektedir. Sarı rengi her vakit dikkat caziptir. (Lays, Ikea, McDonald’s)
- Yeşil: Tazelik, ahenk ve büyüme manalarını taşır. Zerzevat eserlerinin doğallığı ve tazeliğini temsil eder. (Komili, Starbucks, Subway)
- Mavi: Güvenlik, sakinliği temsil eder. Birebir vakitte marklarda kullanımı, profesyonelliği temsil eder. (Mavi, Oral-B, Facebook, Pepsi)
- Mor: Lüks ve gizem üzere pek çok manası tabir eden renk kraliyet ailelerinde kullandığı özel bir renktir. (Milka, Gratis, Getir)
- Kahverengi: Güvenlik, sıhhat ve dürüstlük manalarını tabir eder. (Nespresso, UPS, Gloria Jean’s Coffees, Nestle)
- Pembe: Gençliği ve eğlenceyi temsil etmektedir. Tatlılık ve cilveyi de tabir eder. (Penti, LG, Barbie)
- Siyah: Lüks, güç ve zarafet demektir. (Chanel, Adidas, Puma, Prada, Apple, Gucci)
- Beyaz: Şıklığı, sadeliği, paklığı söz eder. Minimalist bir renk olan beyaz zıt bir renk ile kullanıldığında çok dikkat alımlı bir hale gelir. (Apple, Nike)
- Altın, gümüş üzere metalik renkler: Zenginliği temsil eder. Dizayncılar pahalılığı ve kıymetli olduğunu temsil etmesi için bu rengi kullanabilirler.
Kendinize ve markanıza en uygun ana renge karar verdikten sonra ek bir renge karar vermek gerekir. Bunun için renk şeması oluşturan uygulamalardan faydalanabilirsiniz.
Web Dizaynında Html ve RGB
Bütün renkler; sarı, mavi ve kırmızı ana renklerinden elde edilir. Öteki yandan RGB renk modelinde renk yelpazesi, ışık ana renkleri olan kırmızı, yeşil ve maviden oluşur. Html kodu kullanılarak açılımı red, green, blue olan RGB renklerine ulaşabiliriz. Ayrıyeten renk kodu yazılımını da isterseniz, çerçevelerini yahut yazılarını kod yazarken belirterek değiştirebilirsiniz. Bu koda nazaran rengin yoğunluğu 0-255 ortasında yazılarak oluşturulur. Bu html renk örneklerini RGB kodlarıyla verecek olursak:
- Kırmızı: 255, 0, 0
- Sarı: 255, 165, 0
- Mavi: 0, 0, 255
- Pembe: 238, 130, 238
- Mor: 106, 90, 205
- Yeşil: 60, 179, 113
Kodlarını sıralayabiliriz ayrıyeten daha pek çok html renk kodları vardır. Bu kıymetlerin onaltılık karşılığına Hex pahası denir. Web tasarımcıların yahut programcıların en çok kullandığı kıymet Hex kıymetidir. Birtakım uygulamalarda kodlar yer almaksızın hazır bulunur lakin uygulamalardan faydalansanız bile en çok kullanılan renklerin renk kodları hakkında bilgi sahibi olmak gerekir. Kimilerini sıralayacak olursak;
- Beyazın renk kodu: # ffffff
- Siyah renk kodu: # 000000
- Gri renk kodu: # bebebe
- Yeşil renk kodu: # 00ff00
- Sarı renk kodu : # ffff00
- Turuncu renk kodu: # ffa500
- Kırmızı renk kodu: # ff0000
- Bej renk kodu: # f5f5dc
- Kahverengi renk kodu: # 8b4513
- Pembe renk kodu: # ff1493
- Krem renk kodu: # ffde66
- Gümüş renk kodu: # c0c0c0
Görüldüğü üzere her tonun başka renk kodu ve numarası bulunmaktadır. Günümüz teknolojisinde çok fazla dijital alet ve model bulunduğu için her telefon ve bilgisayar renkleri tam olarak yansıtamayabilir. Bu yüzden web sitenizde, fazla bulunmayan ve tercih edilmeyen renkler kullanırsanız, istediğiniz görünümü yakalayamayabilirsiniz. Bu yüzden ana ve yaygın kullanılan renkleri kullanmak, istediğiniz görünümü yakalamanıza yardımcı olacaktır.
Elbette bu bilgileri bilmekte yarar var. Ancak WordPress web tasarımı yapıyorsanız ileri düzey RGB ve HTML bilmenize gerek yok diyebiliriz. Kolaylaştırılmış WordPress paneli bu mevzuda kolay renk paletleriyle size yardımcı olacaktır.
Web Dizaynında Renk Şeması
Web sitenizde, içeriğe nazaran değişse de dört farklı renk kullanımı tercih edilir. Çok fazla renk kullanmak sitenizi karmaşıklaştıracağı üzere az renk kullanmak da silik duracaktır. Bu ahengi yakalamak için kare biçimini dörde bölüp, seçeceğiniz renk birleşimini birlikte görerek, uyumlu olup olmadığına karar verebilirsiniz.
Renklerinizi seçtikten sonra, web sitenize en uygun yazı tipinizi seçmek çok daha kolay olacaktır. Retro renklerinize uyumlu vintage yazı fontları, çağdaş görünüm elde etmek için seçtiğiniz renklere uyumlu daha klasik yazı fontlarını seçebilirsiniz. Yazı tiplerinizin renkler ile tamamlayıcı olması gerekir.
Bunun dışında rakip firmaların sitesinde kullandıkları renk kombinasyonlarına yahut alanında başarılı olan, web sitelerinde yer alan renklere göz atabilirsiniz. Bu üslup müşahedeler sitenizi tasarlamanızda ilham verici olacaktır.
En Âlâ 7 Web Sitesi Renk Şeması
Çok kullanılan ve başarısı kanıtlanmış olan birtakım renk kombinasyonlarından bahsedecek olursak;
- Yumuşak ve soft tonlar: Sade renkler çok şık gözükecektir. Minimal kullanımlar, göz yormaz ve şık durur. Birçok rengi kullanmaya çalışmak web sitenizin görünümünde kirlilik yaratabilir.
- Gri, beyaz ve kırmızı tonların ahengi: Web sitenizin daha vurgulu olması için kullanacağınız renklerin içerisinde yalnızca bir adedini öne çıkaracak biçimde seçmeniz, dikkat alımlı olacaktır.
- Beyaz ve yeşil renkler: Bu renkler bilhassa mavi ile de kullanınca çok dinamik bir imaj elde edilir. Teknoloji sayfaları genelde bu renkleri tercih eder. Genelde teknolojiyi ve suratı tabir eder.
- Turuncu ve kırmızı: Bu renk kombinasyonu birlikteyken göz yorucu olur üzere düşünülse de aslında çok vintage bir görünüm sağlanır. Müzik marketlerin genelde tercih ettiği bu renk kombinasyonu hem retro hem de çağdaş durabilir.
- Pembe tonları ve siyah: Pembenin dikkat cazipliği kullanılarak oluşturulan bu renk kombinasyonu web sitenizde yer alan içeriğin çok dikkat çekmesini sağlayacaktır.
- Sarı, yeşil ve gri tonlar: Gözleri yormayan, klasik bir renk kombinasyonudur.
- Toprak tonları: Bilhassa son vakitlerde çoğunlukla kullanılan renk kombinasyonlarıdır. Paklığı, doğallığı ve tazeliği tabir eden bur renkler bireylerde samimi bir his uyandırır.
Kullanacağınız renklerin kombinasyonları dışında kullanımı ve dokuları da çok değerlidir. Örneğin siyah üstüne siyah, düz bir biçimde kolay durabilir. Bu farklı tonlardaki siyahın dokularının ahengi da dikkat cazip ve değerli duracaktır. Birebir vakitte rengin bu biçimde kullanımı daha akılda kalıcı olacaktır.
En Çok Tercih Edilen Renk Kodu Uygulamaları
Renkler birebir vakitte bir bağlantı aracıdır, her bir renk bireylerin üzerinde farklı hisler uyandırır, bir şeyler anımsatır ve davranışları tesirler. Her bir ton bile çok kıymetlidir bu yüzden renk kodları özelinde birçok site ve uygulama mevcuttur.
Bunlardan en öne çıkanları sıralayacak olursak:
- Paletton: Birçok web tasarımcının bildiği uygulamaya ana tonu ayarlarsanız, uygulama sizlere gereğince yardımcı olacaktır.
- Color Safe: Birçok renk ve kontrast seçeneğine sahip bu uygulama çok işinize yarayacaktır.
- Adobe Color CC: Birçok renk şeması ve pek çok uygulama seçeneği ile işinizi en çok kolaylaştıracak uygulamalardan biridir.
- Ambiance: Evvelce kullanılmış ve hazırlanmış renk şemalarını size sunar.
Her firma, markasının ve logosunun neyi temsil ettiğini ve etmesini istediği şeyleri anlayarak tasarım oluşturmalıdır. Ziyaretçilerinizi sitenizde tutan faktörün %60 oranında olan web sitenizin tasarımı olduğunu unutmayın.
Hemen çabucak her html renk kodu, pek çok uygulamada bulunur. Seçeneğin çok olması kararı zorlaştırabilir. Sonuca karar vermek için sezgisel davranmak daha yararlı olabilir.
Karar vermeden evvel büyük markaların birçoklarının mavi üzere renklerin baskın kullandığını, daha sade dizaynların tercih edildiğini unutmamak gerekiyor.
Baskın bir renk varsa onu daha öne çıkaracak renkler ile tercih etmeniz daha estetik gözükecektir. Buna en âlâ örnek olarak siyah ve beyaz renk birleşimini söyleyebiliriz. Apple ve Nike üzere büyük markaların web siteleri ve logoları zıt ve dengeleyici renklerle, estetik görünüme sahiptir.
Kurumsal Web Tasarım Nasıl Olmalıdır Yazımızı da incelemek isteyebilirsiniz.
Hakkında Sıkça Sorulan Sorular
Kullandığınız art planına ve tercih ettiğiniz yazı rengine nazaran değişecektir. Art plan açıksa yazı koyu, art plan yoğunsa yazı açık renkte olmalıdır. Ayrıyeten koyu renkleri art planda kullanmamaya itina göstermelisiniz.
Web tasarımı sürecinde kullanılan, sayfa manzarasının büyük modülü olan renklere, web renkleri denir. Sıkça kullanılan renkler genelde ana renklerdir.
Üç ana rengin birleşimiyle oluşan bir rengi, RGB (red, green, blue) yolu ile tabir etme biçimi olan bir kod tipidir. Html için olmazsa olmaz olan, renklerin dijital platforma söz ediliş biçimidir.