One of the lesser-known, but highly useful, attributes in HTML is the “download” attribute. This attribute allows you to control the downloading of files directly from a web page. In this tutorial you will learn how to use this HTML download attribute which makes a link downloadable.
“download” Attribute of HTML Anchor <a> tag
The “download” attribute is typically used with the <a>
(anchor) element, which is commonly used for creating hyperlinks and this attribute makes the link downloadable. Here’s the basic syntax of the download
attribute:
<a href="file-path" download="new-file-name">Link Text</a>
href
: This attribute specifies the URL of the file you want to make available for download.download
: This attribute tells the browser to download the linked file instead of navigating to it.new-file-name
(optional): You can provide a new name for the downloaded file. If you omit this attribute, the browser will use the original file name.
Example of the “download” attribute:
You can use the download attribute to create download links for various file types such as PDFs, images, documents, audios, videos, and more. For example:
<a href="example.pdf" download="my-document.pdf">Download PDF</a>
<a href="image.jpg" download>Download Image</a>
<a href="song.mp3" download="Song Name.mp3">Download Mp3</a>
When you provide a custom name for the downloaded file using the download
attribute, you give users a better idea of what they are downloading. This can be particularly useful when the original file name is cryptic or lengthy.