Как встроить шрифт в HTML-письмо

Question

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

В настоящее время у меня работает встраивание изображений с использованием метода cid, и оно работает нормально. Однако, если я использую тот же механизм для шрифтов, он не работает.

А именно:

@font-face
{
    font-family: Andale;
        src: url("cid:andale_location") format('woff2');
}

когда у меня есть где-то в MIME:

 Content-Type: font/woff2
 Content-Disposition: inline
 Content-Transfer-Encoding: base64
 Content-ID: <andale_location>

 d09GMgABAAAAAMEYAA4AAAABikAAAMC7AAE....

Когда я получаю электронное письмо с этим CSS (в заголовочный раздел HTML), и gmail, и outlook игнорируют часть font-face. Я получаю двоичное вложение в электронное письмо, но никаких шрифтов. Использование семейства шрифтов "Andale" вообще не работает.

Answer 1

К сожалению, мы не можем вставлять векторную графику (будь то шрифты или изображения) в электронную почту; почтовые клиенты очень плохо поддерживают это. Больше информации здесь: Изображение в кодировке Base64 не отображается в Gmail

Однако мы можем использовать @font-face для визуализации веб-шрифтов в некоторых почтовых клиентах , но не во всех. В зависимости от того, какие шрифты вы разрабатываете, вы можете указать стек шрифтов, который начинается с пользовательского шрифта и возвращается к аналогичным системным шрифтам. Что-то вроде:

font-family: Andale, Arial, sans-serif;

Письмо не будет соответствовать пикселю в каждом почтовом клиенте, но, может быть, это не обязательно? Дополнительная информация о типографии электронной почты, веб-шрифтах и ​​запасных вариантах .