Suggerimenti per le e-mail HTML

Consigli

per personalizzare i modelli di email

Personalizzare il codice sorgente HTML

Codepen è un ottimo strumento gratuito per modificare HTML e altri linguaggi web. Dopo aver creato un account gratuito e cliccato sul link di uno dei modelli di email, ti ritroverai su una pagina simile a questa:

screen-shot-2016-10-19-at-10-31-54-am

Prima di tutto, clicca sul pulsante "Fork" in alto a destra nella finestra per fare una copia del modello che puoi modificare.

Per cambiare il contenuto dell'email, dovrai modificare il codice sorgente HTML. Ma, visto che tutti i client di posta (come Gmail, Outlook e Apple Mail) gestiscono le email in modo un po' diverso, è meglio non cambiare la struttura dell'email, altrimenti potrebbe non funzionare. Il contenuto su cui dovrai concentrarti è iltesto, sia che si tratti solo di inserire il nome della tua regione, l'email e altre informazioni importanti, sia che si tratti di tradurre tutto.

Personalizzare il testo all'interno dell'HTML è piuttosto semplice, una volta che sai dove trovarlo. In Codepen, tutto il testo che appare nell'e-mail è biancoPer esempio, se stai usando il modello mostrato, dovresti personalizzare la riga in bianco qui per inserire il nome della tua regione:screen-shot-2016-10-19-at-11-00-55-am

Dopo aver personalizzato tutto il testo dell'e-mail, devi ricordarti di cambiare qualsiasi contenuto con collegamento ipertestuale. Puoi dare un'occhiata all'anteprima dell'e-mail per trovare questi contenuti, che spesso sono pulsanti e contatti e-mail. Nel codice sorgente, saranno elencati come:

<a href="URL">some text</a>

Per esempio, il link che vedi qui sotto va cambiato con l'URL della pagina web per confermare la partecipazione a un evento:

screen-shot-2016-10-19-at-11-12-51-am

Queste informazioni di contatto devono essere modificate per includere il mio indirizzo e-mail e la pagina web RSVP. Tieni presente che nella riga evidenziata devono essere modificati due URL distinti:

screen-shot-2016-10-19-at-11-16-24-am

Una volta che hai finito, puoi esportare l'HTML. Per farlo, clicca sul pulsantedi esportazione in basso a destra nella finestra, poi scegli "Esporta .zip":

screen-shot-2016-10-19-at-11-18-24-am

Ecco fatto! Ora sei pronto per provare la tua email e spedirla.

Inserisci il tuo codice HTML nel corpo di un'e-mail

Inserisci il tuo codice HTML nel corpo di un'e-mail

La maggior parte dei client di posta elettronica non mostra l'HTML che inserisci direttamente nel corpo di un'e-mail. Devi invece aprire l'e-mail in un browser, copiare il contenuto della finestra del browser e poi incollarlo nell'e-mail. Ecco come fare:

Passaggio 1 Per aprire l'HTML nel browser, basta fare doppio clic sul file HTML che hai esportato (potrebbe essere necessario decomprimere prima il file). Il file dovrebbe aprirsi automaticamente nel browser, oppure puoi fare clic con il pulsante destro del mouse e selezionare "Apri con", quindi selezionare il browser web:

screen-shot-2016-10-19-at-11-26-12-am

Passaggio 2 Una volta aperto l'HTML nel browser, clicca su Modifica > Seleziona tutto.

screen-shot-2016-10-19-at-11-30-09-am

Poi, clicca su Modifica > Copia:
screen-shot-2016-10-19-at-11-32-23-am

Ora, incollalo nel corpo della tua email e spediscila!

screen-shot-2016-10-19-at-11-36-49-am

Ricorda, dovrestisempre controllare la tua email prima di mandarla ai tuoi contatti. È meglio provarla su più client di posta elettronica, quindi potresti creare degli account di prova per questo scopo.

Technovation è un programma di Iridescent, un'organizzazione no-profit 501c3. Iridescent crea e offre un'efficace educazione scientifica, ingegneristica e tecnologica per aiutare i giovani svantaggiati a sviluppare curiosità, creatività e perseveranza.