HTML Academy · Ders

Bağlantıları Yeni Sekmelerde Açma ve download Özniteliği

Bağlantı davranışını yönetmek için target ve download özniteliklerini kullanmayı öğrenin.

3. ders / 413 adım

Bağlantıları Yeni Sekmelerde Açma ve download Özniteliği, CoddyKit'te ücretsiz bir HTML Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, HTML Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. HTML Academy kursu toplamda 4 dersten oluşur.

Yeni Sekmede Açma

target özniteliği, bağlantısı verilen belgenin nerede açılacağını belirler:

<a href="https://example.com" target="_blank">Open in new tab</a>

<!-- target values:
  _blank  → new tab (or window)
  _self   → same tab (default)
  _parent → parent frame
  _top    → full window (exits frames)
-->

_blank Kullanımının Güvenlik Riski

Önlem alınmadan kullanılan target="_blank", bir güvenlik açığı oluşturur:

  • Yeni sayfa, window.opener üzerinden açan sayfaya erişebilir
  • Kötü amaçlı bir sayfa, özgün sekmeyi başka bir yere yönlendirebilir
  • Bu saldırıya ters sekme yönlendirmesi adı verilir

rel=noopener noreferrer

target="_blank" kullanırken her zaman rel="noopener noreferrer" ekleyin:

<a href="https://example.com"
   target="_blank"
   rel="noopener noreferrer">
  Open Safely
</a>
<!-- noopener: prevents access to window.opener -->
<!-- noreferrer: also hides referrer header + implies noopener -->
<!-- Modern browsers add noopener by default, but always include it -->

Yeni Sekmeler Ne Zaman Açılmalı?

target="_blank" için kullanıcı deneyimi kuralları:

  • Kullanıcıların uygulamanızdan ayrılmayı beklemediği dış sitelerde kullanın
  • Başvuru belgeleri (PDF'ler, kılavuzlar) için kullanın
  • Dahili sayfalar arasında gezinmek için kullanmayın
  • Kullanıcıları her zaman uyarın — "yeni sekmede açılır" ifadesini belirten bir simge veya başlık ekleyin

Kullanıcılara Yeni Sekmeyi Belirtme

Bağlantının yeni bir sekmede açılacağını kullanıcılara bildirin:

<a href="https://example.com"
   target="_blank"
   rel="noopener noreferrer"
   aria-label="Visit Example (opens in new tab)">
  Visit Example
  <span aria-hidden="true">↗</span>
</a>
<!-- aria-label covers screen reader announcement
     The arrow icon gives visual users a hint -->

download Özniteliği

download özniteliği, tarayıcıya bağlantısı verilen dosyada gezinmek yerine dosyayı indirmesini söyler:

<a href="/reports/q4-report.pdf" download>
  Download Q4 Report
</a>

<!-- Optionally specify the filename: -->
<a href="/api/export" download="my-data-2025.csv">
  Export CSV
</a>

download Özniteliğinin Kısıtlamaları

download özniteliğinin bazı kısıtlamaları vardır:

  • Yalnızca aynı kaynaklı URL'lerde çalışır
  • Kaynaklar arası indirmelerde sunucunun Content-Disposition: attachment göndermesi gerekir
  • download içindeki dosya adı yalnızca bir öneridir — sunucu üstbilgileri bu adı geçersiz kılabilir

Veri URI'leriyle İndirme

Oluşturulan içeriği veri URI'lerini kullanarak indirebilirsiniz:

<a href="data:text/plain;charset=utf-8,Hello%20World!"
   download="hello.txt">
  Download Text File
</a>
<!-- Generates a .txt file from inline data -->
<!-- Useful for generating small files client-side without a server -->

JavaScript ve Bağlantı Hedefleri

JavaScript gezinmeyi yönetirken target="_blank" kullanımını kötüye kullanmaktan kaçının:

// If you must open a new window programmatically:
const win = window.open('https://example.com', '_blank', 'noopener,noreferrer');
// noopener via window.open requires the features string
// Not via rel on window.open

Ping Özniteliği

ping özniteliği, bağlantıya tıklandığında bir POST isteği gönderir (analiz için):

<a href="/destination" ping="/analytics/track">
  Track this click
</a>
<!-- Browser sends POST to /analytics/track when link is clicked -->
<!-- Rarely used — blocked by many browsers -->
<!-- Most analytics use JavaScript instead -->

Bağlantılardaki type Özniteliği

type özniteliği, bağlantısı verilen kaynağın MIME türüne ilişkin bir ipucu verir:

<a href="/report.pdf" type="application/pdf">
  Download PDF Report
</a>
<a href="/data.json" type="application/json">
  JSON Data
</a>
<!-- Informational hint only — browser does not enforce it -->

Hızlı Kontrol

target="_blank" ile birlikte hangi güvenlik özniteliği her zaman kullanılmalıdır?

Özet: target ve download

Bağlantı davranışı öznitelikleri:

  • target="_blank" — yeni sekmede açar
  • _blank ile birlikte her zaman rel="noopener noreferrer" ekleyin
  • Bağlantı yeni sekmede açıldığında kullanıcıları görsel olarak uyarın
  • download — gezinmek yerine dosya indirmeyi başlatır
  • download="filename" — indirme için bir dosya adı önerir
Başlamak ücretsiz

Yapay zeka eğitmeniyle HTML öğren — ücretsiz

Tarayıcında gerçek kod yaz ve çalıştır, 7/24 yapay zeka eğitmeninden anında yardım al; web'de ya da uygulamada kaldığın yerden devam et.

Kurslar
40
Dersler
159

Sıkça Sorulan Sorular

“Bağlantıları Yeni Sekmelerde Açma ve download Özniteliği” dersi ücretsiz mi?

Evet — “Bağlantıları Yeni Sekmelerde Açma ve download Özniteliği” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve HTML Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. HTML Academy kursu toplamda 4 dersten oluşur.

“Bağlantıları Yeni Sekmelerde Açma ve download Özniteliği” dersinde ne öğreneceğim?

Bağlantı davranışını yönetmek için target ve download özniteliklerini kullanmayı öğrenin. HTML Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

HTML Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te HTML Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.

“Bağlantıları Yeni Sekmelerde Açma ve download Özniteliği” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu HTML Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her HTML Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

  1. anchor Öğesi ve href Özniteliği
  2. Mutlak ve Göreli URL'ler
  3. Bağlantıları Yeni Sekmelerde Açma ve download Özniteliği
  4. Bölümlere Bağlantı ve Parça Tanımlayıcıları
← HTML Academy Sayfasına Dön