Bağlantı hedefleri

target ve rel öznitelikleriyle bağlantının nerede açılacağını kontrol edersin.

target özniteliği ne yapar?

target özniteliği, bağlantının nerede açılacağını belirler. Varsayılan değer _self'tir; bağlantı aynı sekmede açılır. Yeni bir sekmede açmak için target="_blank" yazılır.

Yeni sekme, dış sitelere çıkan bağlantılarda okuyucuyu sayfada tutmak için sık kullanılır. Ancak her bağlantıyı yeni sekmede açmak deneyimi bölüp sekmeleri çoğalttığı için ölçülü kullanmak gerekir.

rel=noopener neden önemli?

target="_blank" ile açılan yeni sekme, eski güvenlik açıkları yüzünden açılan sayfaya belli bir erişim verirdi. Bunu engellemek için rel="noopener" eklenir; bu, yeni sekmenin açan sayfaya erişimini keser.

Dış bağlantılarda target="_blank" ve rel="noopener" çoğu zaman birlikte yazılır. Modern tarayıcılar bu korumayı varsayılan uygulasalar da, açıkça yazmak eski tarayıcılarda da güvenliği korur.

Uygulama Dış bağlantıyı yeni sekmede güvenli aç.

İskelet içine dış bir bağlantı ekle: https://arsiv-kitaplik.example adresine gitsin, yeni sekmede açılsın ve rel="noopener" ile güvenli olsun. Çapa metni "Arşiv" olsun.

Örnek çözümü göster

<h1>Çamlık Kitaplığı</h1>
<p>Dış kaynaklar:</p>
<a href="https://arsiv-kitaplik.example" target="_blank" rel="noopener">Arşiv</a>

Hedef ve güvenlik birlikte

target bağlantının nerede açılacağını, rel ise açılan sayfayla ilişkiyi denetler. Yeni sekme açtığında rel="noopener" eklemek küçük ama önemli bir alışkanlıktır.

Dış bağlantılarda bu ikisini birlikte yazmak, okuyucuyu sayfanda tutarken güvenliği de korur. Bir sonraki derste bağlantıları e-posta ve telefonla nasıl kuracağını göreceksin.

Kendini test et

Bir bağlantının yeni sekmede açılması için target değeri ne olmalı?
- _blank
- _self
- _new
- _tab
Cevabı göster

_blank — Doğru. _blank, yeni sekmede açmanın standart değeridir.

Dış bağlantıyı güvenli biçimde tamamla.

<a href="https://arsiv-kitaplik.example" target="_blank" rel="____">Arşive git</a>

Cevabı göster

<a href="https://arsiv-kitaplik.example" target="_blank" rel="noopener">Arşive git</a>

target ve rel değerlerini eşleştir.

_self

Aynı sekmede aç
_blank

Yeni sekmede aç
noopener

Erişimi kes
target

Açılış yerini belirle

Sıradaki ders: E-posta ve telefon bağlantıları

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler