Tipografide Boyut Kavramı

Boyut kavramı, tipografiye 16. yüzyılda girer. Avrupalı tipograflar, bu yüzyılda bakarlar tek boyutla olmuyor, bir dizi yazı boyutu üretirler. Bu boyutlar hepimizin tanışık olduğu boyutlardır: 6′dan 72′ye… Yaklaşık 400 yıldır bu dizilim değişmez, bir iki ekleme çıkarmayla günümüze kadar gelir, bilgisayarlarımıza girer.




Peki boyutları önemli yapan ne? Bu temel boyutlar kullanılmazsa ne olur?
Eğer doğru kullanılırsa, bu yazı boyutları, gözünüzü diğerlerinden çok daha az yoracaktır. Bu kesin ifadeyi, 400 yıllık maziye güven olarak yorumlayabilirsiniz.
Enteresan bir noktaya gelelim. Bu boyutların 16. yüzyıla uzanan bir mazisi olduğunu daha önce söyledik. Bugünkü kullanımlarından bir farkları vardı. O zamanlar nokta cinsinden değer vermek yerine, bu boyutları isimlerle ifade ediyorlardı:

• 6pt: nonpareil
• 7pt: minion
• 8pt: brevier veya küçük metin
• 9pt: bourgeois veya galliard
• 10pt: long primer veya garamond
• 11pt: küçük pika veya philosophy
• 12pt: pika
• 14pt: english veya augustin
• 18pt: great primer
• 21pt: çift küçük pica veya çift pika
• 24pt: çift pika veya çift çizgi pika
• 36pt: çift great primer veya 2 çizgi great primer

Yeni bilgisayar yazılımları sayesinde, bu boyutlarda kalmak zorunda değiliz. İstediğimiz boyutta harflerle yazabiliyoruz. Peki bu kötü bir şey mi?
Cevabımız “Duruma göre değişir.” olacak. Tasarım gücünüze güvenerek, yaptığınız işe uygun bir boyut kullandığınızı düşünüyorsanız ve çalışmanızı görenler de kullandığınız boyuttan rahatsız olmuyorsa, iyi iş başarmışsınız demektir. Kuralları pek de önemsemeyin!
Çalışmanızı görenler yazı tipini beğenmiyorlarsa… Yukarıdaki paragrafta söylediklerimizi boşverip kurallara uyun siz en iyisi  .

Boyutu uygulamak

Web’e dönelim isterseniz. Yukarıda açıklamaya çalıştığımız boyut kavramını web sitelerimize nasıl uyarlayabiliriz?
Öncelikle kodlamalarımızda CSS kullanalım. Bunun bize bir yığın faydası olacak:Kodlamamızın temiz ve düzenli olmasını sağlayacak, bir kaç satırla oynayarak tasarımımızın çehresini değiştirebileceğiz.
Boyut için pixel mi, point (nokta) mı kullanmalıyız? Bu tamamen kişisel tercihiniz olacaktır. Yalnız pixel kullanacaksanız, farklı platformlarda farklı sonuçlar alacağınızı unutmayın.
CSS kodlarken de tipografi geleneğine bağlı kalmak istiyorsanız, em’ler ve yüzdeler için temel teşkil edecek bir ölçü, mesela pixel cinsinden, bulmanız gerekiyor. Eğer relativeler (small, x-small vs.) kullanırsanız bu temel üzerinde kolaylıkla küçültme – büyütme yapabileceksiniz. Relativelerin CSS ile CSS2 arasında bazı farkları var tabii.
Sayfalarınızda kullanacağınız temel değerler için birer boyut değeri bulun.

1. 11px /16.5px – Body. Ana yazı boyutu.
2. 24px – Ana Heading değeri. Sayfa isimlerini göstermede kullanabiliriz.
3. 18px – Alt başlıklar için heading.
4. 16px – Menü başlıkları için kullanılabilecek heading.
5. 13px – Diğer heading içindeki yazılar için.

gibi… Bunları CSS kodlamaya başlamadan önce hazırlarsanız, kodlama aşamasında“Bi değer sallayalım işte!” diyerek tipografiyi önemsememenizi baştan engellemiş olursunuz.
CSS’i kodlarken bu değerleri şöyle yazacağız:

1. 11px /1.5em – Body. Ana yazı boyutu.
2. 218% – Ana Heading değeri. Sayfa isimlerini göstermede kullanabiliriz.
3. 164% – Alt başlıklar için heading.
4. 145% – Menü başlıkları için kullanılabilecek heading.
5. 118% – Diğer heading içindeki yazılar için.

body {font: 11px/1.5em “Lucida Grande”;}
h1, h2, h3, h4, h5, h6 {
font-family: helvetica, arial, verdana, sans-serif; font-weight: normal;
}
h1 {
font-size: 218%;
}
h2 {
font-size: 164%;
}
h3 {
font-size: 145%;
}
h4 {
font-size: 118%;
}

Headingler arasında bu tarz bir bağlantı kurarsanız, doğal bir görünüm sağlayabilirsiniz. Sonuç itibariyle tipografik olarak uyumlu bir çalışma hazırlamış olduk ve uygulamamız 5 dakikamızı bile almadı. Kısa sürmüş değil mi?

Boyut gerçekten önemli

Gerçekten! Eğer bu yazı dizisinden aklınızda tek bir cümle kalacaksa, bu olsun. Lütfen çalışmaya başlamadan önce durun ve beş dakika kullanacağınız yazı boyutlarını belirleyin. Planınızı hazırlayın ve sadece Photoshop’un boyut listesinden bir değer seçmekle yetinmeyin. Boyutların uyumlu olduğundan emin olun ve bütün çalışmalarınızda bu uyumu korumaya çalışın.