HTML5 ‘Download’ Attribute’u

Bildiğiniz üzere web sitesi içerisinde download linki oluşturmak oldukça basit bir işlem. Download ettireceğimiz dosyanın adresini <a> tag’i içerisine verdiğimizde bu işi halletmiş oluyoruz. Bazı modern browser’larda PDF, imaj veya text gibi dosyalara link verdiğimizde yeni tab’da açılmaları da ayrı bir problem olabiliyor. İşte bu noktada HTML5’in ‘download’ attribute’u devreye sokmanın zamanı gelmiş demektir.

Download Attribute’u Nasıl Kullanırız ?

Download attribute’u ile bir taşla iki kuş vurabiliyoruz:

  • İlki yukarıda bahsettiğim yeni tabda, browser içerisinde açmayıp download ettirmek.
  • Download ettirirken dosya ismini istediğiniz gibi verebilmeniz.

Örnek verecek olursam, PDF veya imaj dosyamız sunucu veya bizim tarafımızdan rastgele oluşturulmuş bir isimden oluşsun.

[code lang=”js”]
<a href="dosya/bn213nbv123e.pdf">Download PDF</a>
<a href="dosya/JHgbnmbmnGH.jpg">Download Image</a>
[/code]

HTML5’deki download attribute’u sayesinde yukarıdaki iki dosya browser’da açılacaktır. Download Attribute’unu sisteme eklediğimizde:

[code lang=”js”]
<a href="dosya/bn213nbv123e.pdf" download="HTML5 ile İlgili Bilmeniz Gereken Şeyler.pdf">Download PDF</a>
<a href="dosya/JHgbnmbmnGH.jpg" download="PS4.jpg">Download Image</a>
[/code]

Örnek dosyaları bilgisayarınıza indirmek için: TIKLAYINIZ