<link> etiketi ne için kullanılır?

<link> etiketi, mevcut belge ile diğer kaynaklar arasında bağlantılar kurmak için kullanılır.

Ana kullanım durumları:

• CSS stil sayfalarına bağlantı: En yaygın kullanım. Sayfayı stilize etmek için harici CSS dosyalarını bağlamaya olanak tanır.

  <link rel="stylesheet" href="/css/style.css">
  

• Yazı tiplerine bağlantı: Örneğin, Google Fonts.

  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
  

• İkonlar (Favicon) bağlantısı: Tarayıcı sekmesindeki varsayılan ikonu değiştirme.

  <link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png">
  

• Kanonik bağlantı gösterimi: Çoğaltıcı içerik durumunda arama motorlarının sayfanın ana sürümünü belirlemesine yardımcı olur.

  <link rel="canonical" href="https://example.com/page">
  

• Alternatif belge sürümleri gösterimi: Örneğin, farklı diller için.

  <link rel="alternate" hreflang="en" href="https://example.com/en/page">
  

• Kaynakların ön yüklenmesi (preload, prefetch, preconnect, prerender): Performansı artırmak için önceden yükleme veya bağlantı kurma.

  <link rel="preload" href="/fonts/roboto.woff2" as="font" type="font/woff2" crossorigin>
  <link rel="preconnect" href="https://api.example.com">
  <link rel="prefetch" href="/data/next-page.json">
  <link rel="prerender" href="https://example.com/next-page">
  

Anahtar öznitelikler rel (mevcut belge ile ilişki), href (kaynak URL), type (MIME türü) ve media (medya sorgusu) içerir.