1. Boyut "Büyük" hemen her zaman daha dikkat çekici olsa da konu tasarımsa bunun her zaman iyi olduğunu söyleyemeyiz. Yine de hiyerarşinin içindeki detayları karmaşık hale sokmadan, en önemli unsurların büyük kullanmak başarılı bir yöntem. Fitts Kanunları'nın kullanıcıların daha büyük nesnelere tıklarken daha az gayret sarf ettiğini söylüyor. Bu durum, sitedeki dinamik çağrılar için de geçerlidir ki bu kullanıcının gideceği yolu bulmasında büyük bir etki yaratacaktır. Elbette söylemek istediğimiz şey, "İNDİR" butonunun diğer butonlardan 10 kat daha büyük olması gerektiği değildir. Büyüklük faktörü, bütün kelimelerin arasında bir uyum olduğu zaman değerlidir. Tıklanabilirlik adına, sitenin tüm görsel tasarımı için büyüklük önemli bir faktördür. Belirli ölçüde büyük öğeler sağdan sola veya yukarıdan aşağıya estetik olarak dizilebilir. Ayrıca, belirli bir bakış açısıyla kontrast ve renk düzenleri esas olarak alınabilir. Boyutu etkileyen faktörler arasında metin ve tipografi de önemli bir yer tutar. Makalelerin ana başlıkları ve alt başlıklarında görüldüğü gibi gerçekten önemli faktörlerdir. Smashing Magazine'in yayınladığı 50 popüler web sitesinde ortalama boyutlar şu şekilde;
- Başlıklar: 18-29 piksel
- Gövde: 12-14 piksel
![web tasarımda görsel](https://cdn.dijitalajanslar.com/2015/07/web-tasarimda-gorsel.jpg)
2.Renk Siteniz için seçtiğiniz renkler büyük önem taşır. Her rengin kendine has psikolojik bağlantıları vardır. Bir araştırma yapıp, bu konunun detaylarını öğrenebilirsiniz. Bir an için durup düşünmemiz gereken bir olgu vardır ki dengeleri tamamen değiştirebilir. Bu, renklerin kendi aralarındaki hiyerarşik karakterleridir. Örneğin siyah ve kırmızılar, genellikle daha kolay dikkat çeker. Arka planlar içinse en uygun renklerin yumuşak sarı ve krem rengi olduğunuz söyleyebiliriz. Ancak, bu etkiler kontrast kullanarak geliştirilebilir. Oluşturulan kontrast, daha dikkat çekici bir görünüm kazandıracaktır. Doğal olarak, dijital tasarımcı ve sanat yönetmeni Vito Salvatore'nin web sitesinde ikna edici renklerde görseller bulunuyor. Özellikle kendi giriş sayfası için seçtiği fotoğraflar, sanatçının yeteneğini ortaya koyuyor. Renk hiyerarşisi açısından, kum ve gökyüzü, mavi ve tezat olan yumuşak sarı olarak derin bir kontrast ihtiva ediyor. İşlevsellik açısından, beyaz seçimi ve fotoğrafların hareketliliği, arka plandaki kadrajın sanatsal lezzetine şık bir görünüm katıyor.
![web tasarımda görsel hiyerarşi](https://cdn.dijitalajanslar.com/2015/07/web-tasarimda-gorsel-hiyerarsi.jpg)
3. Yerleşim Arayüzler, web sitesi tasarımında, görsel hiyerarşiyi kontrol etmek için en kestirme yollardan biridir. Özetle, dikkat çekici alanlara, öncelik yoğunluğuna uygun öğeler yerleştirebilirsiniz. Bu sizin görsel hiyerarşinizin en yüksek noktasını oluşturabilir. Ancak, ekranda şekillendirilecek birden fazla alan bulunur. Görsel etkenlerden ilki 'birincil piksel' olarak adlandırılır. Fitt Kanunları'na ait diğer prensiplerinden yararlanmak için derinlemesine bakmamız gerekir. Tasarımda ekranın köşelerine dikkat etmekte fayda var. Köşelerdeki görseller, detay gerektirdiğinden fazlaca özene ihtiyaç duyar. Adoratorio'nun sayfasında öncelikle ekranın merkezine odaklanmak gerekirken , durgun bağlar, alt köşede kolay erişilebilir bir hal alıyor. Aşağıya ve yukarıya kaydırma değişiklikleri ortada görüntüleniyor. Ancak site logosu, menüsü, iletişim ve sosyal medya linkleri hala birinci bölge içerisinde konumlandırılıyor.
![web tasarımda görsel hiyerarşi kuralları](https://cdn.dijitalajanslar.com/2015/07/web-tasarimda-gorsel-hiyerarsi-kurallari.jpg)
4. Boşluk Bir tasarımda boşuklar,sayfanın işlevini güçlendirir. Boşluklar, görsel hiyerarşiyi iki şekilde etkiler; yakınlık ve negatif boşluk. Görsel açıdan kullanılan yakınlık, bir ölçütün anlamını ve işlevselliğini sunmak adına bir web tasarımcısı için çok güçlü bir araçtır. Gestalt prensiplerinde, yirminci yüzyıl düşünce akımlarının, görsel ve psikolojik okulundan örnekler bulunur. Buna göre kullanıcı benzer işleve sahip ögeleri birbirine yakın olduğunda daha kolay algıladığını gösterir.
![web tasarımda görsel hiyerarşi ilkeleri](https://cdn.dijitalajanslar.com/2015/07/web-tasarimda-gorsel-hiyerarsi-ilkeleri.jpg)
![görsel hiyerarşi](https://cdn.dijitalajanslar.com/2015/07/gorsel-hiyerarsi.jpg)
5. Tarz Web tasarımda görsel hiyarşinin tek bir başarılı yolu yoktur. Desenler, grafikler ya da imaj kullanımı yoluyla kendinize has bir tarz oluşturabilirsiniz. Tüm bu ögeler görsel hiyerarşiyi etkiler ve kendinizi anlatmanıza yardımcı olur. En güçlü tarz oluşturma araçlarından biri de desendir. Doğru kullanıldığında desen boyut ve renk gibi unsurlara ek olarak derinlik ve kişisel bir atmosfer yaratarak tasarımınızı güçlendirir. Desenli bir element kullanmak da desenli arkaplan üzerine kullanılan desensiz obje de sayfanızın dikkat çekmesini sağlayacaktır.
![görsel hiyerarşi ilkeleri](https://cdn.dijitalajanslar.com/2015/07/gorsel-hiyerarsi-ilkeleri.jpg)
![web tasarım](https://cdn.dijitalajanslar.com/2015/07/web-tasarim.jpg)
Sonuç Yukarıda sözünü ettiğimiz görsel hiyerarşi ilkeleri, web tasarımcılarının hayatını kolaylaştıracak temel yapı taşlarıdır. Hatta, daha iyisini tasarlamak için bir gerekliliğin ötesinde olduğunu söylemek bile mümkün. Becerinin sürekliliği, insanı ustalaştırır. Eğer, tasarım piksel olarak mükemmel olsa bile her bir kullanıcı ile birlikte belirsizlik unsuru artacaktır. Çünkü herkes kendi sevdiği rengi görmek isteyebilir. Sade, anlaşılır ve farklı kullanıcılara hitap eden arayüzler, görsel hiyerarşinin amacıdır.