Come creare un'e-mail HTML: istruzioni dettagliate

Le mailing list sono una parte importantecampagne di marketing. Creare e-mail per loro è molto simile allo sviluppo di semplici pagine Web. Allo stesso tempo, dovrebbero essere considerate alcune importanti differenze. In particolare, l'invio di lettere HTML sarà efficace solo se essi stessi sono composti correttamente tecnicamente e il loro contenuto e stile sono coerenti con i tuoi obiettivi. Allo stesso tempo, si ritiene che un laico non possa far fronte a questo compito. Questo articolo fornisce istruzioni dettagliate dettagliate su come scrivere e come inviare una lettera HTML.

Funzionalità di creazione

Una persona moderna riceve una media giornaliera5-6 e talvolta fino a 10 e-mail. Ciò significa che hai solo meno di un secondo per catturare l'attenzione del destinatario prima che proceda a leggere la corrispondenza successiva. Altrimenti, l'invio di e-mail HTML sarà completamente inefficace e perderai semplicemente tempo.

Una delle sfumature che aumentano le tue possibilità diattirare l'attenzione di potenziali clienti o altri destinatari, è la creazione di corrispondenza adattata ai dispositivi mobili. In effetti, la maggior parte di coloro a cui è indirizzata la visualizzazione della posta, probabilmente li usano molto più spesso rispetto ai computer desktop e laptop.

A tal fine, è possibile applicare, ad esempio, un "design reattivo", che si adatta facilmente alle dimensioni dello schermo.

Quale dovrebbe essere il modello di lettera

Quando si impone un documento destinato all'invio a corrispondenti, è necessario rispettare i seguenti requisiti:

• Dovrebbe essere abbastanza stretto, cioè di dimensioni, non dovrebbe superare l'intervallo di 500-600 pixel, il che garantirà la corretta visualizzazione di testo e altri contenuti su dispositivi di qualsiasi tipo.
• È necessario utilizzare un carattere abbastanza grande per tutte le informazioni di testo, poiché sui dispositivi iOS la lettera HTML sarà scomoda da leggere se la dimensione del carattere è inferiore a 13 pixel.
• Gli elementi su cui è possibile fare clic devono essere sufficientemente grandi e isolati dai collegamenti più vicini. In questo caso, il destinatario sarà in grado di attivarli facilmente al primo tentativo.

Preparazione di

Prima di progettare un'e-mail HTML, è necessariocreare una nuova cartella su uno dei dischi e denominarla, ad esempio "Newsletter". Inoltre, è necessario scaricare e installare Dreamweaver CS3. Questo prodotto Adobe è uno degli strumenti per la creazione di siti Web abbastanza semplici ed è adatto per lo sviluppo di mailing list HTML.

Crea e salva un documento

Prima di scrivere la parte di testo della lettera, devi:

• aprire il piuttosto popolare generatore di posta elettronica HTML Dreamweaver CS3 (DW);
• creare un documento scegliendo "HTML di transizione 4.01" come tipo;
• salva il file con l'estensione “.html”;
• trova il comando di modifica nel menu in alto;
• deseleziona la casella di controllo "Usa i CSS anziché i tag HTML".

Guida passo passo

Ora, considera come creare un'e-mail HTML. Per questo:

• Apri le schede nel menu"Inserisci" e "Tabella" e imposta i parametri della tabella desiderati. Ad esempio, righe - 2, colonne - 1, larghezza - 700, intestazione - sopra. I bordi possono essere impostati, ma puoi farne a meno specificando 0.
• Forma il titolo della lettera. Poiché la lettera HTML è destinata a un numero maggiore di destinatari, utilizzano l'operatore [first_name], che sostituisce il nome del destinatario desiderato.
• Nella finestra inferiore "Proprietà" imposta i parametri necessari per il carattere, la dimensione e il colore del testo del titolo e il colore di sfondo.
• "Esci" dalla barra del titolo. Nella parte inferiore dello schermo sono impostati i parametri per il cursore "Centro" e "Centro".
• Incolliamo il testo finito della lettera o "scriviamo" direttamente nel programma DW, selezionando il tipo e la dimensione del carattere desiderati, nonché la posizione del testo sulla pagina.

Creazione di collegamenti ipertestuali

Cercheremo di rendere più la lettera HTMLprofessionale e avanzato. A tal fine, nasconderemo i collegamenti ipertestuali nel contenuto. Per fare ciò, selezionare la posizione nel testo che è stata scelta come collegamento ipertestuale. Nell'angolo sinistro nella parte superiore dello schermo dovresti "aprire" l'icona corrispondente e inserire il tuo link nella finestra pop-up. Allo stesso tempo, non bisogna dimenticare di mettere un segno di spunta nella casella di controllo "_blank" in modo che il collegamento si apra in una nuova finestra e il destinatario dopo averlo visualizzato non perda l'accesso al messaggio principale.

Come inserire immagini

In genere, la lettera HTML terminainformazioni di contatto, preferibilmente con una foto dell'autore o con un'immagine tematica adeguata. Può essere scaricato da Internet o pre-scaricato su Internet, poiché sarà necessario l'URL di questa immagine. Questo è fatto meglio attraverso uno dei servizi gratuiti.

Per organizzare un finale così bello:

• incollane un altro in fondo alla lettera, all'interno della tabella principale con 3 colonne e un parametro per un bordo di 0 pixel;
• posiziona il cursore nel punto del tavolo dove vogliono vedere l'immagine;
• segnare nella finestra in basso "Al centro" e "Sul bordo superiore" per ogni sezione;
• seleziona la scheda "Inserisci" nel menu in alto;
• fai un clic sulla scritta “Immagine” e nel menu a discesa incolliamo l'indirizzo da noi copiato;
• fai clic su "Ok" 2 volte.

Visualizza

Ora che sai come creare email HTML,assicurarsi che il destinatario lo veda nella forma corretta. Per fare ciò, prima di inviarlo, è necessario visualizzare il proprio lavoro nel browser Dreamweaver CS3. Per fare ciò, fai clic sull'icona con il globo nel menu in alto al centro. Se sullo schermo appare abracadabra invece delle lettere, allora dovresti impostare la codifica automatica nelle impostazioni del tuo browser.

Codifica

Dalla sezione "Progetto" e vai alla parte del codice - "Codice". Nella finestra che si apre, seleziona e copia tutto ciò che è racchiuso tra i tag e . Salva il file. Successivamente, inserisci il codice HTML.

Invio di email HTML

Per fare la newsletter aprire lo "Smart Reporter" (SR). Poi:

• scegli o crea una nuova lettera compilando le righe "Nome" e "Indirizzo mittente".
• Compila la riga "Oggetto della lettera";
• contrassegnare il codice HTML nel menu in alto a sinistra;
• incolla il codice copiato nel programma DW-code in un grande campo "Source";
• verificare la correttezza del display utilizzando lo strumento "Anteprima";
• elimina la versione testuale della lettera;
• testarlo per lo spam utilizzando il pulsante con lo stesso nome situato accanto al pulsante "Invia".

Diversi modelli popolari

L'uso di un framework è di grande aiutoAccelerare il processo di creazione di una lettera e renderla più accessibile per uno sviluppatore che sta imparando le basi della creazione di documenti Web. I modelli più popolari sono:

• Cerberus. Questa serie di cosiddetti modelli reattiviti consente di creare lettere che normalmente vengono visualizzate sia nell'applicazione mobile Gmail che in Outlook. Ti permette di usare blocchi di codice HTML singolarmente o combinandoli.
• Inchiostro - Questo è un vuoto di lettere, le cui mailing list sono quasi universali e compatibili con qualsiasi dispositivo e client.
• Modello di email HTML davvero semplice. Il modello consente di creare newsletter in modo molto semplice e rapido. È vero, avranno un design estremamente semplice sotto forma di una singola colonna, che contiene un invito all'azione.

Come incorporare HTML in una lettera

Consideriamo ora un problema leggermente diverso. Per inserire il codice HTML in un'e-mail, ad esempio Gmail utilizzando, come nell'esempio seguente, il browser Google Chrome, è necessario:

• premere il tasto F12 o selezionare la sequenza appropriata di comandi nel menu;
• nella finestra che si apre con il codice per la pagina corrente del client Gmail, trova il luogo in cui inserire il messaggio HTML, fai clic con il tasto destro e seleziona "Modifica come HTML".
• Incolla il codice HTML copiato;
• premere la combinazione di due tasti "Ctrl" e "Invio".

Per lo stesso scopo, è possibile scaricare sempliciusando il programma Mozilla thunderbird. Con il suo aiuto, puoi creare una lettera, quindi selezionare prima "Incolla" e poi "HTML" e incollare lì il codice della tua newsletter.

strumenti

Il plug-in e-newsletter di WordPress lo consenteGestisci professionalmente newsletter e abbonati. Entrambi vengono eseguiti direttamente tramite il pannello di amministrazione di WordPress. Questa circostanza fornisce un controllo completo ed è completamente gratuita, che non può che rallegrarsi.

Un altro semplice strumento: antiproiettileimmagini di sfondo, che è un semplice strumento che consente di ottenere il codice per l'immagine di sfondo delle lettere generate. Con esso, puoi rendere la corrispondenza molto più bella. Per comporre una lettera, devi solo specificare l'URL dell'immagine di sfondo che ti piace e il suo colore di backup e se questi parametri devono essere applicati a tutto il corpo della lettera HTML o se sono destinati solo a una delle celle della tabella. Di conseguenza, otterrai codice già pronto che desideri copiare e incollare nel tuo modello.

Ora sai come inviare un'email HTML.La sua creazione non è particolarmente difficile, soprattutto se si utilizzano modelli già pronti che non mancano sul Web. Pertanto, anche coloro che non hanno una conoscenza speciale possono facilmente far fronte a questo compito.