Web Tasarımda Altın Oran

Web Tasarımda Altın Oran
  • 28
    Mar

Merhaba;
Matematikte olsun geçmiş yapılarda olsun (piramitler vs.) altın orana dikkat edilerek yapıldığı söyleniyor. Tasarımın bir çok alanında bunun varlığından da sıkca bahsediliyor. Peki web tasarımda altın oran nasıl yapılıyor ? Şimdiden teşekkürler.

Gönderen : Ahmet Burak I.  Tarih : 28.03.2016


Ahmet Burak bey merhaba;
Altın oran web tasarımda da sıkça kullanılan tasarım kriterlerinden birisi. Bu konuda ölçümler, tarayıcılar, sayfa genişlikleri vs. dikkate alınarak yapılır. Fakat işin detayına girmeden basitçe anlatmaya çalışalım.

Altın oran web tasarımda bir çok tasarımcı tarafından genişlik değerleri hesaplanırken kullanılıyor. Fakat altın oranı yükseklik değerlerinde de kullanmak daha hoş bir görüntü sağlayabilir. Bir web sitesinde altın oranı belirlemek için şöyle bir örnek verebiliriz. Örneğin web sayfanızda bir içerik var hemen sağ tarafında da bir menü. Toplam sayfa genişliğimiz ise 900 px. Altın orana göre içeriğin yazdığı kısım kaç px, sağ şerit kaç pixel olması gerekir ? Bu noktada küsüratlarından arındırarak genelde altın oranı 1.62 baz alınarak hesaplıyoruz biz. Buna göre 900 / 1.62 = 555.55 px. Yani sayfamızın içerik genişliği 555 pixel kalan kısım da 345 pixel. Bu değerler olmazsa olmaz mıdır ? Elbette değil. Yani 555 pixeli siz 575 pixel olarak da kullanabilirsiniz. Bu biraz da içerik yoğunluğuyla şekillenebilir.

Peki altın oranı yükseklik değerlerinde nasıl kullanacağız ? Mesela biraz önceki örnekte sağ tarafın yüksekliği 345 pixel çıktı. Biz de bu genişlikte bir resim koyalım dedik. Peki yükseklik altın orana göre nasıl olmalı ? Şöyle ki; 345 / 1.62 = 212.96 pixel. Bu yükseklikte bir görsel kullanımı da altın orana uyumlu olur demek mümkün.

Son olarak şunu da mutlaka belirtmemiz gerekiyor; altın oranı statik bir noktada kullanmak çok fazla etkilemez. Mesela sadece sağ taraftaki resmin 345 * 212 px boyutlarında olması çok de farkedilmeyebilir. Altın oran genel bir konsepttir ve kurgusu da tüm yapı üzerine yapılmalıdır. Bu şekilde daha verimli ve hoş görüntü sağlayabilirsiniz.


Bir önceki yazımız olan CMS Nedir ? Ne İşe Yarar ? başlıklı makalemizde cms ne işe yarar ve cms sistemleri nedir hakkında bilgiler verilmektedir.