26-го ноября 2018 года мы выпустили новую опцию — теперь с помощью Stripo вы можете добавлять пользовательские шрифты в проекты всего в несколько кликов без навыков HTML. Почему это важно?
Не секрет, что хороший текст дополняет дизайн письма и убеждает клиентов совершить покупку.
Обычно пользовательские шрифты применяются для придания текстовой части письма целостности бренда и привлекательности. А оформив его со шрифтом, который лучше всего соответствует ситуации и дизайну письма, вы делаете текст заметным и привлекательным. Таким образом, довольно часто веб-безопасных шрифтов бывает недостаточно.
В этом случае вам придется обращаться к пользовательским шрифтам.
Посмотрите короткое видео, в котором объясняется, как добавить пользовательские шрифты в Stripo. Обратите внимание, что данная функция доступна только для платных тарифных планов.
Большинство ESP и конструкторов писем предлагают только веб-безопасные шрифты, в то время как Stripo предлагает целых четыре набора:
Наборы шрифтов, которые предлагает Stripo
Stripo предлагает четыре набора шрифтов для ваших писем:
1. Стандартные/веб-безопасные шрифты
Arial, Comic Sans MS, Courier New, Georgia, Helvetica, Lucida Sans Unicode, Tahoma, Times New Roman, Trebuchet MS и Verdana — самые популярные шрифты, поскольку они широко используются на сайтах и корректно отображаются большинством почтовых клиентов.
2. Нестандартные шрифты
Об этих шрифтах некоторые специалисты до сих пор спорят, а именно: являются ли они веб-безопасными или нет. Однако они широко используются в интернете. Например, Playfair Display используется почти на 1.1 миллиарде сайтов, популярных в основном в США и Западной Европе.
Примечание: знаете ли вы, что можно уменьшить число стандартных и нестандартных шрифтов для своих проектов, если некоторые из них кажутся вам лишними?
Как убрать ненужные шрифты из списка:
-
зайдите в настройки проекта в своем аккаунте;
-
найдите вкладку Управление шрифтами;
-
кликните на кнопку переключения, чтобы удалить шрифт из списка.
3. Шрифты для баннеров
Они являются декоративными и могут применяться только к баннерам, поскольку любой текст, который вы разместите на баннерах, будет считаться элементом изображения. Следовательно, он будет правильно отображаться на всех устройствах, независимо от того, какой шрифт вы примените.
Stripo предлагает свыше 40-ка из них.
Список этих шрифтов вы видите только при работе с надписями на баннерах.
4. Пользовательские шрифты
В Stripo вы можете добавить абсолютно любой шрифт, который нравится.
Количество добавляемых шрифтов не ограничено.
После установки новых шрифтов примените их к меню и текстам — ко всем фрагментам в письмах, кроме баннеров.
Как добавить пользовательский шрифт в настройки проекта с помощью Stripo:
Еще раз хочу подчеркнуть, что это очень простой процесс, так как вам не нужно вносить никаких изменений в HTML-код письма. Еще одна приятная новость заключается в том, что вам не нужно устанавливать одни и те же новые шрифты для каждого шаблона письма, над которым вы работаете — вы устанавливаете их для целых проектов. Они будут доступны в списке во всех ваших кампаниях в рамках этих проектов.
Шаг 1. Google
Во-первых, вам нужно найти шрифт, который больше всего понравился. Мне пришелся по душе шрифт Great Vibes, который я нашла на Google Fonts. Помимо 1 000+ шрифтов Google также предлагает популярные парные сочетания с ними.
-
итак, вам нужно выбрать шрифт, проскроллить вниз до секции «Стили» и нажать на знак «плюс»;
-
далее нажмите на значок «Просмотреть выбранные семейства» в правом верхнем углу веб-страницы;
-
во всплывающем окне скопируйте ссылку — она выделена на скриншоте ниже.
Шаг 2. Stripo
Чтобы установить его в своем аккаунте Stripo, вам необходимо:
-
кликнуть на имя аккаунта в правом верхнем углу экрана;
-
выбрать «Настройки организации»;
-
слева вы увидите «Проекты» — нажмите на эту вкладку;
-
выберите проект, в который вы собираетесь добавить новый шрифт (у меня он только один);
-
кликните на кнопку «Настройки»;
-
проскролльте вниз, чтобы увидеть секцию «Управление шрифтами»;
-
кликните на кнопку «Добавить собственный шрифт» (у меня уже есть три таких шрифта);
-
во всплывающей форме укажите название шрифта, вставьте URL для встраивания и введите семейство шрифтов, заданное Google;
Примечание: для вашего удобства мы настоятельно рекомендуем указывать реальные названия загружаемых шрифтов.
-
после того как вы корректно заполните все поля, нажмите «Подключить».
Вы найдете новые шрифты в выпадающем списке при редактировании письма.
Как добавить пользовательские шрифты не от Google в настройки проекта с помощью Stripo
Если вы не смогли найти подходящий вариант в Google Fonts, не волнуйтесь! Вы можете добавить любой пользовательский шрифт в свой аккаунт Stripo, загрузив ссылку на него.
Вы также можете использовать лично созданные шрифты:
-
загрузите файлы шрифтов в открытое облачное хранилище или на платформу обмена файлами;
-
убедитесь, что файлы доступны для просмотра, чтобы пользователи могли их увидеть;
-
добавьте заголовок Access-Control-Allow-Origin к файлам шрифтов, чтобы избежать их блокировки браузером;
-
добавьте ссылки в свой аккаунт Stripo описанным выше способом. Убедитесь, что ваши ссылки начинаются с "https" и не заключены в кавычки.
Вот пример того, как добавить пользовательский шрифт в аккаунт Stripo с помощью Adobe Fonts:
-
перейдите на страницу Adobe Fonts;
-
выберите понравившийся шрифт и нажмите кнопку </>;
-
введите название своего проекта;
-
выберите начертание и стиль шрифта;
-
нажмите кнопку «Создать»;
-
скопируйте ссылку;
-
выполните описанные выше шаги, чтобы добавить этот шрифт в свой аккаунт Stripo.
Примечание: если вы хотите использовать шрифты из Adobe Fonts, то без подписки Creative Cloud не сможете этого сделать.
Как применять пользовательские шрифты в письмах
Вы можете использовать любой понравившийся шрифт в текстовых блоках и меню, чтобы сделать свои письма живыми и уникальными. Но не забудьте проверить их на совместимость с ведущими почтовыми клиентами.
Примечание: если почтовый клиент не поддерживает выбранный вами шрифт, то на его место установится шрифт по умолчанию (большинство почтовых клиентов имеют два дефолтных шрифта).
Stripo не только настоятельно рекомендует вам тестировать письма/шрифты с помощью Email on Acid или Litmus, но и разослать это письмо на все ваши адреса электронной почты, чтобы увидеть, как выглядит выбранный шрифт в реальности.
Для своего теста я выбрала шрифт Alumni Sans. Наш инструмент тестирования писем показал, что большинство устройств и почтовых клиентов заменяют этот шрифт на шрифт по умолчанию. На скриншотах ниже видно, что Apple Mail правильно отображает шрифт Alumni Sans, а Outlook 2019 заменил его на стандартный.
Почтовые клиенты, поддерживающие пользовательские шрифты в письмах
Их всего несколько:
-
Apple Mail (стандартный шрифт — Helvetica);
-
Apple iPhone (стандартный шрифт — Helvetica);
-
Thunderbird (стандартный шрифт — Impact);
-
приложение Outlook для Android, iOS и Mac (стандартный шрифт — Calibri);
-
родное почтовое приложение Android (стандартный шрифт — Roboto).
Примечание: вы не можете быть до конца уверены, что ваш пользовательский шрифт будет поддерживаться этими почтовыми клиентами, поэтому очень важно протестировать свое сообщение перед его отправкой.
Выбирая новый шрифт для писем, помните:
-
Только некоторые почтовые клиенты поддерживают пользовательские шрифты.
-
Шрифты Sans-serif обеспечивают более легкое восприятие и больше подходят для формальных текстов и деловых рассылок.
-
Людям с нарушениями зрения и дислексией требуется больше времени, чтобы прочитать текст, написанный шрифтом serif, однако он лучше подходит для промо-писем.
-
Для HTML-писем оптимальным размером шрифта является 14 px, а для мобильных устройств — 16 px.
-
Чтобы сделать ваши письма доступными, избегайте белого фона и отцентрированных текстов.
-
В своем аккаунте Stripo вы можете добавлять новые шрифты и удалять те, которые не используете для конкретных проектов.
В завершение
Пользовательские шрифты могут стать отличным инструментом для того, чтобы ваши письма выглядели профессионально и узнаваемо, но крайне важно тестировать свои сообщения перед их рассылкой. Добавьте декоративные шрифты в свой аккаунт и используйте их для придания пикантности шаблонам рассылки.
8 комментариев