Çapa bağlantıları
<a> etiketi ve href özniteliğiyle başka sayfalara bağlantı vermeyi öğrenirsin.
Çapa etiketi ne işe yarar?
Bir sayfadan diğerine geçiş yapmayı sağlayan etiket <a>'dır. Çapa (anchor) adı da verilir. Bir <a> etiketi içine alınan metin tıklanabilir hale gelir ve tarayıcı bu metni bağlantı olarak çizer.
Bağlantının gideceği adresi href özniteliği belirler. Önceki derste gördüğümüz başlıklar ve paragraflar bilgi sunarken, <a> sayfayı etkileşimli yapar.
Çapa metni nasıl seçilir?
<a> etiketinin arasındaki metne çapa metni (anchor text) denir. Bu metin bağlantının ne hakkında olduğunu anlatmalıdır. 'Buraya tıkla' gibi belirsiz ifadeler yerine 'Menüyü gör' ya da 'Bilet al' gibi açık metinler tercih edilir.
Açık çapa metni hem okuyucuya hem de ekran okuyucuya yardımcı olur; arama motorları da bağlantının bağlamını bu metinden çıkarır.
Uygulama Bir kafe sayfası için çapa bağlantısı ekle.
Aşağıdaki iskelette <a> etiketiyle menü sayfasına giden bir bağlantı oluştur. Çapa metni "Menüyü gör" olsun.
Örnek çözümü göster
<p>Galata Kafesi'ne hoş geldiniz.</p>
<a href="menu.html">Menüyü gör</a>Bağlantılar sayfayı canlandırır
Bu derste <a> etiketinin bir metni bağlantıya dönüştürdüğünü gördün. href özniteliği hedefi, etiketin arasındaki metin ise bağlamı belirler. Açık çapa metni seçmek, bağlantının hem anlaşılır hem de ekran okuyucular için erişilebilir olmasını sağlar.
Önümüzdeki derslerde bu adreslerin farklı biçimlerini — tam, göreli ve sayfa içi — adım adım inceleyeceğiz.
Kendini test et
-
Bir bağlantının gideceği adresi hangi öznitelik belirler?
- href
- src
- link
- name
Cevabı göster
href — Doğru. href, bağlantının hedef adresini taşır.
-
Şehir rehberi bağlantısını tamamla.
<a href="____">İstanbul gezisi</a>Cevabı göster
<a href="https://sehir-rehberi.example/istanbul">İstanbul gezisi</a> -
Çapa bağlantısı parçalarını eşleştir.
- <a>
- Çapa etiketi
- href
- Hedef adres özniteliği
- çapa metni
- Tıklanabilir yazı
- bağlantı
- Sayfalar arası geçiş