HTML trick, Mengunduh Gambar atau File Dengan Attribut download HTML

Mengunduh (download) adalah salah satu metode mengambil assets file dari server. terdapat banyak cara untuk membuat fitur atau metode download tersebut misalnya dengan bahasa PHP, Javascript dan lain-lain.

Tapi, tahukah kamu trik saat ini yaitu HTML5 juga bisa membuat fitur download juga lho karena HTML5 yang sekarang mempunyai attribut download. Penggunaan attribut download HTML ini sangat paling sederhana dan gampang. Mau tau cara nya? Simak berikut ini.

HTML trik, Mengunduh Gambar atau File Dengan Attribut download HTML

Pertama-tama, siapkan dulu gambar atau file yang ingin dibuat fitur download. saya akan mencobanya dengan gambar.

Lalu, jika sudah, sekarang kita akan menambahkan code berikut untuk membuat fungsi tombol download gambar nya. Sekarang, buat file dengan nama index.html atau jika sudah punya bisa langsung ketik code berikut.

<!DOCTYPE html>
<html>
<head>
     <title>Download Gambar Dengan Attribut download HTML5</title>
</head>
<body>
     <h1>Download Gambar Dengan Attribut download HTML5</h1>
     <p>klik pada gambar untuk mulai mendownload</p>

     <a href="gf.png" download>
        <img src="gf.png" alt="Google Fonts" width="254" height="142">
     </a>
</body>
</html>

Hasilnya output nya seperti ini.

Selamat, sekarang kalian sudah berhasil membuat cara download gambar dengan attribut download html5. Sekarang coba jalankan pada browser lalu jika ingin mengunduh gambar nya, klik pada gambar tersebut.