Горизонтальные емейлы для мобильных устройств

Горизонтальный емейл, который представлен ниже, StyleCampaign отправили в марте 2011. Он принес им наилучший показатель CTR за последние два года!

Испуганные недоумевающие пользователи не станут использовать горизонтальную прокрутку? Бросьте! Емейл шириной 948px занимает 4 экрана IPhone и вот показатели кликов по ссылкам на страницах: 44% / 30% /14% /12%. Причем с мобильных устройств это сообщение открыли 20% подписчиков.

емейлы для мобильных устройств

Распакуй его!

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

Идея довольно проста: делаем отдельный блоки приблизительно по 320px шириной — маленькие странички письма. На каждой из них в нужное место ставим специально подобранные элементы дизайна (кнопки, стрелки и т.п.), чтобы пользователю хотелось нажать на них и таким образом прокрутить письмо до конца.

Panorama

Я был очень рад узнать, что Windows Phone 7 стал поддерживать горизонтальную прокрутку.

«Приложения Panorama — это часть ядра Windows Phone OS 7.0 Они предоставляют пользователю уникальный интерфейс и способы просмотра изображений, благодаря технологии горизонтальных холстов, буквально выходящих за пределы экрана».

емейлы для мобильных устройств

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

Разрешение экрана Windows Phone 7 составляет 480 на 800px. А ширина Panorama равна 2100px. Это в точности соответствует максимальной горизонтальной прокрутке, которая поддерживается в Outlook 2007.

емейлы для мобильных устройств

Привлекательное содержание

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

Ширина IPhone 3GS равна 320px, поэтому сделаем каждый слайд нашего письма шириной 300px. Каждая следующая страничка будет чуть-чуть выглядывать из-за границы экрана. В этом случае, получатель интуитивно понимает, как просмотреть письмо полностью.

Говорите, Outlook 2007 поддерживает прокрутку в 2100px? Ок, без проблем! Можем создать 6-7 таких «экранов».

Горизонтальные письма отлично работают в fashion-индустрии. Мы взяли фотографии из свадебного каталога Victoria’s Secret, добавили контент и ссылки на видео (обратите на них внимание). Получилось красиво и стильно!

емейлы для мобильных устройств

Постраничные индикаторы

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

емейлы для мобильных устройств

Стандартный индикатор внизу показывает, сколько страничек еще можно посмотреть.

Скроллинг

Когда вы загружаете емейл через IPhone, на несколько секунд появляется полупрозрачная серая панель — индикатор прокрутки. Он показывает насколько длинное письмо, и в какую сторону можно проскроллить содержимое.

Если бы письмо от Adidas было шире, то индикаотр прокрутки соответственно был бы уже. Но в любом случае по картинке мы видим, что письмо можно пролистать вправо.

емейлы для мобильных устройств

Стрелки

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

Вот один из возможных вариантов:

емейлы для мобильных устройств

Итак, вы можете попробовать внедрить похожие макеты или использовать креативы шириной 320px и 400px. Может быть, в две колонки или узкие, с версткой на стилях. А возможно просто пошлете набор красивых открыток — в любом случае решать вам! Узнайте реакцию подписчиков на новый современный макет. Дерзайте!

Источник: www.stylecampaign.com
Array
(
    [0] => WP_Term Object
        (
            [term_id] => 1425
            [name] => Статьи
            [slug] => articles
            [term_group] => 0
            [term_taxonomy_id] => 1907
            [taxonomy] => category
            [description] => 
            [parent] => 0
            [count] => 662
            [filter] => raw
            [cat_ID] => 1425
            [category_count] => 662
            [category_description] => 
            [cat_name] => Статьи
            [category_nicename] => articles
            [category_parent] => 0
        )

)
Поделиться статьёй
Подписаться на рассылку