() translation by (you can also view the original English article)
La creazione di un collegamento per scaricare file in HTML è lineare; si aggiunge un tag a e lo si indirizza mediante l'attributo href. Alcuni tipi di file, ad ogni modo, (quali immagini, .pdf, .txt e .doc ad esempio) non vengono scaricati. Essi, invece, vengono aperti nel browser.
Se avete un accesso lato-server al vostro sito internet, ci sono molte soluzioni che potete adottare per scaricare direttamente i file, come la configurazione dell'.htaccess. Se il vostro sito è ospitato in un servizio gratuito come wordpress.com, Blogspot, oppure Github pages che non vi forniscono tale possibilità d'accesso, prendete in considerazione l'adozione dell'attributo download.
Usare l'attributo "download"
L'attributo download fa parte delle specifiche HTML5 e identifica un collegamento di download piuttosto che di navigazione.
L'attributo download offre la possibilità di decidere il nome del file nel momento in cui si scarica. Quando il file risiede sul server, specialmente se è stato generato in modo automatico, il suo nome potrebbe contenere sistematicamente numeri e trattini, per esempio acme-doc-2.0.1.txt. Sarebbe meglio se gli utenti potessero ricevere un file con un nome più indicativo quando lo scaricano, ad esempio Acme Documentation (ver. 2.0.1).txt (senza dimenticare l'estensione).
Come sarebbe in pratica:
1 |
<a href="download/acme-doc-2.0.1.txt" download="Acme Documentation (ver. 2.0.1).txt">Download Text</a> |
Testate la pagina dimostrativa, dovreste trovare il file scaricato con il nome specificato nell'attributo download.
Un paio di note:
- Soltanto Firefox permette agli utenti di scaricare file dalla stessa origine a causa di un problema di sicurezza. Il file dovrebbe provenire dal vostro stesso server o nome di dominio, altrimenti verrà aperto nel browser.
- Mentre scaricare file con origini incrociate è permesso in Chrome e nell'ultimo Opera (con Chromium/Blink), entrambi ignoreranno il valore dell'attributo. In altre parole, il nome del file rimarrà inalterato.
Fornire un'altrenativa
Mentre scrivo, l'attributo download non è ancora stato implementato in Safari (e come potrete immaginare) Internet Explorer. Dicendo questo, secondo il modern IE status, al momento è in cima alla lista di sviluppo e sta ricevendo una gran quantità di voti.
Nel frattempo, possiamo aggiungere un rimedio alternativo, ad esempio fornire istruzioni aggiuntive sotto il collegamento per i browser non supportati. Per fare ciò, avremmo bisogno di scaricare Modernizr con il supporto al controllo di download.
Possiamo aggiungere il seguente script.
1 |
if ( ! Modernizr.adownload ) { |
2 |
var $link = $('a'); |
3 |
|
4 |
$link.each(function() { |
5 |
var $download = $(this).attr('download'); |
6 |
|
7 |
if (typeof $download !== typeof undefined && $download !== false) { |
8 |
var $el = $('<div>').addClass('download-instruction').text('Right-click and select "Download Linked File"'); |
9 |
$el.insertAfter($(this)); |
10 |
}
|
11 |
|
12 |
});
|
13 |
}
|
Lo script controllerà se il browser supporta l'attributo download; in caso contrario un nuovo <div> munito della classe per la gestione dello stile e un testo con le istruzioni, verrà inserito subito sotto il link accompagnato dall'attributo download.
Concludendo
L'attributo download rende molto comoda la gestione dei collegamenti di download a chiunque non abbia accesso alla configurazione lato server. Spero che Internet Explorer e Safari implementino l'attributo download presto!
