Есть ли способ использовать Google Web Fonts в HTML-письме?

HTML-письмо должно (должно) содержать свой CSS для того, чтобы иметь ожидаемый дизайн на большинстве почтовых клиентов.

Есть ли способ связать веб-шрифт Google или встраивать его в такое электронное письмо, но при этом поддерживать широкое признание (соответствующий рендеринг) среди почтовых клиентов?

Я знаю, что альтернативой было бы иметь изображение с соответствующей типографикой, но я бы сначала искал что-то еще, что могло бы работать.

Ответы

Ответ 1

Если шрифт абсолютно необходим, вам придется идти с текстом в качестве решения изображения. По состоянию на декабрь только iOS Mail, Mail.app, Lotus Notes 8, Mail по умолчанию на Android, Outlook 2000 и Thunderbird поддерживают использование внешнего настраиваемого шрифта.

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

Edit 2/10/2014: Поскольку это один из моих самых популярных ответов, вот обновленная ссылка на лучшую практику веб-шрифтов в электронных письмах:

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

Ответ 2

Теперь вы можете использовать пакет NPM custom-fonts-in-emails для встраивания пользовательских шрифтов в виде изображений в ваших письмах. 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);

Выходы:

<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;">

Визуализирует: