YouTip

# HTML <area> `download` Attribute The `download` attribute of the `` tag is used to indicate that the target resource of a clickable hotspot within an image map should be downloaded by the user rather than navigated to in the browser. --- ## Introduction When a user clicks on an `` element with a `download` attribute, the browser prompts them to save the linked resource locally. This attribute is highly useful for creating interactive image maps (such as diagrams, floor plans, or infographics) where clicking different regions triggers the download of specific files (e.g., PDFs, high-resolution images, or text documents). --- ## Syntax ```html ``` ### Attribute Values | Value | Description | | :--- | :--- | | *filename* | Optional. Specifies the default filename for the downloaded file. The browser will automatically detect and append the correct file extension (e.g., `.jpg`, `.pdf`, `.txt`). If the value is omitted, the browser will use the original filename of the resource. | > **Note:** The `download` attribute is only functional when the `href` attribute is present on the `` tag. --- ## Code Example Below is an example of an image map where different regions of an image represent different planets. Clicking on a planet downloads its corresponding information sheet or image. ```html ``` --- ## Key Considerations & Browser Behavior ### 1. Same-Origin Policy For security reasons, the `download` attribute generally only works for **same-origin URLs** (where the file is hosted on the same domain, protocol, and port as the website). If the `href` points to a different origin, the browser will open the file in a new tab or window instead of downloading it. ### 2. Browser Support * **HTML5 Standard:** The `download` attribute is a feature introduced in HTML5. It was not supported in HTML 4.01. * **Modern Browsers:** It is fully supported by all modern evergreen browsers (Google Chrome, Mozilla Firefox, Microsoft Edge, and Apple Safari). Legacy browsers like Internet Explorer do not support this attribute. ### 3. File Extensions You do not need to specify the file extension in the `download` value. For example, setting `download="venus"` for a `.txt` file will result in the file being saved as `venus.txt`. The browser automatically determines the correct extension based on the MIME type of the source file.