15 novembre 2022

Come Aggiungere e Utilizzare Caratteri Personalizzati con Stripo

Arricchisci le tue email con caratteri personalizzati

Il 26 Novembre 2018 abbiamo rilasciato una nuova funzionalità — ora con Stripo puoi aggiungere caratteri personalizzati alle tue email in pochi click senza competenze HTML. Perché è importante?

Non è un segreto che un bel testo integri il design dell'email e convinca i clienti ad effettuare un acquisto.

Di solito, nel testo si utilizzano caratteri personalizzati coerenti con il marchio e accattivanti. Utilizzando un carattere che si adatta meglio alla situazione e al design dell'email, si mette il testo in evidenza migliorando l’aspetto. Pertanto, molto spesso, i caratteri cosidetti “web-safe” non sono sufficienti.

In questo caso, è necessario utilizzare dei caratteri personalizzati.

Guarda un breve video che spiega come aggiungere i caratteri personalizzati con Stripo. Tieni presente che questa funzione è disponibile solo per i piani a pagamento.

La maggior parte degli ESP e dei costruttori di email offre solo caratteri “web-safe”, mentre Stripo ne offre quattro set:

I set di caratteri offerti da Stripo

Stripo offre quattro set di caratteri per le tue email:

1. Carattere standard/ web-safe

Arial, Comic Sans MS, Courier New, Georgia, Helvetica, Lucida Sans Unicode, Tahoma, Times New Roman, Trebuchet MS e Verdana sono i caratteri più famosi, poiché sono ampiamente utilizzati dai siti Web e vengono visualizzati correttamente dalla maggior parte dei client di posta elettronica.

2. Caratteri non standard

Sono dei caratteri su cui alcuni professionisti discutono ancora sul fatto che siano web safe o no. Ma sono comunemente usati sul web. Ad esempio, Playfair Display è presente su quasi 1,1 miliardi di siti Web, famoso principalmente negli Stati Uniti e nell'Europa Occidentale.

Nota: sapevi che puoi diminuire il numero di caratteri standard e non standard per i tuoi progetti se li ritieni eccessivi?

Come rimuovere i caratteri non necessari dalla lista:

  • vai alle impostazioni del progetto nel tuo account;
  • trova la scheda dei caratteri standard/non standard;
  • fai click sul pulsante di commutazione per rimuovere il carattere dalla lista.

3. Caratteri per i banner

Sono decorativi e possono essere applicati solo ai banner, poiché qualsiasi testo posizionato sopra i banner viene considerato un elemento dell'immagine. Di conseguenza, verrà visualizzato correttamente su tutti i dispositivi, indipendentemente dal tipo di carattere applicato.

Stripo ne offre oltre 40.

L'elenco di questi caratteri viene visualizzato solo quando si lavora con una didascalia in un banner.

4. Caratteri personalizzati

Con Stripo puoi aggiungere qualsiasi tipo di carattere.

Non ci sono limiti al numero di caratteri personalizzati che puoi aggiungere.

Una volta installati i nuovi caratteri, applicali al menu e ai testi, a tutti i testi nelle email ad accezione dei banner.

Come aggiungere un carattere personalizzato alle impostazioni del tuo progetto con Stripo:

Ancora una volta, voglio sottolineare che si tratta di un processo molto semplice, in quanto non è necessario apportare alcuna modifica al codice HTML dell'email. Un'altra grande novità è che non devi impostare gli stessi nuovi caratteri per ogni modello di email con cui si lavora — si impostano per interi progetti. Sono disponibili nella tua lista per tutte le campagne all'interno di questi progetti.

Passaggio 1. Google

Innanzitutto, devi trovare il carattere che preferisci. Mi è piaciuto molto il Great Vibes che ho trovato su Google Fonts. Oltre a più di 1.000 carateri, Google offre anche abbinamenti popolari insieme ad essi.

  • quindi, è necessario selezionare il carattere, scorrere fino alla sezione "Stili" e fare click sul segno "più";

  • quindi, fai click sull'icona "Visualizza famiglie selezionate" nell'angolo in alto a destra della pagina web;

  • in una finestra pop-up, copia il link — è evidenziato nello screenshot qui in basso.

Passaggio 2. Stripo

Per installarlo sul tuo account con Stripo:

  • fai click sul nome dell'account nell'angolo in alto a destra dello schermo;
  • seleziona “Impostazioni organizzazione”;

  • a sinistra, vedrai "Progetti" — fai click su questa scheda;

  • seleziona il progetto che intendi migliorare con un nuovo carattere (Io ne ho solo uno);
  • fai click sul pulsante "Impostazioni";

  • scorri verso il basso alla sezione “Gestione dei caratteri”;
  • fai click sul pulsante "Aggiungi carattere personalizzato" (Io ho già tre caratteri personalizzati);

  • nel modulo pop-up, assegna un nome al carattere, inserisci il link URL di incorporamento e inserisci la famiglia di caratteri specificata da Google;

Nota: per tua comodità, ti consigliamo vivamente di dare nomi reali ai caratteri caricati.

  • una volta compilati correttamente tutti i campi, fai click su "Connetti".

Troverai i nuovi caratteri nella lista a tendina durante la modifica della tua email.

Come aggiungere caratteri personalizzati non presenti su Google Fonts alle impostazioni del tuo progetto con Stripo

Se non riesci a trovare l'opzione perfetta su Google Fonts, non preoccuparti! Puoi aggiungere qualsiasi carattere personalizzato al tuo account Stripo caricando un link a questo carattere.

Puoi anche utilizzare i tuoi caratteri personalizzati:

  • carica i file dei caratteri per aprire una piattaforma di archiviazione cloud o di condivisione file;
  • assicurati che i file siano disponibili per la visualizzazione in modo che gli utenti possano vederli;
  • Aggiungi l’Intestazione Access-Control-Allow-Origin ai tuoi file dei caratteri per evitare che vengano bloccati dal browser;
  • aggiungi i link al tuo account Stripo nel modo descritto sopra. Assicurati che i tuoi link inizino con "https" e non siano racchiusi tra virgolette.

Ecco un esempio di come aggiungere un carattere personalizzato al tuo account Stripo con Adobe Fonts:

  • vai su Adobe Fonts;
  • scegli il carattere che preferisci e premi il pulsante </>;

  • inserisci il nome del tuo progetto;
  • scegli la dimensione e gli stili dei caratteri;
  • fai click sul pulsante "Crea";

  • copia il link;

  • segui gli stessi passaggi che abbiamo descritto in precedenza per aggiungere questo carattere al tuo account Stripo.

Nota: se desideri utilizzare i caratteri di Adobe Fonts, non potrai farlo senza un abbonamento a Creative Cloud.

Come utilizzare i caratteri personalizzati nelle email

Puoi applicare qualsiasi tipo di carattere che desideri a blocchi di testo e menu per rendere le tue email efficaci ed uniche. Ma assicurati di testarli per verificare la compatibilità con i migliori client di posta elettronica.

Nota: se un client di posta elettronica non supporta il carattere che hai scelto, il client lo sostituirà con uno predefinito (la maggior parte dei client di posta elettronica ha due caratteri predefiniti).

Stripo non solo ti consiglia vivamente di testare email/carattere con Email on Acid o Litmus, ma anche di inviare questa email a tutti i tuoi indirizzi email per verificare, in pratica, come appare il carattere.

Per il mio test ho scelto il carattere Alumni Sans. Il Nostro strumento di test email ha mostrato che la maggior parte dei dispositivi e dei client di posta elettronica sostituisce questo carattere con quelli predefiniti. Dagli screenshot qui sotto, puoi vedere che Apple Mail ha visualizzato correttamente il carattere Alumni Sans, mentre Outlook 2019 lo ha sostituito con il suo carattere predefinito.

Client di posta elettronica che supportano i caratteri personalizzati nelle email

Ce ne sono solo alcuni:

  • Apple Mail (carattere predefinito — Helvetica);
  • Apple iPhone (carattere predefinito — Helvetica);
  • Thunderbird (carattere predefinito — Impact);
  • App Outlook per Android, iOS e Mac (carattere predefinito: Calibri);
  • App email di default per Android (carattere predefinito — Roboto).

Nota: non puoi essere completamente sicuro che il tuo carattere personalizzato sia supportato da questi client di posta elettronica, quindi è fondamentale testare la tua email prima di inviarla.

Quando scegli un nuovo carattere per le email, ricorda:

  1. Solo alcuni client di posta elettronica supportano i caratteri personalizzati.
  2. I caratteri sans-serif forniscono una percezione di semplicità e sono più appropriati per testi formali e newsletter aziendali.
  3. Richiede più tempo leggere un testo scritto in serif per le persone con disabilità visive e dislessiche, ma funziona meglio nelle email promozionali.
  4. Per le email HTML, la dimensione del carattere migliore è 14 px, mentre per i dispositivi mobili è 16 px.
  5. Per rendere le tue email accessibili, evita sfondi bianchi e testi allineati al centro.
  6. Nel tuo account Stripo, puoi aggiungere nuovi caratteri e rimuovere quelli che non usi per determinati progetti.

Riassumendo

I caratteri personalizzati possono essere uno strumento fantastico per rendere le tue email professionali e uniche, ma è fondamentale testarle prima di inviarle. Aggiungi caratteri decorativi al tuo account e usali per rendere più accattivante i tuoi modelli di email newsletter.

Arricchisci le tue email con caratteri personalizzati
8 commenti
Can you update this article to include using non-Google custom fonts?
Dave, Hello... Thank you for your question. We will update the post soon ? As for non-Google custom fonts: You can add custom fonts to your Stripo account only by uploading a link to the selected font. For example, the Adobe Fonts site https://fonts.adobe.com/collections offers links to the fonts and their description ("font-family") for entering information in the proper fields. The embedding link provided by Adobe Fonts needs to be converted to the format specified in the article or input field: it must start with https; no quotes before and after the link. Please do everything as you would do to Google Fonts, as shown in the video. https://www.youtube.com/watch?v=U2X3CLN01zA You can also use your fully custom fonts. Just upload them on your website, and then add the link to your Stripo account. Proven - Adobe fonts work well :) If you need more detailed instructions with screenshots, please write to us at contact@stripo.email.
Hey, thanx a lot!
Reinhard, Thanks for your supportive feedback. We're glad you liked it :)
А если понравившийся шрифт не представлен на Google Fonts, как тогда его добавить?
Arsen, Спасибо за обращение. Добавлять кастомные шрифты в Ваш аккаунт в Stripо можно только лишь подгружая ссылку на выбранный шрифт. Например, сайт Adobe Fonts https://fonts.adobe.com/collections предлагает именно ссылки к шрифтам и их описание ( "font-family", обычный это шрифт или курсив) для введения информации в соответствующие поля. Ссылку для встраивания, которую предоставит Adobe Fonts, вам нужно привести к формату, который обозначен в статье или поле для введения: начинаться она должна с https; никаких кавычек до и после ссылки. Делайте, пожалуйста, все по аналогии со шрифтами Google Fonts, как показано в видео. https://www.youtube.com/watch?v=U2X3CLN01zA Проверено — шрифты Adobe подгружаются и работают :) Если же Вам понадобится более подробная инструкция со скриншотами, — пожалуйста, пишите нам на contact@stripo.email. Будем рады помочь.
а если есть только файл со шрифтом? Его никак не загрузить?
Евгения, Спасибо за Ваш вопрос. Для использования кастомного шрифта, нужна именно ссылка на него, которая заканчивается на .css Если же Вам не подходят шрифты Google и Adobe, то Вы можете загрузить кастомный шрифт на свой сайт. И дальше добавить его в личный кабинет Stripo согласно инструкции, приведенной в данной статье. Важно: доступ к данному шрифту должен быть открыт всем.