Crea la tua firma in pochi minuti, senza bisogno di conoscenze di HTML
Abbiamo creato il sito web SignatureForEmail.com: uno strumento dedicato alla creazione di firme con modelli già pronti, facile integrazione con Gmail, Apple Mail e Outlook, e gestione del team per le aziende che necessitano di firme coerenti con il proprio marchio.
🌐 company.it
Su WordToHTML.net ci sono diversi modi per creare una firma e-mail in HTML:
- Crea la tua firma e-mail con il Generatore di firme e-mail su WordToHTML.net.
- Progetta la tua firma e-mail da zero inserendo manualmente tutto il testo nell’editor visivo.
- Crea una firma e-mail in HTML utilizzando i nostri modelli integrati.
- Puoi incollare nel nostro Editor HTML il codice HTML di una firma creata su qualsiasi altro sito web che offra la possibilità di creare firme, per poi modificarla (cambiare il testo, aggiungere una foto o un logo, ecc.).
- Utilizza il nostro AI Writer per generare un codice di firma HTML di esempio.
Come progettare manualmente una firma e-mail in HTML partendo da zero
Ti consigliamo di creare una firma utilizzando una tabella. Ad esempio, se desideri creare una firma con la tua foto sul lato sinistro e tutti gli altri dettagli di contatto sul lato destro, puoi iniziare creando una tabella con due colonne e una riga:
Quindi posiziona il cursore nella cella di sinistra di quella tabella e carica o incolla la tua foto. Ti consigliamo di caricare una foto di piccole dimensioni o di ridimensionarla al momento del caricamento:
Se la tua foto è di grandi dimensioni, il nostro sito ti mostrerà automaticamente una finestra di dialogo per ridimensionarla. Ti consigliamo di ridimensionare la foto in modo che abbia una larghezza o un’altezza compresa tra 100 e 200 pixel.
Di seguito puoi vedere il file immagine ridimensionato, che è un file di piccole dimensioni pari a 6,6 KiB (kilobyte), 154×154 pixel. A seconda delle dimensioni della foto inserita, dovrai ridimensionarla utilizzando il cursore sul lato sinistro fino a quando non vedrai visivamente una foto di piccole dimensioni che desideri visualizzare nella tua firma. Quindi fai clic sul pulsante blu “Inserisci immagine ridimensionata”.
Dopodiché, vedrai la tua foto nella cella sinistra della tabella:
Se nell’Editor visivo viene visualizzata una foto di grandi dimensioni, è sufficiente cliccarci sopra e ridimensionarla a una dimensione ridotta, come mostrato nella schermata sopra (si consiglia una larghezza/altezza compresa tra 100 e 200 pixel).
Ti consigliamo di impostare la larghezza della tabella a 500px (-100px) posizionando il cursore in una cella qualsiasi della tabella e cliccando sull’icona “Stile tabella”:
Quindi inserisci una larghezza della tabella, ad esempio 500px, e clicca su OK:
Puoi centrare la foto cliccandoci sopra, selezionando “Visualizza per interrompere il testo” e poi cliccando sull’icona di centraggio. Inoltre, puoi ridurre le dimensioni della cella della tabella contenente la foto trascinando una linea orizzontale al centro verso il lato sinistro, come mostrato nella schermata qui sotto.
In alternativa, se desideri arrotondare i bordi della foto, puoi utilizzare il nostro Editor di immagini. Clicca sulla foto e poi sull’icona “Immagine”:
Quindi vai alla sezione “Regola” e seleziona “Ritaglia a ellisse”, quindi clicca sul pulsante “Salva”:
A questo punto devi selezionare il formato PNG, altrimenti verrà aggiunto uno sfondo nero alla tua immagine, e clicca sul pulsante “Salva”:
A questo punto dovresti vedere una foto arrotondata nell’Editor visivo:
Inserisci quindi tutti i tuoi dati di contatto e personalizza lo stile a tuo piacimento nella cella a destra. Suggerimento: per impostazione predefinita, se premi il tasto Invio, l’Editor visivo creerà un nuovo paragrafo di testo con una spaziatura tra le righe; se invece tieni premuto il tasto Maiusc e premi Invio, verrà inserita una interruzione di riga che non aggiunge molto spazio tra le righe.
Puoi testare la tua firma inviandola al tuo client di posta elettronica o visualizzandone l’anteprima in una scheda del browser, ecc.
Se lo desideri, puoi aggiungere icone con link ai tuoi profili social o a qualsiasi sito tu voglia:
Una volta che sei soddisfatto della tua firma, puoi salvarla online su WordToHTML oppure copiarla negli appunti e incollarla nel tuo client di posta elettronica.
Ad esempio, in Gmail, vai su Impostazioni e individua la voce Firma nella sezione Generale, quindi crea una nuova firma o modifica quella esistente.
Incolla quindi il codice HTML da WordToHTML.net nel campo di testo della firma come mostrato di seguito, seleziona questa firma “per le nuove email” e fai clic sul pulsante “Salva modifiche” nella parte inferiore della pagina delle Impostazioni.
Se tutto è andato a buon fine, quando crei una nuova email in Gmail vedrai la tua firma come mostrato di seguito:
Come creare una firma e-mail in HTML da un modello integrato
Tutto quello che devi fare è cliccare su un’icona per selezionare il modello HTML dalla barra degli strumenti:
Quindi seleziona il modello di firma:
Una volta selezionato il modello, puoi modificare il contenuto nell’editor visivo:
Sostituisci l’immagine segnaposto con una tua in formato JPG o PNG. Ti sconsigliamo di incorporare immagini o di utilizzare il formato SVG, poiché alcuni client di posta elettronica non lo supportano.
Se desideri aggiungere altre icone alla tua firma (come i link ai social media), ti consigliamo di utilizzare le icone disponibili sul sito Icons, oppure puoi scaricare icone in formato PNG da Icon Finder e caricarle sul nostro sito web.
Una volta creata la firma, puoi copiarla e incollarla nella tua applicazione di posta elettronica:
Puoi utilizzare il nostro strumento AI Writer per generare un modello di firma, ma devi fornire istruzioni più specifiche all’IA per ottenere i risultati desiderati.
Ad esempio, un prompt per l’IA come questo:
Crea una firma HTML per un CEO utilizzando una tabella con il logo sul lato sinistro e le mie informazioni sul lato destro. Utilizza il CSS solo come stili inline.
Questo dovrebbe generare una firma HTML simile. Per impostare il tuo logo, clicca sul segnaposto dell’immagine e poi sull’icona “Sostituisci”. Quindi seleziona il logo già caricato oppure caricalo e selezionalo.
Si consiglia di disattivare la modalità “Pagina intera” per visualizzare e copiare solo il codice HTML principale:
Una volta aggiornata l’immagine del logo, la firma apparirà come mostrato di seguito. Aggiorna le informazioni della firma secondo necessità, quindi copiale negli appunti e incollale in qualsiasi client di posta elettronica desideri.
Domande frequenti sulle firme nelle e-mail in HTML
Qual è il formato immagine migliore per una firma e-mail?
JPG o PNG sono le scelte più sicure per le foto e i loghi delle firme e-mail. Il formato SVG non è consigliato perché molti client di posta elettronica (tra cui Outlook) non lo visualizzano in modo affidabile e può compromettere completamente il layout della firma. Il formato PNG è l’ideale quando è necessario uno sfondo trasparente, come nel caso di un logo senza un riquadro bianco attorno.
Quali devono essere le dimensioni di un’immagine per la firma e-mail?
Per una foto profilo o un primo piano, l’ideale è una larghezza o un’altezza compresa tra 100 e 200 pixel. Le immagini più grandi rallentano il caricamento dell’e-mail e possono apparire sovradimensionate nella casella di posta del destinatario. Mantieni anche le dimensioni del file ridotte: cerca di non superare i 10–15 KB per immagine, in modo che la firma si carichi rapidamente su tutti i dispositivi e i client di posta elettronica.
Quale dovrebbe essere la larghezza di una tabella per la firma di un’e-mail in HTML?
500px (con una tolleranza di circa 100px) è una larghezza standard sicura. Si adatta comodamente alla maggior parte dei riquadri di anteprima e dei pannelli di lettura dei client di posta elettronica senza costringere a scorrere orizzontalmente, lasciando comunque spazio sufficiente per una foto o un logo accanto ai dettagli di contatto.
Devo usare CSS inline per una firma e-mail in HTML?
Sì. I client di posta elettronica rimuovono o ignorano gli elementi `style` e i fogli di stile esterni, quindi tutti gli stili devono essere scritti come CSS inline direttamente su ciascun elemento HTML. Questo è anche il motivo per cui la creazione di firme con le tabelle (piuttosto che con i moderni metodi di layout CSS come flexbox o grid) rimane l’approccio più affidabile per garantire la compatibilità con le email.
Come si aggiunge una firma HTML a Gmail?
Copia il codice HTML della firma completata negli appunti, poi in Gmail vai su Impostazioni → Visualizza tutte le impostazioni → Generale → Firma, crea o modifica una firma e incollala nel campo della firma. Selezionala come firma predefinita per le nuove email (e per le risposte/gli inoltri, se lo desideri), quindi fai clic su Salva modifiche nella parte inferiore della pagina.
Posso creare una firma e-mail in HTML senza scrivere codice?
Sì. Non è necessario scrivere il codice HTML manualmente: puoi utilizzare un editor visivo “drag-and-drop”, partire da un modello di firma integrato oppure utilizzare uno strumento di scrittura basato sull’intelligenza artificiale (AI Writer) che genera il codice HTML per te a partire da una descrizione testuale (ad esempio, “crea una firma da amministratore delegato con il logo a sinistra e le informazioni di contatto a destra”). Tutti e tre i metodi producono codice HTML pronto all’uso che puoi copiare e incollare nel tuo client di posta elettronica.
Perché la mia foto appare troppo grande nell’editor della firma?
La maggior parte delle foto caricate proviene direttamente da un telefono o da una fotocamera con una risoluzione molto più alta di quella necessaria per una firma e-mail. Utilizza lo strumento integrato di ridimensionamento delle immagini per ridurne le dimensioni a circa 100–200 pixel prima di inserirla, anziché caricarla a grandezza naturale e rimpicciolirla visivamente: in questo modo la dimensione del file rimarrà ridotta e la firma si caricherà rapidamente.
Come faccio a creare una foto circolare (arrotondata) nella mia firma?
Utilizza il nostro editor di ritaglio immagini con lo strumento di ritaglio a ellisse/cerchio mentre carichi la tua foto.