Полезное

Шрифты в рассылках

Как сделать так, чтобы было красиво и ничего не слетало
Какие шрифты используют в имейл-рассылках
Есть перечень веб-сейф шрифтов («безопасных для веба»), которые предустановлены практически на всех устройствах и поддерживаются большинством сервисов.
В тексте письма рекомендуется использовать стандартные шрифты, чтобы не было проблем с отображением в любом почтовом сервисе.
Sans serif или без засечек:

Arial
Arial Black
Helvetica
Lucida
Sans
Tahoma
Trebuchet
MS
Verdana

Serif или с засечками:

Georgia
Times New Roman
Courier
Самый популярный кроссплатформенный шрифт с засечками — Times New Roman, а без засечек — Arial. Каждый из них также может иметь разное начертание (жирный, курсив).
Web-safe шрифты. Источник: Google Fonts
Где на вёрстке указывается шрифт?
Шрифт прописывается при вёрстке рассылки в коде в теге style при помощи команды font-family. Нужно указать название шрифта и его тип. Например:

<style>
   h1 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
   } 
   p {
    font-family: 'Times New Roman', Times, serif;
    font-style: italic;
   }
  </style>
Медиа-запросы в HTML-коде
Если вы верстаете письмо в HTML и хотите, чтобы текст в письме отображался нужным вам шрифтом, отличным от стандартных.

Примените на вёрстке медиа-запрос @import и укажите ссылку на постоянный файл со шрифтом. Так это выглядит в коде:

<style type="text/css"> 
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,900&subset=cyrillic'); 
p { 
font-family: 'Roboto', Arial, sans-serif; 
} 
</style> 
В параметре font-family должен быть прописан шрифт, который нужно использовать (в примере — Arial, sans-serif), если система не нашла желаемый шрифт (Roboto) или скачать его (не смогла обратиться за ним к стороннему файлу).

Если не задать это условие, пользователь увидит пустые квадраты вместо текста.
Media queries для российского сегмента сейчас поддерживаются всего в двух клиентах: mail.ru и gmail.com.
Подставляя свои шрифты c помощью медиа-запросов нужно понимать, что они сработают не во всех случаях. Даже если рассылку написать шрифтом Roboto, то он корректно будет отображаться только у подписчиков mail.ru и gmail.com.

А из-за моноширных шрифтов, которые не отобразятся у пользователя, может поехать вёрстка всего письма. Но вполне приемлемо использовать свой шрифт, который не сильно отличается по ширине от стандартных.
Настройки шрифта в блочном редакторе Mailganer
В разделе «Настройки» вы можете посмотреть, какой шрифт сейчас используется в вашей рассылке. По умолчанию для всех изначально выбирается Arial.
Как добавить свой шрифт в блочном редакторе
Шаг 1. Откройте вкладку «Содержимое», выберите блок HTML и добавьте его поверх всех остальных элементов.
Шаг 2. Кликните на новый HTML-элемент, чтобы открыть окно редактирования блока.
В нём нужно будет прописать код. Нужный стиль текста задаётся с помощью параметра <style>. Пример кода:

<style>
  @font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Roboto"),
       local("Roboto-Regular"),
       url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu5mxKOzY.woff2)
       format("woff2");
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
  * {
    font-family: "Roboto"!important;
}
  </style>
Звёздочка и условие !important перед закрывающим тегом означает, что шрифт применится ко всем элементам, которые встретятся в вёрстке ниже.

url = абсолютный путь к этому шрифту.
Когда убедитесь, что новые свойства шрифта применились к рассылке, закройте этот блок и нажмите «Сохранить».
Использование нестандартного шрифта в рассылке
По умолчанию в Mailganer можно использовать только стандартные шрифты. Это связано с защитой прав правообладателей шрифтов.

Если на рассылку поступит жалоба за нелицензионное использование шрифта, который был загружен на наш сервер, то она будет адресована платформе, через которую было отправлено письмо.

Чтобы снизить юридические риски, мы «разрешаем» использовать для обращения к шрифтам только ссылки, расположенные вне домена mailganer.

! Мы дорожим репутацией, и вас тоже призываем применять нестандартные шрифты только при соблюдении определённых условий.
Если вы используете нестандартные шрифты, то указывайте ссылку на официальный источник шрифта и убедитесь, что его владелец разрешает его свободное использование в рассылках.
Самый популярный открытый источник — Google Fonts. Именно к нему «обращаются» в большинстве случаев. Делают это с помощью медиа-запроса и постоянной ссылки на этот шрифт.
Можно ли использовать фирменный шрифт? Лучше оставить его для дизайна баннеров и других изображений. Текст в этом случае будет элементом картинки.
Если вы используете фирменный шрифт собственной разработки, то укажите ссылку на его постоянное расположение.
Если вам нужна помощь — напишите нам в поддержку на support@mailganer.ru или в онлайн-чате.