Come formulare una strategia di progettazione e sviluppo di email

In questo tutorial spiegherò come concentrare i tuoi sforzi sui client di posta elettronica e sui client webmail utilizzati dal tuo pubblico di destinazione.

Nota: questo tutorial fa parte dell'intera settimana di contenuti e-mail su Tuts + Web Design: consulta la guida di apprendimento Mastering HTML Email per ulteriori informazioni!

1. Comprendere l'importanza di una strategia

Il pubblico di destinazione ha accesso a una vasta gamma di client di posta elettronica, client e dispositivi Webmail e, poiché non vi sono e-mail equivalenti agli standard W3C, le loro campagne di posta elettronica variano a seconda di cosa stanno utilizzando per visualizzarli e cosa stai usando per interagire con loro.

Ad esempio, potrebbero utilizzare:

  • Microsoft Outlook, che non riproduce GIF animate oltre il primo fotogramma.
  • Gmail, che non rende i caratteri web.
  • iOS Mail, che fa riprodurre GIF animate e fa rende i caratteri web, ma anche, inutilmente, rende alcuni contenuti come collegamenti blu o link grigi!

Pertanto, per offrire una vasta esperienza di abbonati al pubblico di destinazione, è necessario formulare una strategia di progettazione e sviluppo della posta elettronica che tenga conto dei client di posta elettronica e dei client Webmail che stanno utilizzando. Uno che ti consente di sfruttare al meglio e superare (con un e-mail o due) le loro caratteristiche peggiori e più impegnative.

La domanda è: come si può fare questo, quando il pubblico di destinazione potrebbe utilizzare un numero qualsiasi di client e-mail e client Webmail su un numero qualsiasi di dispositivi? La risposta è utilizzando uno strumento di analisi della posta elettronica per scoprire quali utilizzano.

2. Scopri quali sono i clienti che il tuo pubblico utilizza

Strumenti di analisi e-mail, come quelli contenuti in Litmus e Email su Acid, tracciano singole campagne e-mail e creano un rapporto per loro, fornendo preziosi dati client e client webmail, oltre al dispositivo, al sistema operativo e ai dati di ingaggio. Per generare e accedere a questi dati, devi creare un link di tracciamento unico all'interno dello strumento, per ciascuna delle tue campagne e-mail, e costruirlo in ogni rispettivo e-mail HTML. Potrebbe sembrare un po 'come questo:

Una volta che hai inviato la tua campagna e-mail, con la tracciaincorporato nel link, inizierai a vedere i dati visualizzati nel suo rapporto di analisi e-mail. Dovrai concedere abbastanza tempo a sufficienza per consentire al pubblico di destinazione di aprire la tua campagna e-mail, per ottenere un'immagine precisa di come hanno visualizzato e interagito con esso.

Sommario del report di Litmus Analytics, che mostra i dati del client email e webmail.

Quando invii sempre più campagne email al tuo pubblico di destinazione, vedrai che le tendenze cominciano a emergere nei tuoi rapporti di analisi e-mail, consentendo di identificare quali sono i client e-mail e i client Webmail più popolari tra il pubblico di destinazione e quali sono i meno. Vale la pena affermare qui, che non è saggio formulare la tua strategia di progettazione e sviluppo della posta elettronica su un rapporto, in quanto potrebbe essere un'anomalia, quindi inizia con un minimo di tre.

Ora sei pronto per analizzare i tuoi rapporti di analisi e-mail e stabilire quali client e-mail e client webmail formulare la tua strategia.

3. Restringi i clienti a cui puntare

Inizia analizzando i rapporti nel tuo strumento di analisi della posta, esaminando principalmente i client di posta elettronica e i client di posta che sono stati utilizzati dal pubblico di destinazione per aprire le tue campagne email. Identifica i client e-mail e webmail più popolari del tuo pubblico target, indicati dalla percentuale di popolarità registrata su ciascuno di essi.

I più popolari client di posta elettronica e webmail.

I client e-mail e i client Webmail più popolari dovrebbero essere considerati i "clienti primari" del pubblico di destinazione e quelli da formulare in merito alla progettazione e alla strategia di sviluppo della posta elettronica. Come guida, la percentuale di popolarità collettiva dovrebbe essere compresa tra il 60% e il 70% e comprendere due o tre client email e / o webmail.

Il restante 30-40% dovrebbe essere considerato "clienti secondari" del pubblico di destinazione.

La tua strategia di progettazione e sviluppo della posta elettronica, quindi, dovrebbe essere formulata per fornire quanto segue ai "clienti principali" del pubblico di riferimento:

  1. Assicurati che le tue campagne di email funzionino in modo impeccabile.
  2. Assicurati che le tue campagne email siano facili da interagire, ad esempio utilizzando i pulsanti che sono selezionabili in tutta la loro area.
  3. Sfruttare, laddove possibile, le funzionalità all'interno dei client di posta elettronica e di posta elettronica che aggiungono valore all'esperienza dell'iscritto.

E consegna quanto segue ai "clienti secondari" del tuo target di riferimento:

  1. Assicurati che i messaggi e gli inviti all'azione della tua campagna e-mail siano chiari e, mentre potrebbero non essere visualizzati in modo impeccabile, o esattamente come i "client primari", non perdere troppo sonno per questo.
  2. Assicurati che le tue campagne email siano facili da interagire.

Avendo stabilito quali sono i "clienti primari" e i "clienti secondari" del target di riferimento, sei quasi pronto per iniziare a formulare la tua strategia di progettazione e sviluppo della posta elettronica. Tuttavia, prima di farlo, devi comprendere le loro caratteristiche uniche per assicurarti di offrire loro una grande esperienza di abbonati.

4. Identificare "primario" e "client secondari"

La corretta comprensione dei tuoi clienti primari e secondari ti consente di prendere decisioni di progettazione e sviluppo ottimali, mentre formulhi la tua strategia di progettazione e sviluppo della posta elettronica.

Sebbene non esaustivi, ecco alcune delle caratteristiche e delle funzionalità supportate di alcuni dei popolari client di posta elettronica e webmail. Vale la pena affermare qui che alcune delle caratteristiche predefinite possono essere migliorate o superate utilizzando gli hack delle e-mail.

Caratteristiche di progettazione e caratteristiche supportate

Email client /
Client Webmail
Design
Caratteristiche e caratteristiche supportate
Microsoft Outlook
  • Layout fisso non reattivo
  • Nessun carattere Web
  • Nessuna GIF animata
  • Nessuna immagine di sfondo (senza implementare le e-mail di sfondo antiproiettile delle immagini di sfondo)
iOS
  • Layout reattivo
  • Caratteri Web
  • GIF animate
  • Immagini di sfondo
  • Visualizza alcuni contenuti (numeri, date e termini correlati come fino a), Come collegamenti blu o collegamenti grigi (senza implementare il collegamento blu)
Gmail
  • Layout reattivo
  • Nessun carattere Web
  • GIF animate
  • Immagini di sfondo (ad eccezione dell'app Gmail per gli abbonati con un account non Gmail)

Caratteristiche di sviluppo e caratteristiche supportate

Email client /
Client Webmail
Sviluppo
Caratteristiche e caratteristiche supportate
Microsoft Outlook
  • Richiede s per la creazione della struttura della posta elettronica
    iOS
    • supporti s e / o 
      s per la creazione della struttura della posta elettronica
      Gmail
      • supporti s e / o 
        s per la creazione della struttura della posta elettronica
      • Richiede CSS in linea per lo styling di elementi essenziali su alcune versioni, tra cui Gmail su Android 5.1, Gmail su Android 6.1 e IMAP di Gmail App
      • Avendo stabilito quali sono i clienti primari e secondari del pubblico di riferimento e avendo compreso le loro caratteristiche, sei pronto per formulare una strategia di progettazione e sviluppo della posta elettronica.

        5. Formulate la vostra strategia di progettazione e sviluppo

        Utilizzando gli approfondimenti ottenuti dai rapporti di analisi delle e-mail e la comprensione dei vari clienti del pubblico target, è ora possibile formulare la propria strategia. Ricorda, il tuo obiettivo è offrire una grande esperienza di abbonati al tuo pubblico di destinazione. Se hai più target di pubblico, dovrai creare una strategia per ognuno di essi.

        Che cosa è una strategia di progettazione e sviluppo di email?

        Una strategia di progettazione e sviluppo comprende quattro elementi chiave; ognuno informato ed influenzato dal cliente principale del pubblico di riferimento. Gli elementi chiave sono:

        1. Un approccio al design.
        2. Un approccio allo sviluppo.
        3. Un approccio a qualsiasi miglioramento progressivo.
        4. Una logica, che delinea il pensiero dietro la strategia.

        Strategie di esempio

        Ecco alcune strategie di esempio, basate su veri destinatari, con i client email e webmail che influenzano ciascun approccio mostrato tra parentesi.

        Strategia n. 1

        Clienti primari
        Microsoft Outlook (50%)
        Posta iOS (20%)
        Gmail (10%)
        Design
        • Layout fisso (Microsoft Outlook) e layout reattivo (iOS Mail / Gmail su dispositivo mobile)
        • Caratteri Web sicuri (Microsoft Outlook) (Questi saranno sovrascritti dai caratteri nativi su Gmail su Android)
        Sviluppo
        • struttura o
          struttura avvolto all'interno fantasma
          struttura (Microsoft Outlook / iOS Mail)
        • Titolo e titoli dimensione del font dimensionato per adattarsi alla vista mobile, con @media query utilizzata per ingrandire dimensione del font per desktop (Gmail)
        • Miglioramento progressivo
          • Caratteri Web, simili nello stile al carattere Web sicuro per mantenere l'integrità del design (posta iOS)
          Fondamento logico
          Poiché la maggior parte del pubblico di destinazione utilizza Microsoft Outlook, a fisso client di posta elettronica, le e-mail dovrebbero essere progettate principalmente per la visualizzazione e l'interazione con il desktop. La mancanza di supporto per i font web, significa anche che dovrebbero essere usati i font web safe. È possibile implementare tecniche di miglioramento progressivo per sfruttare alcune delle funzionalità di progettazione e sviluppo offerte dagli altri client di posta elettronica e client Webmail offerti da questo pubblico di destinazione, come i caratteri Web su iOS Mail e le GIF animate su Gmail, anche se gli hacker di posta elettronica appropriati dovranno essere implementato per garantire che Microsoft Outlook non renda i font fallback come Times.

          Strategia n. 2

          Clienti primari
          Posta iOS (40%)
          Gmail (30%)
          Design
          • Mobile 
          • Layout reattivo (iOS Mail / Gmail su dispositivo mobile)
          • Caratteri Web o caratteri sicuri per il Web (questi saranno sovrascritti dai caratteri nativi su Gmail su Android)
          Sviluppo
          • struttura o 
            struttura avvolto all'interno fantasma struttura (se uno dei 'client secondari' è Microsoft Outlook)
          • Titolo e titoli dimensione del font dimensionato per adattarsi alla vista mobile, con @media query utilizzata per ingrandire dimensione del font per desktop (Gmail)
          • Miglioramento progressivo
            • Caratteri Web, simili nello stile al carattere Web sicuro per mantenere l'integrità del design (posta iOS)
            Fondamento logico
            Poiché la maggior parte del pubblico di destinazione utilizza iOS Mail, puoi essere più creativo, poiché hai a disposizione più funzionalità di progettazione e sviluppo, come la possibilità di utilizzare i caratteri Web per il titolo e le intestazioni. L'utilizzo di Gmail è più significativo tra questo pubblico di destinazione, ma a causa del caching delle immagini di Google, è impossibile identificare quale versione stanno utilizzando e se supporta o meno i CSS interni. Quindi, come per la strategia n. 01, l'e-mail deve essere sviluppata per funzionare su dispositivi mobili senza fare affidamento su CSS interni e @media interrogazioni.

            Cosa sono le Tabelle di Ghost?

            I tavoli dei fantasmi sono

             elementi creati per essere visualizzati solo in Microsoft Outlook. In quanto tale, la loro apertura
            , e ,
            tag e loro chiusura
            i tag, sono racchiusi tra i commenti condizionali di Microsoft -  per esempio.

            Sono utilizzati per abilitare la costruzione di e-mail per Microsoft Outlook, consentendo anche di costruire e-mail per altri client e-mail e webmail con

            S. Costruire email con
            s, garantisce che le tue e-mail siano accessibili e ti permetta di beneficiare della flessibilità di lavoro
            S offerte, come la possibilità di usare il galleggiante  proprietà.

             

            Conclusione

            Come hai scoperto in questo tutorial, è importante avere un design e una strategia di sviluppo della posta elettronica, se hai intenzione di offrire una grande esperienza di abbonati al tuo pubblico di destinazione. È anche importante rieseguire periodicamente e analizzare i report nel tuo strumento di analisi della posta elettronica, in quanto il pubblico di destinazione potrebbe cambiare di volta in volta il client di posta elettronica o il client di posta elettronica preferito..