HTML5 Download Attribute

A handy anchor tag attribute that can force the user agent to download a file it would normally attempt to display.

This little known anchor tag attribute can be used in a couple of ways, here's one example:

<a href="very-large-image.jpg" download>Download wallpaper</a>

So when a user clicks on this link, rather than the user agent displaying the image as it downloads and then the user having to right-click and save, instead the file is just downloaded immediately.

Here's another example:

<a href="37asd83jdhn857gssdnd.pdf" download="stock-status-report-2013.pdf">Download report</a>

In the above example the file is downloaded rather than displayed as per the first example but by passing in a value into the download attribute, that is used to override the randomly generated file name in the href attribute.

I believe a similar result can be achieved using the content-disposition header server-side but this seems like a quicker and simpler way to address the issue.

No surprises that other than Chrome and Firefox, browser support is currently lacking.

Tagged with:

You might also like… Speeding up the web