Размеры электронной почты: идеальные размеры для ваших шаблонов [2022]

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

Ну, краткий ответ - да. Длинный ответ немного сложнее. Однако не беспокойтесь, потому что мы рассмотрим все, что вам нужно знать об идеальных размерах и о том, сколько пикселей (px) они должны иметь для правильного рендеринга.

Чтобы дать вам представление, сегодня мы рассмотрим основные размеры, в том числе:

• Ширина и высота шаблона
• Размер файла кампании
• Заголовок письма
• Контентные блоки и футер

Без лишних слов, давайте посмотрим на них!

Размеры шаблона электронной почты: обзор

Если вы спешите узнать оптимальные размеры для своих информационных бюллетеней , вы можете проверить таблицу ниже:

А теперь давайте рассмотрим их более подробно!

Размер электронной почты — анатомия элемента

Вот пример рассылки по электронной почте и элементы, которые мы рассмотрим:

Эта кампания имеет ширину 664 пикселей и высоту 2549 пикселей. Дизайн электронной почты хорошо отображается как в почтовых ящиках Gmail, так и в Outlook, а также корректно отображается на мобильных устройствах. Что касается размера файла, то он составляет 57,8 КБ, что находится в пределах идеального размера.

Прежде чем мы продолжим, имейте в виду, что ваш дизайн может отображаться по-разному в зависимости от разрешения и размера экрана ваших подписчиков. Итак, теперь, когда мы знаем, что будем исследовать, давайте начнем изучать эти «идеальные» размеры один за другим!

Лучшие размеры электронных писем: ширина, высота и вес

Начав с важнейших размеров HTML-шаблона электронной почты , давайте выясним оптимальную ширину, высоту и «вес», необходимые для избежания проблем с популярными почтовыми клиентами, такими как Gmail, Outlook.com, Yahoo Mail и другими.

Ширина электронной почты

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

Ну нет. Хотя стандартная ширина шаблона электронной почты составляет 600 пикселей, вы можете использовать более широкие шаблоны. Причина этого в том, что сегодняшние почтовые клиенты намного более продвинуты, чем в прошлом. Таким образом, отображение более широких шаблонов больше не является проблемой.

Тем не менее, хотя вы можете поэкспериментировать с шириной, вы должны знать, что Gmail может не отображать фоновые цвета для макетов размером более 640 пикселей. Это может стать проблемой для ваших кампаний, поэтому самый простой способ избежать этого — использовать макеты с максимальной шириной 640 пикселей .

Ниже вы можете увидеть сообщение электронной почты от Apple шириной 736 пикселей:

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

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

Высота электронной почты

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

Вы можете «сходить с ума» с таким размером электронного письма, но помните, что ваш подписчик должен быть в состоянии переварить сообщение, не прокручивая его до бесконечности, чтобы добраться до сути!

В идеале ваш шаблон должен иметь размер от 1500 до 3000 пикселей . Если вы считаете, что 3000 пикселей — это немного, давайте посмотрим на реальный пример от The Citizenry:

Приведенный выше пример имеет высоту 2230 пикселей, которую подписчики могут проверить через несколько прокруток.

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

Таким образом, высота 2000-25000 пикселей лучше, чем когда ваш получатель прокручивает бесконечный шаблон, чтобы добраться до вашего CTA!

Вес электронной почты

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

Как правило, вы хотите создавать сообщения, которые без проблем попадут в папку «Входящие» ваших подписчиков. Спам-тема обычно является причиной срабатывания спам-фильтров. Но знаете ли вы, что размер файла вашей электронной почты также может быть причиной плохой доставки электронной почты?

Чтобы избежать этого, вы должны поддерживать небольшой «вес» электронной почты. Это означает, что у вас должны быть кампании по электронной почте с телом, которое будет между 20 и 102 КБ .

Вот три быстрых способа избежать проблем с рендерингом:

• Стремитесь к максимальному размеру файла электронной почты 102 КБ.
• Используйте визуальные элементы (GIF, изображения) с умом
• Оставьте большие вложения

Вырезка из папки "Входящие"

Но что произойдет, если размер вашей электронной почты превышает 102 КБ? Что ж, если вы отправите его на адрес Gmail, почтовый клиент обрежет ваше сообщение .

Обрезка электронной почты происходит, когда кампании превышают максимальный размер файла. В результате Gmail скроет или «обрежет» вашу кампанию, и подписчикам нужно будет выбрать опцию «Просмотреть все сообщение», чтобы проверить его.

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

Решение простое: размер ваших электронных писем не должен превышать 102 КБ (75 КБ просто идеально)!

Размеры элементов кампании по электронной почте

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

Предзаголовок электронной почты

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

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

Вот пример от Sigma Beauty:

Итак, насколько большим должен быть ваш прехедер?

Когда дело доходит до ширины, ваш прехедер будет такой же ширины, как и остальная часть вашей кампании. Однако высота должна быть где-то между 20 и 60 пикселями .

Заголовок электронной почты

Переходим к одному из самых важных элементов вашей кампании — заголовку электронного письма! Как вы могли заметить, у кампаний могут быть разные размеры заголовков писем. Давайте посмотрим несколько примеров.

Вот один от Венделла Августа Форджа:

(600×98 пикселей)

И один от The Blonde Abroad:

(600×255 пикселей)

Оба заголовка имеют одинаковую ширину 600 пикселей. Однако, когда дело доходит до высоты, второй имеет высоту 255 пикселей.

В то время как меньший заголовок, такой как у Wendell August Forge, идеально подходит как для настольных компьютеров, так и для мобильных устройств, наличие немного более высокого заголовка не будет проблемой (если вы сначала протестируете его!). Как правило, заголовок вашей рассылки по электронной почте должен иметь высоту около 60–70 пикселей . Однако, если ваш логотип содержит дополнительные элементы или меню, он может достигать 200 пикселей .

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

Блоки содержимого электронной почты

Теперь давайте посмотрим на размеры электронных писем ваших блоков контента. Эти блоки могут иметь что угодно, от копии электронной почты и изображений до GIF-файлов, видео и CTA!

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

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

Ниже вы найдете маркетинговую кампанию по электронной почте Джулии Бланнер с тремя блоками контента:

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

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

Итак, теперь мы можем сделать вывод, что:

• Каждый блок контента должен быть высотой около 200-300 пикселей .
• Общая высота ваших блоков контента должна быть 800-1200 пикселей .

Размер нижнего колонтитула электронной почты

И последнее, но не менее важное: у нас есть нижние колонтитулы вашей кампании по электронной почте , где вы можете найти социальные сети и кнопки отказа от подписки, ссылки на веб-сайты и многое другое.

Как и в случае с заголовками, нижние колонтитулы могут различаться по длине в зависимости от ваших целей. Например, размер нижнего колонтитула Modcloth составляет 600 пикселей в ширину и 361 пиксель в высоту:

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

Имея это в виду, идеальный размер нижнего колонтитула электронной почты должен составлять около 100 пикселей . Если вам нужно добавить больше элементов, таких как ссылки на веб-сайты, убедитесь, что общая длина не превышает 300 пикселей .

Дополнительные размеры компонентов электронной почты

Помимо предварительного заголовка, заголовка, блоков контента и нижнего колонтитула, вы должны учитывать свои баннеры, кнопки CTA и размеры изображений. Посмотрим!

Электронный баннер

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

Например, вот пример баннера от Velasca:

Баннер бренда содержит всю необходимую информацию для привлечения внимания подписчика . У него есть свой логотип, четкий текст, графика и кнопка призыва к действию. Кроме того, с точки зрения размера приведенный выше пример имеет ширину 600 пикселей и высоту 612 пикселей, что вполне идеально, исходя из следующих данных.

В частности, согласно Swift Digital, рекомендуемый размер баннера должен быть:

• 600–700 пикселей в ширину (320–385 пикселей для мобильных устройств)
• 1730 пикселей в высоту

Кнопки призыва к действию

Маркетологи электронной коммерции обычно добавляют красочные кнопки CTA, чтобы побудить потенциальных клиентов к действию. Маркетологи B2B, с другой стороны, могут добавить гиперссылку, чтобы направить своих подписчиков на их веб-сайт или целевые страницы.

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

• Средняя высота CTA составляет 47,9 пикселей .
• Apple предлагает высоту 44 пикселя .
• Средний призыв к действию состоит из 14 символов .

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

В Kings Theater есть очень простая кнопка размером 122,4 x 41,51 пикселей:

С другой стороны, Волшебный мир выбирает более заметный CTA шириной 300 пикселей и высотой 60 пикселей:

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

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

Размер изображения по электронной почте

Во-первых, самые популярные форматы файлов изображений, читаемые почтовыми браузерами, включают старые добрые JPG (или JPEG), PNG и GIF . Но как насчет размеров? Что ж, по ширине ваши изображения будут соответствовать заданному размеру шаблона. Итак, если у вас установлена ​​ширина 640 пикселей, ваше изображение будет соответствовать этому примеру.

Тем не менее, по длине вы должны сначала рассмотреть цель вашего изображения. Если используются как баннеры, то они должны быть в пределах 800-1730 пикселей. Точно так же, если вы используете их в качестве изображений для информационных бюллетеней, вы должны увеличить размер до 1200 пикселей. Тем не менее, нет стандартных размеров изображений электронной почты, которым вы должны следовать.

Когда дело доходит до качества, вы должны использовать разрешение 72 dpi , чтобы повысить общую производительность ваших визуальных эффектов! И не забудьте оптимизировать изображения для дисплеев Retina (iPhone, iPad и т. д.)!

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

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

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

Лучшие размеры электронных писем для создания шаблонов

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

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

Имея это в виду, пришло время создать рассылку рассылок по электронной почте лучшего размера для вашего бизнеса!

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