D: Perché la mia newsletter non viene visualizzata allo stesso modo in tutti i client di posta?
R: Ogni client di posta (come Gmail, Outlook o Apple Mail) interpreta il codice HTML delle email in modo diverso. Questo significa che la stessa newsletter può apparire diversa a seconda dell’applicazione o del dispositivo utilizzato.
Per questo è importante conoscere le principali differenze di supporto tra i client e progettare email che siano compatibili e leggibili nella maggior parte delle situazioni.
Gmail
Desktop web
Gmail iOS
Gmail Android
Pulsanti arrotondati
🟢
🟢
🟢
Elemento Card
🟢
🟢
🟢
Google font/custom font
🔴*
🔴*
🔴*
Immagini di sfondo
🟢
🟢
🟢
Gif animate
🟢
🟢
🟢
webp
🟡**
🟡**
🟡**
Dark mode
🔴
🟢
🟢
Gmail desktop
Gmail Android DarkMode
Gmail iOS DarkMode
* Sia per Windows che per Mac il font di fallback è il Verdana ** Gmail converte le immagini WebP in JPEG per garantire una maggiore compatibilità con diversi client di posta elettronica e versioni precedenti; il processo di conversione può causare problemi alle immagini WebP con sfondo trasparente, rendendole inadatte a determinati utilizzi in Gmail.
Outlook
New Outlook
Classic Outlook
macOS
Android
Pulsanti arrotondati
🟢
🔴
🟢
🟢
Elemento Card
🟢
🔴
🟢
🟢
Google font/custom font
🟡*
🟡*
🟢
🔴
Immagini di sfondo
🟢
🟡
🟢
🟢
Gif animate
🟢
🟢
🟢
🟢
webp
🟢
🟢
🟢
🟢
Dark mode
🟢
🟢
🟢
🟢
* Sia per Windows che per Mac il font di fallback è il Verdana.
Outlook classic
Outlook new
Outlook new (MacOS)
Outlook App (Android)
Proprietà
Bordi arrotondati per card e CTA
Sia l'oggetto pulsante che l'elemento card usano l'attributo border-radius.
Compatibile?
Apple Mail (iPhone/iPad)
🟢
Apple Mail (macOS)
🟢
Outlook (iOS)
🟢
Android
🟢
Outlook (macOS)
🟢
Outlook (Windows) dal 2007-2021
🔴
Outlook 365 (windows)
🟢
Outlook.com (webmail)
🟢
Outlook (Android)
🟢
Gmail (Android)
🟢
Gmail (webmail)
🟢
Gmail (iOS)
🟢
Google fonts
Potrebbe sembrare assurdo, ma Gmail non supporta i propri Google Font. Gmail supporta esclusivamente Roboto e Google Sans come font web.
Compatibile?
Apple Mail (iPhone/iPad)
🟢
Apple Mail (macOS)
🟢
Outlook (iOS) dalla 2.51.1
🟢
Android
🔴
Outlook (macOS)
🟡
Outlook (Windows) dal 2021
🟡
Outlook (Windows) dal 2007-2019
🔴
Outlook 365 (windows)
🟡
Outlook.com (webmail)
🔴
Outlook (Android)
🔴
Gmail (Android)
🔴
Gmail (webmail)
🔴
Gmail (iOS)
🔴
Font custom
IPhone
Apple mail
Web-font 🟢
Gmail App
Verdana
Outlook
Verdana
Android
Gmail App
Roboto 🟡
Outlook
Verdana
Windows
Outlook nuovo
Verdana
Outlook classic
Verdana
Gmail
Verdana
Mac
Apple mail
Web-font 🟢
Outlook
Verdana
Gmail
Verdana
Immagini di sfondo
Compatibile?
Apple Mail (iPhone/iPad)
🟢
Apple Mail (macOS)
🟢
Outlook (iOS)
🟢
Outlook (macOS)
🟢
Outlook (Windows) dal 2021
🟢
Outlook (Windows) dal 2007-2019
🔴
Outlook 365 (windows)
🟢
Outlook.com (webmail)
🟢
Outlook (Android)
Gmail (Android)
🟢
Gmail (webmail)
🟢
Gmail (iOS)
🟢
Gif animate
Compatibile?
Apple Mail (iPhone/iPad)
🟢
Apple Mail (macOS)
🟢
Outlook (iOS)
🟢
Outlook (macOS)
🟢
Outlook (Windows) dal 2021
🟢
Outlook (Windows) dal 2007-2019
🟡
Outlook 365 (windows)
🟢
Outlook.com (webmail)
Outlook (Android)
🟢
Gmail (Android)
🟢
Gmail (webmail)
🟢
Gmail (iOS)
🟢
Darkmode
Inverte i colori?
Apple Mail (iPhone/iPad)
🟢
Apple Mail (macOS)
🟢
Outlook (iOS)
🟡
Outlook (macOS)
🟡
Outlook (Windows)
🟢
Outlook.com (webmail)
🟡
Gmail (Android)
🟢*
Gmail (webmail)
🔴
Gmail (iOS)/td
🟢
Yahoo! (webmail)
🔴
AOL (webmail)
🔴
*(nel nostro esempio le scritte sull'immagine e la scritta bianca del pulsante non sono cambiate, ma sono bianche come nel lightMode) mentre in Gmail iOS -- Totalmente supportato (le scritte bianche del pulsante e sull'immagine sono diventate nere)