TR

Font eşleştirme – başlık ve metin için font kombinasyonları

Bir font çifti seçin ve başlıkla metnin birlikte nasıl durduğunu hemen görün – isterseniz kendi metninizle. Her çift yalnızca önceden yüklü sistem fontlarını kullanır: indirilecek bir şey yok, Google’a veya başka bir sunucuya istek yok. Her çiftin yanında gerekçesi, ölçülen x yüksekliği ve işletim sistemine göre bulunabilirliği yer alır.

px
Başlık 1,8 kat büyük gösterilir.
Girdileriniz yalnızca bu tarayıcıda saklanır.

Önizleme

İyi bir başlığın sanatı

İyi tipografi fark edilmez. Gözü metin boyunca sakince gezdirir, net bir hiyerarşi kurar ve içeriğin konuşmasına izin verir – telefonda da büyük bir monitörde de.

Metniniz bu tarayıcı penceresinde kalır – kaydedilmez, gönderilmez ve adres çubuğuna eklenmez.

Kopyalanacak CSS

h1, h2, h3 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  line-height: 1.2;
}
body {
  font-family: Verdana, Tahoma, "Segoe UI", sans-serif;
  font-size: 18px;
  line-height: 1.6;
}

Tüm font çiftleri

Sonuç

Font çifti
Georgia + Verdana
Neden uyumlu
Klasik serifli/serifsiz karşıtlığı: başlıklarda Georgia, metinde Verdana. İkisini de ekran için Matthew Carter tasarladı; bu yüzden oranları ve ritimleri uyumludur. Verdana’nın x yüksekliği çok büyüktür ve geniş yayılır – metni yaklaşık 1 px küçük ayarlayın.
x yüksekliği (ölçülen)
Georgia: 0,481 em · Verdana: 0,545 em – metin aynı font boyutunda yaklaşık %13 daha büyük görünür
İşletim sistemine göre bulunabilirlik
SistemBaşlıkMetin
Windows 10/11GeorgiaVerdana
macOSGeorgiaVerdana
iPhone/iPadGeorgiaVerdana
AndroidNoto Serif (yedek)Roboto (yedek)

Nasıl hesaplanır?

Fontlar nasıl eşleştirilir?

İki font, belirgin şekilde farklı ama benzer yapıda olduklarında birlikte iyi çalışır. En güvenli yol serifli bir fontla serifsiz bir fontu karşıtlaştırmaktır: biri başlıkları, diğeri metni taşır. Buna karşılık birbirine benzeyen iki serifli ya da iki serifsiz font kolayca hata gibi görünür.

Aynı derecede önemli olan x yüksekliğidir – küçük harflerin font boyutuna göre yüksekliği. x yüksekliği büyük fontlar (Verdana: 0,545 em) aynı boyutta, küçük olanlardan (Calibri: 0,464 em) belirgin şekilde büyük görünür. Bir çiftin x yükseklikleri çok farklıysa bunu font boyutuyla dengeleyin. Gösterilen değerler Windows 11 font dosyalarının OS/2 tablosundan alınmıştır.

Neden yalnızca sistem fontları?

Sistem fontları cihazda zaten yüklüdür: sayfalar daha hızlı açılır, metin yüklenirken kaymaz ve üçüncü taraf bir sunucuya hiçbir istek gitmez. Web fontlarını doğrudan bir font CDN’inden yüklemek, her ziyaretçinin IP adresini o sağlayıcıya gönderir – Avrupa’da GDPR açısından bir gizlilik sorunu. Özel web fontları istiyorsanız onları kendi sunucunuzda barındırın.

Font yığınları: neden birden fazla ad?

Hiçbir font her sistemde yüklü değildir. Bu yüzden CSS birkaç fontu art arda listeler (font stack): tarayıcı yüklü olan ilkini kullanır, serif veya sans-serif gibi genel bir aile de geri kalan her şeyi yakalar. Tablo, Windows, macOS, iPhone/iPad ve Android’de gerçekte hangi fontun görüneceğini gösterir – Microsoft ve Apple’ın font listelerine ve Android’in font yapılandırmasına göre (erişim: 27.09.2026). Android’de Georgia ve Verdana yoktur, yerlerine Noto Serif veya Roboto gösterilir; Linux dağıtımları kuruluma göre farklı fontlarla gelir.

Okunabilir metin için ipuçları

Sıkça sorulan sorular

Hangi fontlar birbiriyle uyumludur?

Serifli ve serifsiz font çiftleri güvenli bir seçimdir; örneğin Georgia ile Verdana, Palatino ile sistem arayüz fontu veya Cambria ile Calibri. Önemli olan net bir karşıtlık ve benzer x yükseklikleridir.

Bir web sitesi kaç font kullanmalı?

En fazla iki: biri başlıklar, biri metin için. Üçüncüsünü, örneğin kod için sabit genişlikli bir fontu, yalnızca kendine ait bir görevi varsa ekleyin.

Georgia ve Verdana her cihazda var mı?

Windows, macOS ve iOS’ta evet. Android’de yoktur ve yerine Noto Serif veya Roboto gösterilir – bu yüzden her font yığını serif veya sans-serif gibi genel bir aileyle bitmelidir.

x yüksekliği nedir?

Küçük x harfinin font boyutuna göre yüksekliğidir. Büyük bir x yüksekliği aynı boyutta metni daha okunaklı yapar, ancak biraz daha fazla satır aralığı ister.

Neden doğrudan bir CDN’den Google Fonts kullanılmıyor?

Bu durumda her sayfa görüntülemesi ziyaretçinin IP adresini font sağlayıcısına gönderir ve metin görünmeden önce ek bir indirme gerekir. Sistem fontları ikisini de önler; özel fontlar kendi sunucunuzda barındırılabilir.

Önizleme metnim kaydediliyor mu?

Hayır. Kendi başlık ve metinleriniz yalnızca bu tarayıcı penceresinde kalır. Yalnızca seçilen çift ve font boyutu hatırlanır.

Kaynaklar ve yasal dayanak

Güncelleme:

Benzer araçlar