Oluklar - Arka Plan veya Kenarlıklı Sütunlar için Dolgu ve Kenar Boşluğu


9

Bir sütunun (veya kutunun veya herhangi bir düzen modülünün) kendi arka planı veya kenarlığı olduğu için şekli açıkça görülebilir olduğunda oluklar için önerilen tasarım yönergeleri nelerdir?

Tipik olarak kutunun kenarı ile metni arasına boşluk bırakılır. Ama bu alanı nereden başlatabilirim? By kutusunu genişleyen veya metni küçülen ?

Örneklemek gerekirse, işte bazı seçenekler (hepsi değil) ...

resim açıklamasını buraya girin

(Ayrıca, herhangi bir sayıda sütun ve herhangi bir genişliğe sahip herhangi bir ızgarayı kullanabilirdim - bu sadece bir örnek olarak hizmet eder - bir düzen her seferinde oyalandığında her soru sorulabilir.)

Izgara tabanlı mizanpajlar üzerine bir yığın yazıdan geçtim, ancak şimdiye kadar konuyu ele alan sadece bir tane gördüm: Khoi Vinh tarafından Öğelerinizi Nudge .

Neyi kaçırıyorum? Yoksa açık bir kılavuz yok mu?

Şebekeye dayalı mizanpajların motivasyonlarından biri küresel uyum hissini arttırmak olduğundan, sanırım kararın daha fazla uyum talep eden şeylere bağlı olduğunu iddia edebilir; kutusunu veya içeriğini?

Yanlış okuduğum sürece Khoi Vinh makalesinde 3. seçenek için tartışıyor.

Kendimi seçenek 3 ve seçenek 6 arasında ileri geri giderken buluyorum. Seçenek 3 ile kutu hizalanır, ancak metni sıkışık hisseder. Ancak seçenek 6'yı kullanarak, ne kutu ne de metin hizalanmış olur (metin kenarı ve kutu kenarlığı arasındaki örtük orta, şimdi hizalanan 'şey' diyebilir).

Web'in ötesine geçerek, kitap tasarımı üzerine okumamın hiçbiri ve sayfa yapım kanonları da bu konuyu konuşmuyor. Kanunların 'açık arka plan üzerinde siyah harf' kitap baskısının büyük çoğunluğu için nasıl çalıştığını görebiliyorum, ancak bir sayfa düzenine renk eklediğinde (veya siyah beyaz bir düzeni ters çevirdiğinde) cilt payı sorusu geri geliyor.

Mmm, sanırım soru şu; Gösterdiğim seçenekler arasında seçim yapmak için herhangi bir kılavuz var mı - yoksa tasarımcı yasasının ötesine geçtim mi ve mesele sadece 'neyin iyi ve iyi hissettiği' ile mi ilgili?


2
Burada en iyi görünen (aslında muhtemelen # 3 üzerinde anlaşıyorum) ilgili diğerlerinin görüşleriyle herhangi bir kişisel sığır eti yok, ancak kanonlar, yönergeler ve kurallar sonuçta otoriteye keyfi başvurulardan başka bir şey değildir. Harika araçlardır, ancak Ultimate Truth (tm) aramaya gitmeyin
horatio

Lorem Hipstum, değil mi?
e100

Yanıtlar:


5

Bir ızgarayı her kullandığınızda, bir öğenin (genellikle belirli bir sayfada birden fazla öğenin olmadığı) hariç, tutarlı bir şekilde kullanmanız iyi bir nedenden ötürü ihlal etmesini sağlar - öne çıkarmak veya sayfanın ruh halini değiştirmek için . Bu çalışmanın yapılabilmesi için kontrastın kalın ve açıkça kasıtlı olması gerekir. ("İş" ile demek istediğim bir hata gibi görünmüyor.)

Kesinlikle takip edilen bir ızgara huzur içindedir. Gerginlik varsa çok az şey vardır; işler gözün nerede olmasını beklediğini gösterir ve okuyucu asla ürkünmez veya rahatsız hissettirmez.

Bu durumda, arka planınız ızgarayı # 4'teki gibi biraz ihlal ederse, bir hata gibi görünür. Bu garip. Oluk eksikliği, diğer sütunlara karşı kutuyu dolduruyor. Açıklık beklentisi belirleyen metnin açık önsözüne karşı, bu açıkça yanlıştır.

0 kontrast sağlamaz, böylece ikinci sütun diğerlerinden farklı değildir. Bazı durumlarda istediğiniz budur.

# 5 ve # 6'daki "yarım oluk" örnekleri oluğu yeniden tanımlayarak daha dar hale getirir. Aslında tüm ızgarayı yatay ve dikey olarak yeniden tanımlıyorlar, çünkü bu durumda oluk çizgi aralıklarıyla tamamen aynı olur. Bu tek başına metin için kötüdür, ancak kutu ile çalışabilir. Yine de # 6'da, metnin her iki tarafında üst ve alt ile karşılaştırıldığında orantısız beyaz boşluk var. Bu garip ve rahatsız edici çünkü mantıklı değil. # 5 tercih edilir, çünkü beyaz boşluk daha eşit dağıtılır. Aynı nedenle # 3, # 2 ye tercih edilir.

Genel olarak, o zaman, ben Lauren ile kabul ediyorum ve # 3 en iyi atış tavsiye. Ayrıca, sütun sayısına bakılmaksızın en iyi genel durumdur.

Kurallar var. İyi bir nedeniniz varsa kesinlikle kırılabilirler, ancak bunu yaptığınız her zaman amaçlı, cesur ve açıkça "tasarlandığı gibi" olmalıdır. Gürcistan ile eşleştirilen Helvetica Black, farklı oldukları için çalışıyor; Trebuchet, Verdana ızgaraları ile eşleştirildi, çünkü yeterince farklı değiller. Bir buçuk sütuna yayılan büyük, kare, kırmızı bir kutu işe yarayabilir; biraz kapalı gri bir olmayacak.


2

Seçenek 3 için oy kullanıyorum. Gri kutunun kenarları sütunu dikey olarak tanımlayan kenarlardır, bu nedenle bu satırlar ihlal edilemez (bir sebep olmadan). Oluklar her üç sütun için de aynı olmalıdır, bu nedenle metni gri kutunun içine yerleştirin. Seçenek 2'nin iç kısmı biraz fazla derin.

Basılı yapmaya alışkın olduğum şey bu, bu yüzden web'de de "doğru" görünüyor.


0

Bu web tasarımı için ise, çapraz tarayıcı tutarlılığı ile ilgileniyorsanız, yatay yönde herhangi bir dolgu kullanmamanızı şiddetle tavsiye ederim. Farklı tarayıcılar div'lara ve dolgulara sunumun kırılabileceği kadar farklı davranır.

Hangi yöne giderseniz gidin, kenar boşluğunu sadece yatay olarak kullanın. Tam olarak istediğiniz düzeni elde etmek için bir veya iki sınıf eklemeyi gerektirir (örneğin, div için bir kenar boşluk kümesi ve paragraf için başka bir kenarlık kümesi), ancak uzun vadede daha güvenilirdir. Dikey dolgu genellikle bir sorun oluşturmaz.


Geçerli IE sürümü ne olursa olsun hala bu marjı iki katına çıkarıyor mu? Merhamet, bu can sıkıcı.
Lauren-Clear-Monica-Ipsum

1
Dolgu / kenar boşluklarını her yöne doğru yapabilirsiniz. Yapmanız gereken tek şey kutu modellerinize (hem ebeveyn hem de çocuk) dikkat etmektir.
Dawson

Sen edebilirsiniz dolgu kullanabilirsiniz, ancak daha sonra bunun için hesaba kaskad aşağı tüm yol var. Kaskadın en aşağısına kadar öğe üzerinde kenar boşluğu kullanmak çok daha kolay ve güvenilirdir.Her tarayıcıda tutarlı olarak çalışır. Tabii ki sadece kişisel görüş.
Benny Andajetz
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.