İçeriğe geç
Renk & Tipografi · UYGULAMALI REHBER

Web fontu yüklenmediğinde yerleşimi korumak

Inter için benzer genişlikte bir sistem sans serif yedeği planlayıp başlık ve paragraf yüksekliğini karşılaştırabilirsin.

Web fontu yüklenmediğinde yerleşimi korumak konusunu anlatan özgün BiDoping illüstrasyonu
BiDoping için hazırlanan editoryal illüstrasyon.

Font seçimini göreve bağla

Inter için benzer genişlikte bir sistem sans serif yedeği planlayıp başlık ve paragraf yüksekliğini karşılaştırabilirsin. Buradaki eşleştirme hazır bir marka reçetesi değil, üzerinde deneme yapabileceğin iki farklı rol önerisidir. Aynı yazı karakteri kısa bir kapakta güçlü görünürken uzun açıklamada yorucu olabilir; kararı gerçek metinle vermek gerekir.

Blog, hizmet sayfası ve form ağırlıklı web arayüzleri için önce hangi bilginin ilk okunacağını yaz. Başlık, açıklama, fiyat, etiket ve eylem çağrısı aynı tipografik görev değildir. Hangi fontun hangi görevi üstleneceğini belirlemek, sadece iki güzel aileyi yan yana getirmekten daha yararlıdır.

Örnek metin ve ağırlık düzeni

Asıl font gelmeden önceki görünümde düğme, başlık ve menü taşmasını test et. Deneme dosyasında yalnızca kısa bir başlık değil, uzun bir ürün adı, iki satırlık açıklama ve rakam içeren bir bilgi de bulunsun. Böylece karakterlerin farklı içerik türlerindeki davranışını aynı anda değerlendirebilirsin.

Inter / sistem sans serif önerisini incelerken aile adının yanında seçtiğin ağırlıkları ve gerçek dosya sürümünü not et. Önce iki ya da üç ağırlıkla başla. Fazladan bir font veya ağırlık eklemeden önce mevcut düzenin boyut, boşluk ve kontrastla yeterli ayrımı sağlayıp sağlamadığını kontrol et.

Türkçe, lisans ve teknik kontrol

Yedek fontun daha geniş harfleri yüzünden oluşan satır kaymasını yalnızca ekran görüntüsündeki ideal durumla değerlendirme. Türkçe metinlerde büyük İ ile küçük ı, ş ve ğ gibi karakterleri hem başlıkta hem paragrafta gör. Kullanılan font dosyasındaki karakter kapsamı, italik davranışı ve rakam biçimleri teslim öncesi kontrol edilmelidir.

Son kararı gerçek ekranda ver

Sayfa örneğinde en uzun menü bağlantısını, iki satırlık başlığı ve dar bir düğmeyi kontrol et. Asıl font devreye girmediğinde yedek aile daha genişse menü taşabilir; sadece paragrafın görünmesi yeterli değildir. Yerleşimde sabit yükseklik yerine metne alan bırakan sınırlar kullan. Font değişiminden sonra başlık aşağı kayıyorsa ilk ekranın düzenini yeniden değerlendir; yükleme öncesi görünüm de kullanıcının deneyiminin parçasıdır.