Passa al contenuto principale

Una guida alla creazione di email in HTML con le migliori pratiche

L'HTML può sembrare un aspetto intimidatorio dell'email marketing, ma non deve esserlo. Scopri come perfezionare le tue competenze HTML per migliorare le tue email di marketing.

HTML, o linguaggio di markup ipertestuale, è il codice utilizzato per creare la struttura di base di un sito web. Così come l'HTML ti consente di personalizzare completamente l'aspetto di un sito web, le email HTML ti danno un maggiore controllo sulla struttura delle tue email. Puoi cambiare l'aspetto dei caratteri, personalizzare il layout delle tue email e persino incorporare grafici e pulsanti con il giusto formato email HTML.

L'unico problema è che scrivere email in HTML non è così facile come sembra. Seguire i template di email HTML può aiutarti, ma devi comunque assicurarti che le tue email rispondano a risoluzioni diverse e funzionino con client di email diversi. Inoltre, non vuoi scoraggiare i lettori con tempi di caricamento folli. Se desideri modificare le tue email con HTML, ecco una guida rapida all'HTML per le email.

Ti starai chiedendo: come si crea un'email HTML? Leggere qualche guida sull'HTML di base può essere d'aiuto, ma scrivere email in HTML è un po' diverso dall'usare l'HTML per creare un sito web. La prima cosa che devi fare quando scrivi un'email HTML è impostare il DOCTYPE, che determina le regole HTML e CSS seguite durante la lettura dell'HTML. Tuttavia, alcuni client di email sovrascrivono il DOCTYPE e utilizzano le proprie regole per l'HTML.

Poi arriva la sezione <head>, dove inserisci il titolo e altre informazioni importanti sulla tua email. Come minimo, il tag head dovrebbe includere un tag <title> al suo interno, che dovrebbe essere chiuso con un tag </title>. Puoi anche utilizzare un meta tag per definire i metadati all'interno della sezione <head>. Una volta che hai finito con questa sezione, dovrebbe essere chiusa con </head>.

Tieni presente che alcuni tag ed elementi potrebbero non funzionare con alcuni provider di posta elettronica. Diversi provider di posta elettronica non consentono di utilizzare il tag <style> nella testa di un'email, mentre Gmail non consente il tag <style> nel corpo di un'email. È anche importante seguire una guida all'email marketing per le best practice, perché cambiare il layout di un'email non significa che il contenuto sia buono.

Potresti aver sentito parlare molto di email di testo normale e email HTML, ma qual è la differenza effettiva?

Le email di testo normale sono il tipo di email più semplice che puoi inviare perché includono solo testo normale. Queste email non contengono immagini, video o pulsanti. In effetti, tutto il testo di una email di testo normale appare in genere uguale, quindi non c'è una vera e propria personalizzazione con le email di testo normale. Il testo normale è essenzialmente quello su cui lavori all'interno di Notepad, mentre il codice HTML è più vicino a quello con cui lavori quando scrivi in Microsoft Word o in un rich text editor. Tuttavia, le email di testo normale hanno ancora il loro posto nel mondo moderno.

Le email HTML sono scritte utilizzando il codice del linguaggio di markup ipertestuale, che ti consente di implementare grafica, aggiungere pulsanti e incorporare video direttamente nelle tue email. Puoi anche usare i tag HTML per personalizzare l'aspetto del carattere, sia che tu voglia usare un carattere diverso o cambiare il colore o la dimensione del carattere che stai utilizzando. I tag heading, subscript e superscript consentono una personalizzazione ancora maggiore per quanto riguarda l'aspetto del testo in un'email HTML.

Sebbene molte persone non abbiano familiarità con le email HTML, gli editor WYSIWYG (what-you-see-is-what-you-get) utilizzati da molti client di posta elettronica offrono funzionalità simili. Proprio come puoi rendere il testo in grassetto, sottolineato o corsivo con Gmail, puoi usare l'HTML per personalizzare l'aspetto delle tue email. L'unico vero svantaggio di questi editor WYSIWYG è il fatto che le tue email potrebbero non apparire uguali su più dispositivi e client di posta elettronica. Detto questo, la maggior parte dei popolari editor WYSIWYG fa un ottimo lavoro se vuoi creare una campagna senza imparare a programmare.

Se vuoi essere sicuro di scrivere email HTML di alta qualità che siano leggibili su diversi dispositivi e client email, devi assicurarti di essere al passo con le best practice. Ecco alcune best practice per il formato email HTML che ti aiuteranno a trovare il formato perfetto per la tua campagna email.

Reattive alle dimensioni dello schermo

Tempo fa la maggior parte dei monitor dei computer aveva una risoluzione di 800x600, ma quei tempi ormai sono lontani. Oggi ci sono telefoni, computer, laptop e tablet in grado di eseguire risoluzioni molto più elevate e non puoi nemmeno contare su dispositivi diversi per utilizzare le stesse proporzioni.

Un design responsivo significa che le tue email sono progettate per apparire gradevoli indipendentemente dalla risoluzione dello schermo su cui vengono visualizzate. Non vuoi che una parte della tua email venga tagliata perché non si adatta allo schermo dell'utente, ma non vuoi nemmeno che la grafica e il testo siano così piccoli da essere difficili da vedere. Questo lo puoi fare impostando tabelle e immagini su larghezze diverse a seconda delle dimensioni dello schermo su cui vengono visualizzate. È utile testare a fondo il layout della tua email HTML prima di inviarlo alla tua mailing list.

Tempo di caricamento

Se il caricamento di una email è eccessivo, molti lettori semplicemente si arrenderanno e passeranno all'email successiva. Potresti anche pensare che tutti abbiano un dispositivo e una connessione a Internet abbastanza veloci da poter caricare qualsiasi email con facilità, ma così non è. Per le persone che utilizzano un dispositivo meno recente o che si connettono a una rete Internet cellulare, caricare un'email piena di immagini, video e altri contenuti multimediali può essere difficile.

Questo non vuol dire che non dovresti includere elementi multimediali nelle tue email, ma devi essere consapevole dei tempi di caricamento e di come questi influiscono sul tasso di respinta delle tue email. Creare email HTML significa tanto mantenere tempi di caricamento minimi quanto rendere le tue email più belle.

Differenza tra provider di email

Uno dei maggiori problemi che devono affrontare gli sviluppatori web è che diversi browser web possono visualizzare lo stesso codice HTML e CSS in modo diverso. Lo stesso vale quando si tratta di email marketing HTML e di diversi client di posta elettronica. Anche se la tua email può apparire perfetta quando la stai progettando, alcuni client di posta elettronica potrebbero non visualizzare correttamente le immagini o i video, oppure potrebbero non supportare il font che stai utilizzando.

Quando progetti un'email HTML, assicurati di progettarla pensando a diversi provider di posta elettronica. Questa non è solo una best practice per scrivere formati di email HTML, è una delle best practice più importanti da seguire nell'email marketing in generale.

È utile per rendere più semplice per gli iscritti fornire un feedback sulle e-mail ricevute. Se ricevi molti feedback sul mancato caricamento delle immagini o sulla visualizzazione errata delle email, valuta la possibilità di modificare un po' il layout HTML per trovare qualcosa che funzioni meglio.

Design per dispositivi mobili

In passato, la maggior parte degli utenti accedeva alle e-mail tramite computer, quindi non dovevi preoccuparti di progettare per diversi dispositivi. Ora che la navigazione mobile ha superato l'utilizzo di PC desktop e laptop, progettare le tue email per i dispositivi mobili è più importante che mai. Devi assicurarti che le tue email abbiano un bell'aspetto sia che vengano visualizzate su un tablet, un laptop o uno smartphone.

Se non stai progettando il tuo formato di email HTML perché funzioni con i dispositivi mobili, stai perdendo una parte significativa del tuo pubblico per l'email marketing.

Mettilo alla prova!

Una volta che pensi che il tuo formato di email HTML sia pronto per l'azione, è il momento di testarlo per vedere con i tuoi occhi. Puoi provare a inviare le tue email a vari account collegati a diversi client di posta elettronica oppure puoi utilizzare strumenti di test della posta elettronica per eliminare i problemi dal processo. La cosa importante è testare a fondo le tue email prima di inviarle alla tua mailing list.

Oltre ai test, puoi chiedere ai lettori un feedback sul formato delle tue email. Se ricevi diverse lamentele per un'immagine che non viene visualizzata correttamente o per un'email che impiega troppo tempo a caricarsi, è un segno che devi fare un lavoro migliore nella progettazione delle email HTML per quel particolare client.

L'HTML è più facile da imparare di quanto pensi

La maggior parte delle persone si è abituata a utilizzare gli editor WYSIWYG, ma un buon formato email HTML ha ancora un posto nel mondo moderno dell'email marketing. Sebbene il design delle email in HTML possa sembrare un po' complicato all'inizio, una volta apprese le basi è molto più semplice. L'utilizzo di strumenti di test e di progettazione per dispositivi mobili può anche aiutarti a evitare di creare email che non funzionano con determinati dispositivi o provider email.

Se vuoi creare con facilità email HTML efficaci per la tua mailing list, Mailchimp può aiutarti. Con modelli HTML per email e tantissimi strumenti per l'email marketing e l'automazione, Mailchimp è la soluzione completa per l'email marketing. Se la tua campagna di email marketing ha bisogno di una spinta, prova Mailchimp oggi stesso.

Laptop screen showcasing 'Unlocking Advanced Email Marketing' Checklist

Scarica la guida di Mailchimp per l'email di marketing avanzato

Fai crescere la tua attività con le giuste conoscenze e strategie per migliorare le tue email, catturare l'attenzione del pubblico e trasformare i lead in clienti fedeli.

Compila il modulo sottostante per ricevere l'opuscolo informativo

Condividi questo articolo