Шрифты для html рассылки

Как подобрать шрифт для email-рассылки

При выборе шрифта для письма нужно руководствоваться тремя параметрами: насколько легко читать текст, подходит ли оформление вашему бизнесу и распознается ли шрифт почтовым клиентом.

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

Какой шрифт должен быть в письме

Обычно подбирают 2-3 шрифта для текста и заголовков, чтобы письмо было легко читаемым, понятным и красивым.

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

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

Виды шрифтов для письма

Стандартные шрифты делятся на два типа: с засечками и без. В типографике считается, что длинный текст лучше писать с засечками, потому что легче воспринимается. А короткий – без засечек.

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

Выбирая, какой шрифт использовать в письмах, лучше руководствоваться тематикой рассылки и tone of voice бренда. Если у вас деловое издание, то подойдут сдержанные и нейтральные шрифты. Для магазина детской одежды, подарков или развлекательного блога можно использовать более неформальные.

Вариант справа больше подходит для развлекательного или детского контента, но не для делового издания 

В сервисах email-рассылок обычно есть несколько шрифтов на выбор. Например, в Sendsay ― 8 шрифтов, которые одинаково хорошо подходят для разных ниш. Но если вам нужен шрифт, которого нет в списке, можно перейти в HTML-редактор и настроить его вручную с помощью встроенных стилей CSS.

Безопасные шрифты для рассылки

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

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

К таким шрифтам без засечек относятся Arial, Helvetica, Verdana и Tahoma.

К вариантам с засечками относят Times New Roman, Georgia и Courier New.

Все эти шрифты относятся к системным. Это значит, что практически во всех операционных системах и почтовых клиентах есть настройки для их распознавания.

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

Если для дизайна рассылки требуется нестандартно оформленный текст, лучше сделать надпись на баннере или GIF, добавив alt-текст для читателей, у которых не отобразится картинка.

Магазин подарков активно использует нестандартные шрифты, оформляя все надписи картинками 

Больше крутых идей оформления электронных писем смотрите в нашей подборке.

Как подобрать размер шрифта для письма

У всех шрифтов разная высота и ширина букв, поэтому нельзя указать определенные требования к размеру шрифта в email-рассылках. Можно обозначить только примерные значения кегля:

• обычный текст – от 12 до 14 пунктов
• заголовки – от 14 до 20 пунктов
• названия – от 20 и до бесконечности

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

В теле письма чаще встречаются 13 и 14 размер кегля, а в заголовках – 16. Такие размеры шрифта Arial использует МИФ, чтобы текст было одинаково удобно читать с компьютера и смартфона.

Главред в рассылке использует Georgia, для названия кегель 25, для заголовков – 16, а для текста – 13

Коротко о том, как выбрать шрифт для письма

• для основного текста подбирайте привычные и легко читаемые
• для заголовков можно выбрать чуть более нестандартное написание
• необычные шрифты лучше использовать только на баннерах
• основные шрифты для письма – Arial, Helvetica, Verdana, Tahoma, Times New Roman, Georgia и Courier New
• при использовании других шрифтов обязательно делать тестовую email-рассылку на электронные адреса разных почтовых клиентов и просматривать с разных устройств
• оптимальный размер верстки текста – от 12 до 14 пунктов
• рекомендованный размер для заголовков – от 16 до 20 пунктов
• название в теле письма можно оформлять размером от 20 пунктов и более

Кроме того, мы делимся полезной информацией в сфере digital-маркетинга в нашем телеграм-канале, при подписке на который дарим книгу «Email-маркетинг для бизнеса». Подробнее о том, как ее получить, рассказали в закрепленном сообщении канала.

Подключайте Sendsay, чтобы сделать ваш email-маркетинг мощнее 💪

Источник

Какие шрифты использовать для email-рассылки

Придумать письмо – это только первый этап, нужно еще его качественно оформить. Ранее мы рассказывали о трендах в дизайне email-рассылок. Сегодня поговорим о шрифте для письма. Правильно подобранный шрифт, который гармонирует с общим дизайном сообщения, позволяет подписчику легко «сканировать» текст, следовательно, вы быстрее получите его отклик. Отображение шрифтов для получателей во многом зависит от возможностей устройства, на котором открывают сообщение.

Популярные шрифты для письма

Для начала нужно оговорить классы шрифтов:

• антиква (serif) – символы имеют точки, завитки, засечки на концах;
• гротеск (sans serif) – строгие прямые линии, без дополнений.

Давайте познакомимся с “безопасными” шрифтами – они правильно отображаются всеми почтовыми клиентами:

1. Times New Roman – антиква, был создан для великобританской газеты The Times. Шрифт занимает мало места и удобен для чтения, самый используемый в мире для официально-делового стиля. Возможно, из-за официальности его редко применяют в email-маркетинге.
2. Helvetica – неогротеск, широко распространен в Европе и США, в 2001 году в нем увеличено количество символов до 1866. Любимый шрифт многих дизайнеров, он нейтрален относительно других, но в нем недостаточное расстояние между глифами (элементы шрифта), поэтому текст смотрится сбитым.
3. Arial – гротеск, практически копирует Helvetica, наиболее распространен в мире. Это системный шрифт операционных систем Windows и MacOS, в то время как Helvetica предустановлена только на MacOS. При этом Arial легче, чем Helvetica.
   Почтовый сервис Apple Mail использует по умолчанию Helvetica, а Gmail — Arial, если браузер его не поддерживает – переходит на Helvetica. По данным Litmus Email Analytics, Apple Mail использует 11% аудитории по всему миру, а Gmail – 27%.
   В Arial и Helvetica символы имеют аналогичные элементы, которые отражены по вертикали или горизонтали. Поэтому некоторые буквы трудно отличить, например: b и d, p и q, – это замедляет чтение. Альтернативные варианты, которыми можно заменить эти шрифты: Georgia и Verdana.
4. Georgia – в стиле переходной антиквы. Шрифт с красивым курсивным полужирным начертанием и короткими засечками на концах символов. Отличительная черта – прыгающие цифры. Этот шрифт универсальный вариант: его используют как в официально-деловом стиле, так и в веб-дизайне.
5. Verdana – гротеск, разрабатывался специально для Microsoft с целью улучшить читаемость текста на экранах с низким расширением. Шрифт с достаточным просветом внутри символов, буквы открытой формы.
6. Tahoma – гротеск, очень похож на Verdana, но с полужирным начертанием. Имеет зауженные символы и узкий апрош (расстояние между глифами).
7. Trebuchet MS – гротеск, разрабатывался под те же требования, что и Verdana, но с незначительными изменениями символов: добавление/исключение некоторых деталей.
8. Courier – антиква, каждый знак имеет одинаковую ширину (моноширинный). Похож на шрифт печатной машинки, использовался во всех отраслях печатной промышленности, например, Госдепартаментом США вплоть до 2004 года (после заменен на Times New Roman). Courier New с более выраженными точками и запятыми. Этот шрифт, не очень подходит для email-рассылок, т.к. слишком широкий.
9. Palatino – антиква, создан для печати и прессы, основан на почерках итальянских мастеров эпохи Ренессанс. Символы близки к каллиграфическим.
10. Geneva – гротеск, редизайн Helvetica с дополнением базового набора лигатур.
11. Lucida Sans – гротеск, первый юникод-шрифт. Не рекомендуем использовать его для отображения текста кириллицей, т.к. эта версия достаточно слабая.

Эти шрифты можно считать лучшими для рассылок, так как они безопасные и удобочитаемые. Но можно создать свой личный шрифт, который будет даже привлекательнее самых популярных шрифтов! Кастомные шрифты нужны для создания индивидуального стиля конкретного бренда, это то, чего вы больше нигде не встретите. Собственные шрифты помогают выделиться среди конкурентов и выстроить устойчивые ассоциации с брендом у пользователя.

Кастомные шрифты используют такие компании, как: Apple, Nokia, IBM, BBC, Netflix и т.д. До недавнего времени нельзя было использовать собственные шрифты в email-рассылке. Теперь, в редакторе писем eSputnik появилась возможность добавления кастомного шрифта из других источников.

Как выбрать и использовать шрифты для email-рассылки

Какой шрифт выбрать для писем антиква или гротеск – здесь мнения категорически расходятся. Помните, что текст без засечек считается более удобным для чтения, если его открывают с десктопной версии. Но, например, Serif с засечками легко читается на экране мобильного устройства и может выглядеть интереснее, чем некоторые гротескные. Перечислим, на что следует обратить внимание при выборе шрифтов и работе с ними:

1. Используйте разныевиды шрифтов для письма. Но помните, что нагромождение большого количества шрифтов в одном email может сделать текст беспорядочным, поэтому ограничьтесь двумя-тремя, которые органично дополняют друг друга: например, один – для заголовка, второй – для всего текста, третий – декоративный для выделения важных деталей на баннере. Избегайте сочетаний, которые не подходят по стилю (например: Arial и Comic Sans).
2. Подобрать красивый шрифт для письма – это только полдела, обязательно проверьте шрифт на все необходимые вам начертания и глифы. Т.к. не все могут содержать необходимые символы. Чтобы не использовать их из других шрифтов, лучше сразу выбрать подходящий.
3. Декоративные шрифты лучше использовать только в отдельных элементах и в небольшом количестве. Они плохо читаемы в длинных текстах, и не факт, что правильно отобразятся у пользователя. Если уж сильно хочется добавить в письмо что-то такое-эдакое – используйте безопасные антиква шрифты для рассылки, которые мы описали выше. А для остальных, с засечками, – рекомендуем перестраховаться и прописать в коде письма, какой шрифт (из безопасных) использовать почтовому клиенту, если он не может отобразить выбранный вами вариант.
4. Выберите такой шрифт письма, который будет органически дополнять сообщение и подчеркнет корпоративный стиль. Странно писать о серьезных вещах используя Comic Sans, но если вы с клиентами достаточно близки – почему бы и нет? Comic Sans – это один из шрифтов, который часто поддается критике. Если вам очень нравится этот шрифт – не нужно делать всё письмо в этом стиле. Выделяйте заголовки или отдельные элементы.
5. Ссылки оформляйте тем же шрифтом, что и весь текст письма – не используйте “голые” ссылки только с анкорами. Выбирайте подходящие по тексту и смыслу словосочетания, прочитав которые пользователь сразу поймет, куда ведет ссылка. Не используйте для анкоров общие слова “здесь” или “ссылка”.

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

Для кнопок подойдут шрифты Georgia и Verdana.

Если вы используете кастомные шрифты, обязательно делайте предварительную рассылку на разные устройства, чтобы убедиться, что шрифт отображается у всех почтовых клиентов. В коде письма указывайте запасной шрифт. Это нужно делать для каждого текстового блока через свойство font-family. К примеру, font-family: Georgia, Verdana, Serif – это значит, что сообщение отобразится шрифтом Georgia, если его нет, то Verdana, если и его нет, то любым системным с засечками.

Большинство почтовиков используют HTML для отображения писем, поэтому необходимо следить, чтобы использовались правильные коды для шрифта и стиля. Зачастую безопасные шрифты уже прописаны в верстке CSS, но мы напомним несколько кодов:

• жирный шрифт:

Источник