19 Set 2017

Attributo ALT e formattazione del testo alternativo per le immagini

Ad oggi il problema relativo allo scaricamento automatico o meno delle immagini da parte dei programmi di posta elettronica e delle webmail pare essersi molto ridotto.

Immagine Rotta

Se è vero che qualche anno fa la maggioranza delle newsletter e delle email che facevano riferimento ad immagini esterne veniva visualizzata di base senza immagini, con l'avvento degli smartphone la situazione è decisamente cambiata.

Mail di IOS mostra sempre le immagini e da fine 2013 anche Gmail e la relativa applicazione Android/Ios hanno cambiato radicalmente comportamento, nascondendo le immagini solo in casi particolari.

L'attenzione dunque verso un certo tipo di ottimizzazione - il testo alternativo legato all'immagine - è venuta meno; è comunque bene ricordare che

  • Outlook per Windows non mostra automaticamente le immagini
  • Yahoo non mostra automaticamente le immagini
  • Gmail di tanto in tanto decide di non mostrare immagini
  • Thunderbird non mostra automaticamente le immagini

Ci sono inoltre altri casi in cui il testo alternativo all'immagine diventa importante

  • Problemi ed errori nel caricamento delle immagini
  • Utilizzo di screenreader (programmi che si occupano di leggere il contenuto a video per ipovedenti)

Ignorare il problema non è una soluzione accettabile: se la nostra email contiene immagini funzionali e utili a chi le riceve, è necessario prevedere un testo alternativo.

20 Lug 2017

Nuova versione per Yahoo! Mail, cosa cambia per l'email design

A fine giugno Yahoo! Mail ha subito un drastico redesign, che ha coinvolto non solo l'aspetto grafico e di UI, ma ha toccato l'intera piattaforma, compreso il post processing delle email in arrivo e il supporto di alcune proprietà CSS.

La nuova interfaccia è senza dubbio più moderna e leggibile, risultato ottenuto abbracciando l'ormai omnipresente material design; in generale l'esperienza d'uso è sicuramente migliorata, anche grazie ad un alleggerimento complessivo che si fa notare in termini di reattività.

Yahoo2

Le novità inserite sono molte, a partire da un potente motore di ricerca interno, un'area dedicata a tutti gli allegati inviati e ricevuti e un editor di email completamente rivisto: Yahoo strizza l'occhio al pubblico dei MEME e delle GIF, con una libreria immediatamente disponibile e nel contempo offre la possibilità di cornici e sfondi che, ad essere sinceri, ricordano un po' i "bei" tempi andati.

Il nuovo Yahoo! Mail e il rendering

Le novità più interessanti per chi si occupa di Email Marketing sono senza dubbio quelle legate al rendering delle email: Yahoo! Mail in passato è stata una delle "bestie nere" dell'email design, a causa delle sue peculiarità e dei trick necessari per mantenere una visualizzazione coerente.

11 Set 2015

Mosaico: il primo editor di email open source

Meno di sei mesi fa VOXmail ha lanciato la versione sperimentale e liberamente utilizzabile online del suo editor a blocchi MOSAICO.

Sicuramente non primo nel genere (BeeFree, EDM Designer, Free Email Editor hanno tutti una versione più o meno liberamente utilizzabile online), Mosaico presenta alcune peculiarità interessanti, come la possibilità di convertire template html esistenti per renderli editabili.

È di ieri la notizia che MOSAICO è stato rilasciato con licenza open source su GitHub: di fatto, a quanto ci risulta, è il primo editor email di questo livello completamente free software.
La mossa è sicuramente interessante e in parte inaspettata, la parte di editing è sicuramente uno delle feature core di chi offre servizi di invio email.

mosaico template email editor

13 Mag 2015

Il nostro intervento al CSSday 2015

Qualche tempo fa abbiamo partecipato al CSSday 2015, primo convegno interamente dedicato al mondo dei CSS, organizzato dal GRUSP (PhpDay, JsDay...), con un intervento su Email design e Css.

L'idea era quella di fare un punto sull'attuale stato dell'arte, sulle differenze fra il mondo del design web e quello del design email, tentando di tracciare una rotta per il prossimo futuro.

Altra parte fondamentale del talk è stata quella relativa ai dati di utilizzo delle varie webmail italiane, che hanno evidenziato quanto sia variegato e difficile da domare il mondo della compatibilità verso client e webclient email.

Qui trovate il video integrale dell'intervento:

26 Feb 2013

Outlook.com: dimenticatevi margin, float, background-image e non solo!

Pochi giorni fa ho scritto del lancio ufficiale di Outlook.com e quindi è il momento di fare un riepilogo delle cose da fare e non fare per assicurarsi una corretta visualizzazione delle newsletter sulla webmail di Microsoft.

Blocco Immagini

Innanzitutto Outlook.com, come il predecessore, come impostazione predefinita blocca le immagini presenti nelle email se provenienti da mittenti sconosciuti. Non si limita ad un blocco "sano" ma piuttosto visualizza al posto delle immagini dei blocchi grigi. Molto peggio di quanto facciano "gli altri" che almeno visualizzano l'eventuale testo inserito nell'attributo ALT.

18 Giu 2010

Alice aggiorna la sua "datata" webmail

Alice vs VirgilioLa settimana scorsa ricevo questo messaggio in una casella @alice.it

LA MAIL DI TELECOM ITALIA CAMBIA VOLTO!

Nei prossimi mesi e in maniera graduale sara' disponibile la nuova Alice MAIL con una veste grafica completamente rinnovata e ancora piu' ricca di funzionalita'

Ignorando le nuove funzionalità, la nuova dimensione della casella, il supporto mobile e tanto altro cerco di capire quale sistema utilizzeranno e, con mio sollievo, approdo su una pagina con questo screenshot:

16 Feb 2009

Scrivete le vostre newsletter nero su bianco. Siete sicuri?

In una pagina HTML per il web se si inserisce un testo senza specificarne un colore e senza che siano presenti stili, questo testo verrà tipicamente visualizzato in nero. Capita molto spesso, quindi, che se si vuole scrivere in nero non si specifichi alcuna formattazione, ma questo va bene solo in ambienti controllati e non nel mondo dell'email, dove ogni dispositivo, ed ogni sistema di fruizione decide a modo proprio cosa fare del vostro html.

E' quindi importante specificare il colore del testo tramite un <font color="black"> o tramite l'attributo style="color: black;" per essere sicuri che tutti lo vedano nero!

In particolare le webmail applicano alcuni stili che non sono quelli predefiniti del browser, ma quelli di visualizzazione delle proprie pagine, e questi stili spesso vengono applicati anche al vostro html.