Schermata di un client di posta con firma email con logo aziendale e contatti
Guide Web Social schedule 11 min di lettura

Come creare una firma email con logo

L
Lucas

Per una firma email con logo che si veda ovunque, esporta il logo in PNG (o in JPG se non ha trasparenze), con una larghezza di visualizzazione tra 100 e 200 px e un peso intorno ai 30 KB. Poi caricalo su un server, richiamalo nella firma con un URL assoluto in HTTPS, incolla la firma nelle impostazioni del tuo client e verificala con un’email di prova inviata a te stesso. Il resto si gioca sui dettagli: un logo copiato da Word che parte come allegato, uno sfondo trasparente che sparisce in modalità scura, un file nitido sul monitor ma sfocato sul telefono. Qui trovi come evitare questi problemi uno per uno.

In breve

  • Esporta il file al doppio della larghezza visualizzata: un logo mostrato a 150 px richiede un file da 300 px.
  • Niente SVG: molti client non lo mostrano e alcuni lo bloccano per sicurezza.
  • L’intera firma dovrebbe restare sotto i 150 KB.
  • Nome e contatti vanno in testo HTML reale, mai dentro un’unica immagine.
  • Prova la firma su Gmail, Outlook e smartphone, sia in tema chiaro sia scuro.

Dans le même guide : Usare la webmail ogni giorno

Preparare il logo prima di creare la firma email

Parti dal file sorgente del logo dell’azienda (il vettoriale fornito dal grafico), non da uno screenshot del sito o dal PDF di una brochure. Da lì ricavi una sola versione per l’email e la usi sempre: è il modo più semplice per garantire la coerenza del marchio, soprattutto se in azienda la firma la usano più persone.

Formato del file: PNG, JPG o SVG?

Il PNG è la scelta giusta per quasi tutti i loghi: gestisce bene testo, colori pieni e contorni netti, e supporta la trasparenza. Se il logo ha pochi colori, il PNG-8 produce un file molto più leggero, ma sfumature e bordi smussati si degradano. Il JPG va bene per loghi con sfumature complesse su sfondo pieno, perché non gestisce la trasparenza.

L’SVG sembrerebbe ideale, visto che resta nitido a qualsiasi risoluzione e pesa pochissimo. In pratica la maggior parte dei client non lo visualizza e alcuni lo bloccano per motivi di sicurezza: convertilo in PNG. Evita anche le GIF animate, che pesano molto e distraggono dal messaggio.

Verifica: apri le proprietà del file e controlla l’estensione e il peso prima di andare avanti.

Dimensioni, peso e risoluzione consigliati

ParametroValore consigliato
Larghezza visualizzata del logo100-200 px
Larghezza del file esportatoil doppio (200-400 px)
Peso del logocirca 30 KB o meno
Peso totale della firmamassimo 150 KB
Larghezza totale della firmacirca 320 px (massimo 600)

Gli schermi recenti, i cosiddetti retina, usano due o più pixel fisici per ogni pixel logico: un file esportato alle dimensioni esatte di visualizzazione appare sfocato. Per un logo mostrato a 180 × 48 px prepara quindi un file da 360 × 96 px, poi fissa larghezza e altezza con gli attributi width e height del codice HTML. Outlook ignora spesso le dimensioni dichiarate solo nel CSS e mostrerebbe il logo a 360 px. Un passaggio di compressione senza perdita basta in genere a dimezzare il peso di un PNG.

Verifica: apri il file sul telefono e controlla che sia nitido e che pesi davvero quanto previsto.

Logo incorporato, allegato o ospitato online: quale scegliere

Ci sono tre modi per far arrivare il logo al destinatario, e solo uno funziona in modo affidabile.

MetodoCome funzionaRischio principale
Incorporatoil file viaggia dentro il messaggiocompare come allegato
Allegatoil file è un vero allegatograffetta, logo fuori posto
Ospitatoil file sta su un server e viene richiamato con un URLbloccato finché il destinatario non attiva le immagini

La strada consigliata è usare immagini ospitate su un server: per esempio una cartella del tuo sito, raggiungibile con un indirizzo completo in HTTPS come https://www.tuosito.it/firma/logo.png. È questo l’URL assoluto dell’immagine.

Il logo che arriva come allegato è il problema più segnalato. Su Outlook per Mac è una limitazione nota: il programma tratta come allegati le immagini incorporate, anche quelle inline. Microsoft suggerisce di ospitare le immagini su un server HTTPS e di evitare due pratiche, cioè la codifica base64 e la firma copiata da un’email ricevuta, perché entrambe introducono metadati nascosti che Outlook interpreta come allegati. Su Outlook 2016 per Windows succede lo stesso quando incolli la firma da Word. Inserire il logo con il pulsante dedicato risolve il problema per chi legge con Outlook su PC, ma su smartphone e su altri client il logo risulta spesso ancora allegato. Con un’immagine ospitata il problema non si pone.

Verifica: invia un’email a un indirizzo Gmail e controlla che non compaia la graffetta.

Creare la firma con logo: generatore online o codice HTML

La via più rapida è un generatore di firme email: compili nome, ruolo e informazioni di contatto, carichi il logo, aggiungi le icone dei social media e copi il risultato. Le versioni gratuite di solito ti chiedono di indicare l’URL esterno della tua immagine, mentre l’hosting del logo è in genere riservato ai piani a pagamento.

La seconda via è scrivere una firma email in HTML basata su tabelle: una cella a sinistra per il logo, una a destra per il testo. Le tabelle sono più affidabili del CSS moderno, che molti client interpretano male. Usa stili inline e font sicuri per il web come Arial, Verdana o Tahoma. Evita ombre e angoli arrotondati, che Outlook classico desktop non visualizza, e limita il testo a 4-6 righe. Ricorda infine che la firma email non ha nulla a che vedere con la firma elettronica o con la PEC.

Verifica: apri il file HTML nel browser, seleziona tutto e copialo.

Inserire la firma con logo nel tuo client di posta

Gmail

  • Clicca sull’ingranaggio in alto a destra, poi su Vedi tutte le impostazioni.
  • Nella scheda Generali, alla sezione Firma, scegli Crea nuova firma e assegnale un nome.
  • Incolla la firma copiata dal browser o dal generatore.
  • In Firma predefinita, selezionala per le nuove email e per le risposte o gli inoltri.
  • Scorri in fondo e clicca su Salva modifiche.

Se aggiungi il logo con l’icona immagine dell’editor, scegli l’opzione URL web e incolla l’indirizzo assoluto del file: eviterai il caricamento come immagine incorporata.

Verifica: scrivi a te stesso e apri il messaggio anche dall’app Gmail.

Outlook e Apple Mail

In Outlook classico desktop vai su File, Opzioni, Posta, poi clicca su Firme e su Nuovo. Incolla il testo e inserisci il logo con il pulsante Inserisci immagine: non incollarlo da Word. Nel nuovo Outlook e su Outlook sul web, la firma si gestisce da Impostazioni, Account, Firme. Se la tua azienda usa Microsoft 365 o Google Workspace, chiedi all’amministratore: la firma email aziendale si può distribuire a tutti da un modello unico.

Su Apple Mail per Mac apri Mail, Impostazioni, Firme, clicca su + e incolla la firma, poi togli la spunta all’opzione che impone il font predefinito dei messaggi, altrimenti la formattazione salta. Sull’iPhone il campo firma gestisce soprattutto testo semplice, quindi il logo resta poco affidabile. Per l’account sul telefono puoi seguire la guida su come configurare la posta su iPhone e Android.

Verifica: invia un messaggio a un indirizzo esterno e aprilo da due dispositivi.

Il logo non si vede? Cause frequenti e soluzioni

Se il destinatario vede un riquadro vuoto, molto probabilmente il suo client blocca le immagini remote finché lui non le autorizza. Controlla che l’URL sia assoluto e che si apra in una finestra anonima del browser.

La modalità scura pone un problema diverso. Gmail per iOS e Android inverte i colori anche nel corpo del messaggio, mentre Mail per iPhone rende scuri gli sfondi trasparenti: un logo nero su PNG trasparente diventa un buco nero e scompare. La soluzione più robusta è inserire il logo su un riquadro bianco con un margine attorno: in teoria è meno elegante, ma funziona ovunque. Esistono codici che alternano due versioni del logo in base al tema, ma i test ne mostrano l’inefficacia sulla maggior parte dei client.

Su Outlook classico, infine, logo enorme o layout sfasato dipendono quasi sempre da dimensioni dichiarate solo in CSS. Per gli altri malfunzionamenti consulta la guida per risolvere i problemi della posta elettronica.

Verifica: attiva il tema scuro sul telefono e riapri la tua email di prova.

Posizione, link e testo alternativo: le regole di design del logo

Metti il logo a sinistra del testo in un layout orizzontale, oppure sopra il nome in uno verticale, senza mai farlo prevalere sui contatti. Rendilo cliccabile verso il tuo sito e aggiungi all’indirizzo i parametri UTM (per esempio utm_source=firma): in Google Analytics vedrai quanti clic arrivano dalla firma. Se il tracciamento va oltre i clic sul sito, valuta gli obblighi del GDPR. Uno studio di Sigstr ed EyeQuant basato sull’eye tracking indica che una firma con il marchio attira più attenzione di una anonima solo a certe condizioni, e che un banner con call to action concentra molto lo sguardo: usalo con parsimonia.

Il testo alternativo è ciò che compare al posto del logo quando le immagini sono bloccate, ed è ciò che legge lo screen reader di chi non vede. Senza testo alternativo, lo screen reader pronuncia il nome del file, per esempio “logo_def_2.png”. Se il logo è un link, descrivi la destinazione e non l’aspetto: “Studio Rossi, vai al sito” funziona meglio di “logo blu”. Evita di iniziare con “Immagine di”, perché lo screen reader annuncia già che si tratta di un’immagine, e scrivi comunque il nome dell’azienda anche in testo, così resta leggibile in ogni caso.

Verifica: disattiva le immagini nel client e controlla che la firma resti comprensibile.

FAQ

Come si inserisce il logo nella firma email di Gmail?

Vai su Impostazioni, Vedi tutte le impostazioni, sezione Firma, e crea una nuova firma. Incolla la firma HTML già pronta oppure usa l’icona immagine dell’editor e scegli URL web, inserendo l’indirizzo assoluto del logo ospitato online. Assegna la firma alle nuove email e alle risposte, salva e invia un messaggio di prova a te stesso.

Che dimensioni deve avere il logo nella firma email?

Il logo dovrebbe essere visualizzato con una larghezza tra 100 e 200 px, ma il file va esportato al doppio per restare nitido sugli schermi retina. Punta a un peso intorno ai 30 KB e a una firma complessiva sotto i 150 KB. Dichiara larghezza e altezza con gli attributi HTML, non solo nel CSS, perché Outlook ignora spesso le dimensioni CSS.

Perché il logo della firma email arriva come allegato?

Succede quando l’immagine è incorporata nel messaggio, per esempio se hai incollato la firma da Word, l’hai copiata da un’email ricevuta o il logo è codificato in base64. Outlook, soprattutto su Mac, tratta queste immagini come allegati. La soluzione è ospitare il logo su un server HTTPS e richiamarlo con un URL assoluto.

Si può creare una firma email con logo gratis?

Sì. I generatori online offrono versioni gratuite e puoi anche scrivere da te una firma HTML a tabelle. Il limite principale riguarda l’hosting: le versioni gratuite di solito ti chiedono di indicare l’URL del tuo logo. Se hai un sito, carica il file in una cartella dedicata, copia l’indirizzo e crea la tua prima firma di prova.

L

Lucas

Un informatico di 29 anni, appassionato di tecnologia e programmazione. Mi piace risolvere problemi e imparare sempre cose nuove nell'ambito informatico.

Torna in alto