5 примеров электронных писем, оптимизированных для мобильных устройств
Опубликовано: 2016-11-03Мы, маркетологи, привыкли к мысли, что, оптимизируя нашу электронную почту для мобильных пользователей, мы можем дать нашим кампаниям преимущество перед конкурентами. Увы, время шло, и дело в том, что теперь мы должны создавать оптимизированные для мобильных устройств варианты электронной почты как само собой разумеющееся.
Несколько лет назад мы достигли переломного момента, когда смартфоны обогнали настольные компьютеры в качестве устройства, наиболее часто используемого для чтения электронной почты. Совсем недавно отчет о предпочтениях устройств Movable (2015) показал, что феноменальные 52% электронных писем открываются на смартфонах, при этом на настольные компьютеры приходится всего 32%.
Слишком легко попасть в ловушку создания электронных писем в первую очередь для пользователей настольных компьютеров - по всей вероятности, вы используете настольный компьютер, чтобы собрать их самостоятельно. Пришло время избавиться от этого устаревшего мышления и поставить на первое место мобильные устройства, а затем настольные компьютеры.
В этой статье мы обсудим 5 вдохновляющих примеров электронной почты, оптимизированной для мобильных устройств, и все они были тщательно разработаны для увеличения конверсии. Мы включили несколько полезных советов, чтобы вы могли воспроизвести идеи, представленные в ваших собственных кампаниях.
HolidayPirates - основные принципы
Мы решили начать с этого письма по одной причине: оно безошибочно предназначено в первую очередь для мобильных устройств.
Это единственный момент, который мы категорически настаиваем на том, чтобы вы убрали его и поместили в основу своей стратегии электронного маркетинга. Почему? Во-первых, потому что мобильные устройства являются наиболее широко используемым типом устройств для открытия электронной почты, и большинство из них все еще растет из года в год; и во-вторых, потому что гораздо проще использовать оптимизированный для мобильных устройств дизайн в качестве основы, а затем встраивать дополнительные элементы для более крупных устройств, чем делать наоборот.
[mailchimpsf_form access = ”web” title = “Чтобы получить больше подобных подпишитесь на нашу рассылку новостей”]Соотношение визуальных элементов к копированию
Мы можем сказать, что это электронное письмо было разработано в первую очередь для мобильных устройств, просто посмотрев, сколько слов на странице, то есть не очень много.
Добавление большого количества копий в электронное письмо обычно отрицательно сказывается на мобильных конверсиях. В электронной почте HolidayPirates копия ограничена тремя строками на элемент контента в мобильной версии (копия плюс кнопка CTA примерно равны по занимаемому месту их сопутствующему изображению); в то время как в настольной версии одна и та же копия может занимать чуть более одной строки, действуя более или менее как заголовок для изображения. Если бы это электронное письмо было разработано в первую очередь для настольных компьютеров, мы могли бы увидеть дополнительную копию в вариантах с большим размером экрана и сокращенные версии (или, что еще хуже, слишком много копирования и горизонтальную прокрутку) для небольших устройств.
Множество привлекающих внимание кнопок с призывом к действию
Если вы когда-либо читали об оптимизации коэффициента конверсии, вы знаете, сколько можно получить, стратегически разместив кнопки CTA на своих веб-страницах.
CTA или кнопки с призывом к действию представляют собой ссылки в виде изображений, в которых используется дизайн кнопки с обязательным текстом (например, «Купить сейчас», «Зарегистрируйтесь бесплатно», «Подробнее»). HolidayPirates использует здесь кнопки CTA для перехода на контент на своем веб-сайте.
На скриншоте выше для мобильной версии вы можете увидеть только один из элементов контента, представленных в электронной почте HolidayPirates. Это связано исключительно с объемом места, которое имеется в нашем распоряжении здесь, в этой статье, и фактически в электронное письмо включены десять пунктов назначения, каждое со своим изображением, копией и кнопкой CTA «Показать сделку».
Использование CTA в ваших электронных письмах широко признано как лучший способ заставить мобильных пользователей переходить туда, куда вы хотите. Вот несколько советов, как сделать ваши призывы к действию суперэффективными:
- Сделайте их большими и относительно яркими - если вы когда-либо пытались поразить маленькую непонятную цель большим пальцем во время просмотра на своем телефоне (или в другом, странном контексте), вы поймете, почему важно выделять ваши CTA. Это также сделает ваши призывы к действию более привлекательными.
- Окружите их пробелами - по тем же причинам.
- Сделайте призыв к действию четким и кратким - скажите в двух или трех словах.
- Ссылка на удобный для мобильных устройств контент - нет смысла направлять мобильных пользователей на сайт, враждебный для мобильных устройств.
Что мы узнали до сих пор
Из этого единственного маркетингового письма мы определили три ключевых момента - назовем их первыми принципами - по электронному маркетингу:
- Дизайн в первую очередь для мобильных устройств
- Будьте осторожны с копией
- Используйте CTA для ссылок
Для нас это самые важные факторы, которые необходимо учитывать при создании маркетинговых писем. Теперь мы рассмотрим еще четыре письма, которые интересны и наводят на размышления для мобильных пользователей:
PayasUgym - встраивание в мобильную деятельность
Зачем останавливаться на том, чтобы сделать вашу электронную почту совместимой со смартфонами, если вы можете использовать ее как средство для внедрения вашего бренда в повседневную мобильную деятельность получателя?
Вот раздел одного электронного письма от службы поиска фитнес-классов и тренажерного зала с оплатой по факту, которая делает именно это и дает отличный эффект.
- «Найдите свой следующий» - подзаголовок знакомит с проблемой получателя, прокладывая путь для бренда, чтобы предложить свое решение.
- Графика в стиле маркера карты - обратите внимание на графику в верхней части скриншота, где показаны номера спортзалов, классов и бассейнов. Использование графики в стиле маркера карты здесь является умным решением, поскольку оно напоминает значки, используемые в чрезвычайно популярных приложениях, таких как Google Maps и Uber, что красиво ведет к ...
- Баннер приложения - этот баннер с призывом к действию поддерживает свое приложение Get the app! сообщение с информативными, повышающими доверие кнопками Apple App Store и Google Play. Баннер большой, привлекательный и окружен пробелами.
Это электронное письмо является образцовым примером того, как позиционировать ваш бренд как поставщика мобильных решений для решения проблемы потребителя. Структура его сообщения неотразима: «Мы понимаем, что вам нужно; мы действительно хорошо подготовлены, чтобы дать вам это; нажмите на эту понятную, простую и надежную ссылку для скачивания, и мы решим проблему за вас сейчас и всякий раз, когда вам это понадобится в будущем ». Бренд очень эффективно зарекомендовал себя, чтобы выполнить определенную роль в мобильной деятельности пользователя.
Независимо от того, выполняет ли ваш бренд свою онлайн-роль через приложение или веб-сайт, оптимизированный для мобильных устройств, вы можете воспроизвести подход PayasUgym в своих маркетинговых электронных письмах. Попробуйте включить CTA в аналогичную структуру:
- Используйте подзаголовок, чтобы описать проблему, например: «Хотите найти новый стиль?», «Нужна новая книга?»
- Определите свой авторитет / диапазон / качество / ценностное предложение. Тонко включайте графические элементы, имитирующие элементы приложений или электронной коммерции (например, маркеры карты PayasUgym).
- Добавьте баннер с призывом к действию, используя описанные ранее методы. Это может быть ссылка на загрузку приложения или другой цифровой аспект вашего бизнеса, который может сыграть полезную роль для клиента.
American Apparel - подготовка к жизни в папке Junk
Каждому маркетологу электронной почты, несомненно, нравится представлять, как их послания попадают в почтовые ящики получателей и прямо в верхнюю часть списка, но дело в том, что многие почтовые клиенты ваших получателей будут рассматривать ваши сообщения как ненадежные или нежелательную почту.
Получатели по-прежнему смогут просматривать это сообщение, но в некоторых случаях контент, особенно изображения и другие мультимедийные материалы, не будет отображаться. Принимая во внимание высокое соотношение изображений и копий, используемое в большинстве удобных для мобильных устройств почтового маркетинга, это может означать, что получатель пропустит ключевые крючки в вашем письме, когда он пролистывает свою папку нежелательной почты.
У этой проблемы нет полностью удовлетворительного решения, но вы можете повлиять на ограничение ущерба, используя атрибут изображений, используемых в ваших электронных письмах: их теги alt.
Обратите внимание на два скриншота выше. Оба показывают одно и то же письмо от модного ритейлера American Apparel. В версии слева включены изображения, а на изображении справа показано, как то же письмо выглядит с отключенными изображениями. Изображение справа может выглядеть не так хорошо, но ему удается передать основную цель письма: «Мы скучаем по тебе. Скидка 20%! » Эти слова не взяты из раздела копии, заключенного в теги <p>; они берутся из атрибутов тега alt изображений, которые были скрыты.
Повторяя маркетинговые приемы электронного письма в атрибутах тегов alt ваших изображений, вы можете повысить вероятность того, что получатель получит ваше основное сообщение в текстовой форме, даже если изображения отключены.
Как правило, мы всегда рекомендуем уделять время написанию эффективного альтернативного тега для любого изображения, которое вы планируете опубликовать в Интернете. Альтернативные теги не только помогают донести ваши маркетинговые сообщения электронной почты до большего числа получателей, они также имеют фундаментальное значение для работы в Интернете людей с ослабленным зрением и могут помочь вашим изображениям занять высокое место в результатах поиска изображений.
Trainline - быстрый путь к рейтингам
Отзывы клиентов - ценный ресурс для маркетологов, которые хотят определить лучший способ продвижения своих почтовых кампаний. Это особенно эффективно при использовании в контексте сплит-тестирования, как мы и ожидали, это было в случае с показанным выше разделом звездного рейтинга, найденным в электронном письме от TheTrainline.com.
В этом разделе обзоров нет ничего особенного - и именно поэтому он нам нравится. Пользователь нажимает на одну из звездочек, чтобы оценить письмо по пятибалльной шкале. Простота дизайна сделает оставление отзыва более управляемым для мобильных пользователей, которых могут оттолкнуть более скучные задачи, такие как написание комментариев.
Но как насчет отсутствия подробной обратной связи? Что ж, мы предполагаем, что два или более варианта этого письма, вероятно, будут разосланы разным аудиториям, а общие рейтинги, предоставленные получателями, будут использоваться создателями письма, чтобы определить, какой из вариантов был наиболее эффективным.
Многовариантное тестирование может использоваться для определения того, какой тип темы письма работает лучше всего, какие предложения или продукты следует продвигать в электронном письме, как различные типы контента могут повлиять на взаимодействие с пользователем и т. Д. Собранная информация может использоваться сама по себе или для подтверждения выводов, сделанных путем анализа открытых электронных писем и данных взаимодействия.
NatWest
Ключ к влиянию этого письма - с точки зрения дизайна - это привлекательная копилка в верхней части экрана. Важно отметить, что на мобильном телефоне, планшете или компьютере он выглядит красиво и четко.
Разработчики электронного письма достигли этого, установив алгоритм бикубической интерполяции для масштабирования изображения, что было достигнуто путем установки части атрибута стиля изображения на «-ms-interpolation-mode: bicubic». Это делает изображение «жидким».
Есть различные способы добиться этого эффекта, большинство из которых менее технически звучат, чем описанные выше. Попросите своих разработчиков проверить, включает ли ваш шаблон электронной почты бикубическую интерполяцию или другой механизм масштабирования изображения, прежде чем вы начнете отправлять электронные письма. Просто сделать ваши изображения достаточно большими, чтобы они выглядели резкими на всех устройствах, проблематично, поскольку для мобильных пользователей может потребоваться горизонтальная прокрутка - именно этого мы стараемся избегать.
получите бесплатное членство сейчас - кредитная карта не требуется
БЕСПЛАТНОЕ ЧЛЕНСТВО 