Web tasarım için 6 temel renk rehberi

Web tasarım için 6 temel renk rehberi

1. Renk düzeni resmin kendisi değil onun tualidir.

Web tasarımın en temel prensiplerinden birisi, mükemmel bir tasarım oluşturmak için ne kadar zaman harcarsanız harcayın, şovun gerçek yıldızı gölgelerde saklanan içeriktir. Renk düzeni içeriğin sunduğundan daha fazla gösteriş katmamalıdır. Web tasarım, içeriği ön plana çıkaracak bir arka plan oluşturmalıdır.

Web tasarımında çok yaygın bir süreç, tasarımın kendisini genellikle Photoshop veya Sketch gibi yazılımlarda göreli olarak izole etmektir. Eğer içerik örnekleriniz yerli yerinde kullanılmadıysa, web tasarım belki mükemmel görünecektir ve müşteriyi memnun edecektir ancak site ziyaretçileri için dikkat dağıtıcı bir unsur oluşacaktır. Gerçekte web tasarım süreci o kadar içeriğe bağımlıdır ki, içeriği kötü olan pek çok harika web tasarım örneği içi boş görünmektedir.

Sitede kullanılmasını düşündüğünüz içeriğin bir parçasını tasarım sürecine dahil etmek ve onun etrafında web tasarımı yapmak her zaman iyi bir fikir olmuştur. Bu, özellikle belirli bir stildeki fotoğrafların veya görüntülerin dahil edilmesi durumunda geçerlidir, böylece tasarımınızın onlarla uyumlu bir şekilde akacağından emin olabilirsiniz. Sitenin içeriğinin, bir terzi gibi, bir kişinin üzerine mükemmel oturan bir hale getirmeye çalışılan bir elbise olduğunu hayal ediniz.

2. Basit Gri Tonlamalarla Başlayın.

Web tasarımınızın ana arka planı ve metin tabanı için seçebileceğiniz sonsuz sayıda renk kombinasyonu bulunmaktadır. Buna rağmen bizim önerimiz basit olan ile başlamanızdır. Buna örnek olarak gösterilebilecek beyaz veya açık gri arka plan üzerine koyu renk gri metinler kullanılabilir.

Eğer popüler web sitelerine bir göz gezdirirseniz, bunların web tasarımının pek çoğunun açık gri arka plan üzerine koyu gri metinlerden oluştuğunu görebilirsiniz. Bunun çok iyi bir sebebi bulunmaktadır. Bu renk tonları ile oluşturulan bir web tasarım, kullanıcıya okunaklılık sağlayacağı gibi içeriği ve resimleri ön plana çıkarmayı garantilemiş olur.

Genel olarak konuşmak gerekirse, sitenizin metinleri için tam siyah renklerden kaçınmanız bunun yerine koyu gri renkler tercih etmeniz okunaklılığı bir miktar arttıracaktır. #333333 ve #666666 arasındaki renkler okuma için en iyi aralıktır.

Web tasarımda sitenizin ana içeriğinin bulunduğu kısım için arka plan renkleri olarak tam beyaz #ffffffff kullanmak en güvenli yöntemdir. Diğer kısımlar için #FFFFFF ile #CCCCCC arasında renk tonları seçilebilir.

Burada yazıklarımız web tasarımınız için seçeceğiniz renkler için kesin kurallar değildir ancak başlangıç için iyi bir rehber olacağı görüşündeyiz.

3. Vurgularda kullanılmak üzere sadece bir renk seçiniz.

Web tasarımda renk düzeninin en çok yanlış kullanıldığı yer, birkaç rengin çekişme içinde olduğu yerlerdir. Ne kadar çok renk kullanırsanız onları kontrol etmesi o kadar zorlaşır. Başlangıç olarak gri tonlamalı paletinize bir tane renk ekleyin. Bu rengi web tasarımınızın linkleri, bazı başlıkları, menüleri ve butonları gibi öğeleri vurgulamak için kullanınız. Vurgu renginiz mavi, yeşil , kırmızı gibi canınızın istediği her hangi bir renk olabilir.

Öncelikle web tasarımınızın üstünde bir kutu oluşturun ve seçtiğiniz rengi bu kutuya verin, böylece seçtiğiniz rengin web tasarımınızdaki diğer renklerle nasıl uyum sağladığını gözlemlemiş olursunuz. Daha sonra renk seçicinizi ( color picker ) açın ve sağ üst çeyreğinin orta noktasını seçin. Daha sonra kaydırma çubuğunu yukarı ve aşağı hareket ettirerek web tasarımınız için en uygun olduğunu düşündüğünüz rengi seçin.

Bu noktada web tasarımınız için elinizde toplam 3 tane renk bulunacaktır. Arka plan renginiz, metin renginiz ve vurgularda kullanacağınız renginiz. İleride birden fazla vurgu rengi kullanabilirsiniz aslında kullanmalısınız da. Ancak başlangıç için elinizdeki 3 renk yeterli olacaktır.

Şu ana kadar nasıl “hue” seçeceğinizi öğrendiniz. Renk seçicinizdeki ( color picker ) kaydırma çubuğunu yukarı aşağı oynattığnızda “H” harfi ile gösterilen ( hue ) değerinin değiştiğini göreceksiniz.

4. Eğer kuşkunuz varsa maviyi kullanın.

Eğer hangi vurgu rengini seçeceğiniz konusunda kuşku içerisindeyseniz, mavi rengi seçin. Gerçekten de mavi en esnek renktir ve pek çok web tasarım örneğine uyum sağlayacaktır. Mor ve sarı renkler gerçekten çok güzel durabilirler ancak yanlış kullanıldıklarında cafcaflı bir görünüm oluşturacaklardır bu da web tasarımın içeriğin önüne geçmesine neden olacaktır.

Diğer taraftan, web tasarımınızda vurgu rengi olarak mavi ile hemen hemen her şeyi yapabilirsiniz ve çok fazla yanlış yapamazsınız. Eğer nereden başlayacağınızdan emin değilseniz veya projenizde hangi rengi kullanacağınıza karar veremiyorsanız maviyi kullanın. Hue 235 ile hue 190 arasındaki tüm mavi renkler oldukça güvenli renklerdir.

5. Vurgu renginizi çeşitlendirin.

Vurgu renginizi bir kere seçtikten sonra kaydırma çubuğunu olduğu yerde bırakın. Web tasarımınız için ekstra renklere ihtiyacınız olacaktır ancak bu renkler vurgu renginizin varyasyonları olmalıdır ki işleri kontrol altında tutabilesiniz. Vurgu renginizi çeşitlendirmek için “hue” yi olduğu yerde bırakın ve renk seçicinizdeki renk alanından vurgu renginizin farklı bir tonunu seçiniz. Bu yeni rengi web tasarımınızda hover efektleri , borderlar, gradientler, ışık ve gölge efektleri için kullanabilirsiniz.

6. Sağ üst köşeden uzak durun

Renk seçicinizin sağ üst köşesi yüksek oktanlı renkleri barındırır. Bu alandaki renkler formula 1 arabaları gibidir. Mükemmel işler başarabilirler ancak bunları kullanmak çok fazla deneyim ister. Deneyim olmadan bu renkler kazalara sebebiyet verebilirler, eğer yeterli tecrübeniz yoksa daha ortalardaki renkleri kullanmak web tasarımınız için daha güvenli olacaktır.