Hai caricato un’immagine su Google Drive, hai copiato il link dal pulsante «Condividi» e l’hai incollato in <img src="...">. Il sito mostra l’icona di un’immagine rotta. Ti suona familiare?

Google Drive non serve le immagini direttamente tramite il link di condivisione. Quello che ottieni è una pagina HTML di Google con un’anteprima, non il file in sé. Il browser prova onestamente a interpretare quella pagina come immagine e fallisce. La soluzione c’è, ed è più semplice di quanto sembri: devi costruire un link diretto inserendo l’ID del file in un URL specifico. Nessun servizio di terze parti, solo Google Drive.

Vediamo tutto il processo passo dopo passo: dalla pubblicazione di un’immagine al tag funzionante sul tuo sito.

💡 Panoramica rapida:

• Apri l’accesso in condivisione all’immagine su Google Drive (pulsante «Condividi», livello di autorizzazione «Chiunque abbia il link»)
• Copia l’ID del file dal link di condivisione (la lunga stringa dopo d/ e prima di /view)
• Inserisci l’ID nel modello di link diretto https://drive.google.com/uc?export=view&id=YOUR_ID
• Incolla il link pronto nell’attributo src di un tag HTML img sul tuo sito

Perché usare Google Drive per l’hosting di immagini

Google Drive offre 15 GB di spazio gratuito per ogni account. Per un sito piccolo, un ambiente di test o una pagina su CodePen, è più che sufficiente.

A differenza di una CDN di terze parti, le immagini risiedono nel tuo account e hai il pieno controllo sull’accesso. Se chiudi la condivisione, l’immagine smette immediatamente di essere visualizzata su tutti i siti. Nessun server esterno, nessuna registrazione a servizi aggiuntivi.

La velocità di erogazione di Google è costantemente alta. I file sono distribuiti attraverso la stessa infrastruttura che serve YouTube e Google Foto. Per prototipi e progetti personali, è una solida CDN gratuita.

Passo 1: aprire l’accesso all’immagine

Carica un’immagine su Google Drive trascinando il file nella finestra del browser o cliccando su «Nuovo» → «Caricamento file».

Dopo il caricamento, clicca con il tasto destro sul file e seleziona «Condividi» → «Condividi». Nella finestra che si apre, cambia il livello di accesso da «Limitato» a «Chiunque abbia il link». Clicca su «Copia link».

Senza questo passaggio, l’URL diretto non funzionerà. Anche un link costruito correttamente per un file privato restituirà un errore 403. L’accesso deve essere pubblico.

Passo 2: estrarre l’ID del file

Il link di condivisione copiato ha un aspetto simile a questo:

1
https://drive.google.com/file/d/1NowYy86nUZVaCMYSXPVI4wiunm4NGU5w/view?usp=sharing

L’ID del file è la lunga stringa compresa tra d/ e /view. Nell’esempio sopra, è 1NowYy86nUZVaCMYSXPVI4wiunm4NGU5w. Selezionalo e copialo.

Ecco come appare l’ID nel link (evidenziato in rosso):

L’ID è univoco per ogni file in Google Drive. Non è una stringa casuale, ma un identificatore interno che Google usa per localizzare il tuo file sui suoi server. Non può essere modificato.

Passo 3: costruire il link diretto

Inserisci l’ID copiato nel modello:

1
https://drive.google.com/uc?export=view&id=YOUR_ID

Per il nostro esempio, il link finito sarà così:

1
https://drive.google.com/uc?export=view&id=1NowYy86nUZVaCMYSXPVI4wiunm4NGU5w

Il parametro export=view dice a Google di servire il file così com’è, senza l’involucro HTML. Non è una pagina di anteprima, ma un puro flusso di byte dell’immagine. Funziona per JPEG, PNG, WebP, GIF e SVG.

Testa il link: incollalo nella barra degli indirizzi del browser. Se si apre l’immagine stessa invece di una pagina di Google, il link è costruito correttamente.

Se ti serve un download diretto del file invece di un’immagine (per esempio, un PDF o un archivio), sostituisci view con download:

1
https://drive.google.com/uc?export=download&id=YOUR_ID

Il browser non aprirà il file, ma chiederà immediatamente di salvarlo su disco.

Passo 4: inserire l’immagine sul sito

Inserisci il link costruito nell’attributo src di un tag <img>:

1
<img
2
  src="https://drive.google.com/uc?export=view&id=1NowYy86nUZVaCMYSXPVI4wiunm4NGU5w"
3
  alt="Image description"
4
  width="800"
5
  height="600"
6
>

Non dimenticare l’attributo alt con una descrizione significativa: è importante sia per l’accessibilità che per la SEO.

Per WordPress nell’editor Gutenberg, seleziona il blocco «Immagine» → «Inserisci da URL» e incolla il link diretto. Per l’editor classico, pulsante «Aggiungi media» → «Inserisci da URL».

In modalità sfondo (CSS), il link funziona esattamente allo stesso modo:

1
.hero {
2
  background-image: url('https://drive.google.com/uc?export=view&id=YOUR_ID');
3
}

Esempio funzionante su CodePen

Su CodePen puoi testare il metodo senza pubblicare un sito. Crea un nuovo Pen, inserisci un tag <img> con il link diretto del passo precedente e l’immagine apparirà nel pannello di anteprima.

Funziona con qualsiasi immagine pubblica di Google Drive. Se modifichi l’immagine originale su Drive (stesso ID, nuovo file), la versione aggiornata viene automaticamente riportata sul sito.

Limiti del metodo

I link diretti di Google Drive hanno un tetto di traffico. Google non pubblica cifre esatte, ma nella pratica, con diverse migliaia di visualizzazioni al giorno, un’immagine potrebbe smettere di caricarsi. Per un sito di produzione ad alto traffico questa non è una soluzione: usa una CDN specializzata (Cloudinary, Bunny CDN) o un object storage (Amazon S3).

L’immagine deve essere pubblica. L’accesso «Solo invito» o «Utenti specifici» non attiverà l’URL diretto.

Il formato del link potrebbe cambiare. Google non garantisce la stabilità dell’endpoint uc?export=view come API pubblica. In oltre 10 anni di utilizzo non si è mai rotto, ma formalmente il metodo non è documentato per uso esterno. Per progetti a lungo termine, è più affidabile configurare un proprio storage.

Ciononostante, per un prototipo, una landing page del weekend, una pagina portfolio o un esempio su Codepen, questo metodo è pienamente giustificato. Veloce, gratuito e senza registrazione a servizi di terze parti.

⁉️🤔 Domande frequenti

L’immagine non si carica, anche se il link è costruito correttamente. Cosa c’è che non va?

Verifica il livello di accesso del file su Google Drive. Anche un link uc?export=view&id=... costruito correttamente non restituirà nulla o darà errore 403 se il file non è pubblicato pubblicamente. Apri le impostazioni di condivisione e assicurati che sia selezionato «Chiunque abbia il link» e non «Accesso limitato». Il secondo caso comune è che il file sia stato eliminato da Drive o spostato nel cestino. L’ID rimane lo stesso, ma non c’è nulla da servire.

Posso inserire immagini SVG con questo stesso metodo?

Sì, SVG funziona esattamente allo stesso modo. Google Drive serve correttamente i file vettoriali tramite export=view e il browser li visualizza in <img> senza problemi. Tuttavia, ricorda la sicurezza: gli SVG possono contenere script, quindi non inserire file SVG di terze parti sul tuo sito senza verifica. Per le tue icone e illustrazioni, il metodo è pienamente applicabile.

Quante immagini possono essere servite da un singolo account Google?

Non c’è un limite rigido sul numero di file, tutto dipende dal volume di storage (15 GB gratuiti) e dal tetto di traffico non ufficiale. Nella pratica, 50-100 immagini su un sito portfolio personale funzionano senza problemi per anni. Per un sito commerciale con traffico intenso, meglio noleggiare una CDN.

Qual è la differenza tra export=view e export=download?

export=view serve il file come contenuto da visualizzare nel browser: un’immagine si apre in una scheda, un video parte. export=download forza il download: il browser non mostra il file ma lo salva su disco. Per <img src=""> usa view. Per un link «Scarica PDF» su un pulsante, usa download.

Posso generare anteprime di dimensioni diverse?

Sì, aggiungi il parametro sz=wNUMBER al link. Per esempio, &sz=w320 limiterà la larghezza dell’immagine a 320 pixel. Google ridimensionerà l’immagine al volo e tu risparmierai traffico per la versione mobile del sito. Modello completo: https://drive.google.com/uc?export=view&id=YOUR_ID&sz=w320.

Vale la pena usare Google Drive come CDN per le immagini

Per un blog personale, un progetto amatoriale o un prototipo veloce, sì, è un’opzione funzionante e giustificata. Costo zero, pieno controllo degli accessi e sforzo minimo.

Per un sito con traffico di un paio di migliaia di persone al giorno, guarda Cloudinary con il suo tier gratuito (25 GB di traffico al mese) o Bunny CDN con fatturazione al secondo. Costano pochi centesimi e le immagini si caricano in modo stabile sotto qualsiasi carico.

Tieni il metodo di Google Drive nei segnalibri come opzione di emergenza. Quando devi condividere velocemente uno screenshot su un forum, mostrare un layout a un cliente o far vivere un’immagine su Codepen, questo è il percorso più breve dal caricamento del file al link funzionante. Nessuna registrazione, nessun SMS, nessuna quota.