Gmail 未在电子邮件上正确呈现字体

Question

我创建了一个 html 电子邮件并使用了 Google 字体。

我使用以下方法在 head 标签中包含了字体：

    ╔!--[if !mso]╗╔!--╗
     <link href="https://fonts.googleapis.com/css?family=Oswald:200,300,400,500,600,700" rel="stylesheet"/>
     <link href="https://fonts.googleapis.com/css?family=Merriweather+Sans:300,300i,400,400i,700,700i,800,800i" rel="stylesheet"/>
    ╔!--╔![endif]--╗

并使用字体，即我这样做了：

    <tr>
      <td valign="top">
         <p style="line-height:1;margin:0;color:#ffffff;font-family:'Merriweather Sans', sans-serif;font-size:12px;font-weight:normal;">Für Fragen sind wir jederzeit für Dich da:</p>
      </td>
    </tr>

问题是：字体在 Apple 邮件上完美呈现，在 Gmail 上仅 Oswald。

我试图找出为什么 'Merriweather Sans' 没有正确呈现，但没有机会。

你能帮帮我吗？

Answer 1

网络字体没有普遍支持，以下是支持它们的电子邮件客户端：

美国在线邮件
本机 Android 邮件应用程序（不是 Gmail 应用程序）
Apple 邮件
iOS 邮件
展望 2000
Outlook.com 应用

Answer 2

Gmail 无法使用 Google 字体或任何网络字体。

Gmail 支持多种网络安全字体。我找不到名单，也没有看到 Oswald。也许它受支持，但未列出。或者它可能映射到类似的字体。

已更新

这些是 Gmail 支持的字体：

• https://jsfiddle.net/wallyglenn/g35nchmL/

Whosebug wants me to post code before I could post the link
of fonts that work in Gmail I maintain on JSFiddle.
I felt a list of fonts might be useful in choosing a fallback font.

I am not being lazy, look at the link and you'll understand.

有关电子邮件字体的更多信息，请查看下面的文章。

https://litmus.com/blog/the-ultimate-guide-to-web-fonts

祝你好运。

Answer 3

The problem is: the fonts are rendered perfectly on apple mail, on Gmail only Oswald.

对于这个问题的第一部分，苹果邮件支持网络字体。这就是您看到它在所有 Apple 邮件客户端上正确呈现的原因。

对于第二部分 (Gmail)，Oswald 将使用其家族字体，这是我认为会在您的电子邮件中呈现 Oswald 的唯一原因。

I've tried to figure out, why 'Merriweather Sans' is not rendered correctly, but no chance.

Gmail 仍然存在链接到电子邮件的网络字体的问题，这就是 'Merriweather Sans' 未呈现的原因。

Answer 4

根据 Litmus 上的 this post；

Pro Tip: In April 2018,Gmail released an updated interface for their webmail client. This new interface uses two popular web fonts: Google Sans and Roboto. What does this mean? Despite Gmail not supporting web fonts, if you use either of these web fonts in your emails, they will actually render in Gmail. Simply add the fonts to your font-family CSS attribute if you want to use them in your email.

这就是为什么有一个关于 Roboto 在 Gmail 上工作的答案的评论。

Gmail 未在电子邮件上正确呈现字体

Gmail is not rendering Font correctly on Emails

html

css

fonts

gmail

html-email