-1

我为自己创建了一个新的 html 电子邮件签名，我对结果非常满意。它使用字体堆栈，首先尝试 Web 字体Open Sans ，如果客户端无法显示 Web 字体，则回退到Trebuchet MS 。我正在使用 Outlook 2016 发送带有这个新签名的电子邮件，而 Outlook 2016 以及大多数其他现代电子邮件客户端似乎都能正确显示该签名。

我遇到的问题是 Outlook 2013 及更低版本似乎无法处理网络字体，但同时忽略字体堆栈并重置为 Times New Roman 而不是我的后备字体。

这是一个众所周知的问题，网络上有大量可用信息，包括几个如何避免或规避它的代码示例。我在该主题上找到的更好的概述之一是EmailOnAcid.com的博客条目。

虽然在其他第三方 smtp 客户端的帮助下使用 Outlook向收件人发送电子邮件时，建议的策略可能会起作用，但它们似乎不适用于想要从Outlook 发送电子邮件的我。因为无论我在我的签名模板中实现哪些代码或条件，在将签名加载到要发送的电子邮件中的那一刻，它都会被 Outlook 解释，而 Outlook 在发送之前会根据自己的解释更改 html。

有谁知道将字体堆栈（包括 Web 字体）添加到 html 签名的方法，从 MS Outlook 2016 发送，其中 Outlook 2013 和也许 2010 将采用正确的后备字体，而不仅仅是恢复为 Times New Roman？

编辑

以下是我目前未在签名文件中使用的代码示例，原因如下：

                <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans" />
                <td style="font-family:'Trebuchet MS', Arial, sans-serif; color:#000000; font-size:11px; mso-line-height-rule:exactly; line-height:95%;">
                    <span style="font-family: 'Open Sans', 'Trebuchet MS', Arial, sans-serif !important;">Text that should be displayed in Open Sans font, or Trebuchet MS as a fallback</span>
                </td>

如果使用第三方 smtp 客户端发送，此代码在 Outlook 中收到时，将忽略 span 元素中的字体堆栈，仅使用 td 元素中的字体堆栈。其他客户端将正确呈现 Web 字体。然而，不幸的是，当从 Outlook 中发送时，Outlook 在发送之前已经进行了转换。这意味着其他客户端永远无法选择并且只能看到后备字体。

4

2 回答 2

2

我感觉到你的痛苦。我每天都面临这个问题。我的公司品牌指南使用的网络字体在我们的网站上运行良好，但不能在 Outlook 或 Gmail 中呈现。我为这个问题创建了一个对你有用的解决方法。

对于 Outlook，它不完全支持 Web 字体。有些工作，有些不工作，它是命中注定的。我认为这是'Open Sans'导致问题的原因。当 Outlook 遇到问题时，它会恢复为 Times New Roman。具有讽刺意味的是，Times New Roman 是默认字体，名称中有空格，我并没有忘记。

Arial 是我们选择的备用字体，因此我专门为 Outlook 创建了一个样式表：

<!--[if (gte mso 9)|(IE)]>
<style>
  * {font-family: Arial, sans-serif !important;}
</style>

Gmail 根本不支持谷歌字体。所以 Open Sans 永远不会渲染。解决方案是在指定 Open Sans 后选择系统字体作为备用字体。在大多数其他电子邮件客户端中，一切都应该正常工作。

最后要记住的一件事是，无论您使用什么电子邮件客户端发送电子邮件，都将受到该客户端的限制。Outlook 限制了您发送电子邮件的能力，就像它限制了为您的收件箱呈现电子邮件的能力一样。

我对 Outlook 将删除的所有内容并不乐观，但这可能是您所面临的一些问题。即使我基于 Outlook，我也会尽可能使用其他服务发送电子邮件来克服这个问题。

祝你好运。

于 2017-10-04T17:08:34.530 回答
2

出于我的考虑，我继续进行了一些测试，以查看发送的代码发生了什么。当我们使用 Outlook 发送 HTML（作为电子邮件）时，Outlook 每次都会更改 HTML。

例如，当通过 Outlook 2013 发送以下代码时：

<table align="center" aria-hidden="true" border="0" cellpadding="0" 
cellspacing="0" role="presentation" style="max-width: 600px;" widdth="100%">
<tbody>
    <tr>
        <td style="font-family:Trebuchet MS,Arial,sans-serif; color:#000000; font-size:11px; mso-line-height-rule:exactly; line-height:95%;">
           <span style="font-family:Open Sans,Arial,sans-serif;">Text that should be displayed in Open Sans font, or Trebuchet MS as a fallback</span>
        </td>
    </tr>
</tbody>
</table>

它最终显示为：

<table class="MsoNormalTable" border="0" cellspacing="0" cellpadding="0" style="max-width:450.0pt">
<tbody>
<tr>
<td style="padding:0cm 0cm 0cm 0cm">
<p class="MsoNormal" style="line-height:95%"><span style="font-size:8.5pt;line-height:95%;font-family:&quot;Open Sans&quot;;color:black">Text that should be displayed in Open Sans font, or Trebuchet MS as a fallback</span><span style="font-size:8.5pt;line-height:95%;font-family:&quot;Arial&quot;,sans-serif;color:black">
<o:p></o:p></span></p>
</td>
</tr>
</tbody>
</table>

Outlook 实际上重写了大部分代码以展望 MS 认为正确的内容。现在您的问题是为什么 Outlook 2016 将文本显示为不是Times New Roman 是因为 Outlook 2013 添加了如下 CSS：

  @font-face
    {font-family:"Cambria Math";
    panose-1:2 4 5 3 5 4 6 3 2 4;}
  @font-face
    {font-family:Calibri;
    panose-1:2 15 5 2 2 2 4 3 2 4;}
  @font-face
    {font-family:"Open Sans";}
  p.MsoNormal, li.MsoNormal, div.MsoNormal
    {margin:0cm;
    margin-bottom:.0001pt;
    font-size:11.0pt;
    font-family:"Calibri",sans-serif;
    mso-fareast-language:EN-US;}

这可确保 Calibri 字体显示在安装了该特定字体的设备上。没有 Calibri 的 Outlook 将无法找到字体并显示默认字体 Times New Roman。

从上面的测试看来，Outlook 2016 似乎只是为了发送以 Calibri 为字体的电子邮件。我试图更改默认字体和主题，但它仍然在做同样的事情。

编辑：

您在上面提到的链接中错过了一件重要的事情，那就是!important在网络字体堆栈之后。以下代码是您应该发送的内容：

<table align="center" aria-hidden="true" border="0" cellpadding="0" 
cellspacing="0" role="presentation" style="max-width: 600px;" 
width="100%">
<tbody>
    <tr>
        <td style="font-family:Trebuchet MS,Arial,sans-serif; color:#000000; font-size:11px; mso-line-height-rule:exactly; line-height:95%;">
           <span style="font-family:Open Sans,Arial,sans-serif !important;">Text that should be displayed in Open Sans font, or Trebuchet MS as a fallback</span>
        </td>
    </tr>
</tbody>
</table>

添加重要标记后，Outlook 将忽略您拥有的完整字体堆栈，并且在重写代码时将字体系列中添加为 Arial，这意味着它现在应该正确显示字体。

<table class="MsoNormalTable" border="0" cellspacing="0" cellpadding="0" width="600" style="width:6.25in">
<tbody>
<tr>
<td style="padding:0in 0in 0in 0in">
<p class="MsoNormal" style="line-height:95%"><span style="font-size:8.5pt;line-height:95%;font-family:&quot;Arial&quot;,sans-serif;color:black">Text that should be displayed in Open Sans font, or Trebuchet MS as a fallback
<o:p></o:p></span></p>
</td>
</tr>
</tbody>
</table>

希望这就是你所追求的。

于 2017-10-04T10:41:35.770 回答