Czy istnieje sposób korzystania z czcionek Google Web w wiadomościach e-mail w formacie HTML?

Question

Wiadomość e-mail w formacie HTML musi (powinna) mieć swój CSS, aby uzyskać oczekiwany wygląd większości klientów poczty e-mail.

Czy istnieje sposób na połączenie Czcionki internetowej Google z osadzonym w takiej wiadomości e-mail, ale nadal zachowuje ona szeroką akceptację (odpowiednie renderowanie) wśród klientów poczty e-mail?

Wiem, że alternatywą byłoby posiadanie obrazu z odpowiednią typografią, ale najpierw poszukałbym czegoś innego, co mogłoby zadziałać.

Answer 1

Jeśli czcionka jest absolutnie niezbędna, konieczne będzie przejście z tekstem jako rozwiązaniem obrazowym. Od grudnia tylko poczta z iOS, Mail.app, Lotus Notes 8, domyślna poczta na Androida, Outlook 2000 i Thunderbird obsługują zewnętrzną niestandardową czcionkę.

Patrz: http://www.campaignmonitor.com/blog/post/3897/using-web-fonts-in-email

---

Edycja 10.02.2014: Ponieważ jest to jeden z moich najbardziej popularnych odpowiedzi, tutaj jest aktualizowany Informacje na temat najlepszych praktyk czcionek internetowych w wiadomości e-mail:

http://www.campaignmonitor.com/resources/will-it-work/webfonts/

Answer 2

Możesz teraz użyć pakietu NPM custom-fonts-in-emails do osadzania niestandardowych czcionek jako obrazów w wiadomościach e-mail. https://github.com/crocodilejs/custom-fonts-in-emails

import customFonts from 'custom-fonts-in-emails'; 
import path from 'path'; 

const options = { 
    text: 'Make something people want', 
    fontNameOrPath: 'GoudyBookletter1911', 
    fontColor: 'white', 
    backgroundColor: '#ff6600', 
    fontSize: 40 
}; 

customFonts.png2x(options) 
    .then(console.log) 
    .catch(console.error); 

Wyjścia:

<img width="461" height="51" src="data:image/png;base64,..." title="Make something people want" alt="Make something people want" style="color: white;font-size: 25.5px;line-height: 51px;text-align: center;background-color: #ff6600;"> 

Renders: