Immagini AI per una newsletter: header, divisore e footer nello stesso stile

Un'email è il posto più severo in cui un'immagine vivrà mai. L'app di posta del lettore decide la larghezza, può bloccare le immagini finché non tocca, può invertire i colori in modalità scura e può non mostrare affatto il tuo font. Quindi un'immagine AI per una newsletter va pianificata a ritroso, partendo da questi limiti. Questa è una checklist per un set di tre pezzi, header, divisore e grafica del footer, che sembri fatto da un'unica mano.

Parti dalla colonna, non dall'immagine

La maggior parte delle newsletter sta in una sola colonna centrata larga circa 600 pixel, ed è solo per quella che devi progettare. I telefoni la riducono, i client desktop la centrano in uno spazio vuoto. Decidi prima la larghezza della colonna e ricava da essa i tre formati.

• Header: larghezza piena della colonna, largo e basso. Scegli un formato largo nel selettore Ratio, poi ritaglia l'altezza nel tuo editor.
• Divisore: larghezza piena, sottilissimo. Nessun modello disegna direttamente una striscia così sottile; genera un formato largo e ritaglia una banda sottile dalla zona più calma.
• Grafica del footer: stessa larghezza dell'header, un po' più alta del divisore, così l'email finisce con una forma e non con testo legale.

Genera a circa il doppio della larghezza della colonna e riduci nell'editor, così le immagini restano nitide sugli schermi ad alta densità dei telefoni. Lo studio crea immagini fino a 2K, più di quanto serva a una colonna. La guida al rapporto d'aspetto spiega perché un formato largo è meglio di uno quadrato da ritagliare dopo.

Tieni ogni parola fuori dall'immagine

Questa è la regola che salva la maggior parte delle newsletter. Se il titolo è incorporato nell'immagine dell'header, i lettori la cui app blocca le immagini vedono una casella vuota, i lettori di schermo non leggono nulla e un refuso significa un nuovo rendering. Metti titolo, data e pulsante come testo vero e usa l'immagine solo come sfondo.

Su un header è più facile mettere il testo se l'immagine ha già un'area tranquilla. Nominala nel prompt, come mostra l'articolo sullo spazio per il testo, e metti il soggetto sul lato opposto. Aggiungi anche un testo alternativo, perché alcuni lettori vedranno solo quello. Basta una frase semplice e breve; l'articolo sul testo alternativo ha lo schema.

Una palette, scritta in tutti e tre i prompt

Tre rendering separati si allontanano l'uno dall'altro se non li fissi. Scegli due o tre colori, nominali in ogni prompt e mantieni lo stesso tipo di soggetto e la stessa luce. Nell'esempio sopra sono prugna, viola e sabbia con un morbido bagliore di lanterne. La guida alle palette di colori mostra come formularli perché il modello non li scambi.

Poi usa il primo header approvato come riferimento per il divisore e il footer, e di' cosa mantenere (palette e luce) e cosa cambiare (il soggetto). Ne parla l'articolo sulle immagini di riferimento. Usa lo stesso modello per tutti e tre; Still è una buona scelta predefinita da €0.40 a rendering, e Still Lite da €0.30 basta per provare le composizioni prima della versione finale.

Abbina l'immagine allo sfondo dell'email

Scegli prima il colore di sfondo dell'email e fai fondere i bordi di ogni immagine con esso. Un header che termina con una linea netta su una pagina bianca sembra un rettangolo incollato. Una soluzione è far sfumare l'immagine nel colore esatto della pagina sul bordo inferiore; un'altra è scrivere il colore della pagina nel prompt e chiedere una vignettatura morbida. Controlla il risultato nel tuo strumento di posta, non solo nello studio.

La modalità scura è il secondo test. Alcune app invertono gli sfondi chiari e un'immagine con un bordo pallido può finire con un brutto alone. Un'immagine con un bordo scuro o di tono medio sopravvive meglio a entrambe le modalità, un buon motivo per tenere la palette sul lato più scuro.

File: piatti, piccoli e in un formato noioso

Le app di posta sono molto meno moderne dei browser. Salva ogni pezzo come JPEG, o come PNG se ha colori piatti, ed evita i formati più recenti il cui supporto nelle app di posta è a macchia di leopardo. Punta a un file abbastanza piccolo da far caricare l'email subito anche con una connessione mobile scarsa; un'immagine calma e povera di dettagli si comprime molto meglio di una affollata, e anche l'area libera lasciata per il titolo aiuta. Dopo la compressione, controlla a dimensione piena i gradienti scuri e morbidi, dove il banding si nota per primo.

Cosa lo studio non può fare qui

Crea immagini raster e non costruisce l'email: niente HTML, niente slicing, niente ridimensionamento alla tua colonna e nessuna compressione per le app di posta. Tutto questo avviene nel tuo editor o nel tuo strumento per newsletter. Non disegna un divisore sottile come un capello in quanto tale, quindi lo ritagli da un rendering più largo. L'output trasparente esiste solo su alcuni modelli e per l'email non vale il rischio, perché i client trattano in modo imprevedibile un file trasparente in modalità scura; appiattisci invece la grafica su un colore pieno. E non può promettere che tre rendering corrispondano esattamente: una palette e un riferimento ti portano vicino, quindi ritocca il set nell'editor se il tuo brand richiede colori esatti.

Apri lo studio, genera e approva prima l'header, poi crea da esso il divisore e il footer. Se lo stile non è quello giusto, confronta i modelli di immagini nella pagina dei modelli. Il nostro articolo sulle immagini header del blog tratta lo stesso mestiere per una pagina web, dove le regole sono più libere.