В начале была почта, или маркетинг в почтовом ящике

Дизайн, копирайт, идеи для правильных рассылок. Блог Почтового Куба

05.07.2007

Основы дизайна электронной почты

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

Размер имеет значение

Письмо должно хорошо смотреться в preview-панели Outlook, шириной около 200 пикселей. Если вы сделаете дизайн фиксированной ширины 550 — 600 пикселей, то избежите проблем с отображением в большинстве почтовых клиентов.

Что касается «высоты» письма, то не стоит делать письма слишком длинными — лучше поставить ссылку на полный текст на сайте. Люди не привыкли много времени проводить «в почте» и скорее всего не дочитают ваше письмо дальше третьего «экрана».

Картинки… картинок не будет

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

Нельзя использовать картинки для важного содержания — заголовков, текста.
И пропишите alt у картинок – некоторые почтовые клиенты покажут его на месте картинок.

width и height

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

HTML, нельзя CSS

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

Добро пожаловать в 90-е ;)

 А если старый добрый html не позволяет реализовать ваш творческий замысел без css, то расположите копию письма на сервере и поставьте в письме (в первых строках) ссылку на эту веб-версию письма.

Ссылку на веб-версию письма нужно поставить в первых строках письма.

 

Flash и JavaScript: сразу «нет»

Единственное, что останется от ваших flash-роликов и javascript-кодов в почтовой программе клиента — это предупреждение системы безопасности. Поэтому вместо flash-ролика вставьте в письмо один кадр из него (в виде обычной картинки). Флэш и яваскрипт положите на страницы, куда пользователь попадет по ссылкам из письма.

Идеи для вдохновения 

Единственная галерея email-дизайна: www.campaignmonitor.com/gallery (на английском)
Несколько хороших писем среди победителей MarketingSherpa Email Award

Еще несколько советов. Не про верстку и графику, но тоже про дизайн:

Вложенные файлы: скорее «нет», чем «да»

Хотя запрета на вложенния никто не вводил, это считается «дурным тоном». Уже на курсах «пользователей ПК» людей учат никогда не открывать вложения в почте, если не уверен на 100% в надежности отправителя. Некоторые рассылки заранее предупреждают, что они никогда не отправляют вложения — и это «хороший тон».

Unsubscribe: обязательно

В каждом письме должна быть информация о том, как перестать получать рассылку. Отписка не должна быть сложной процедурой. Идеальный вариант — ссылка, позволяющая отписаться «в одно нажатие»: нажал ссылку и перестал получать письмо. Не заставляйте получателя входить в свой «аккаунт» или «личный кабинет», чтобы «изменить параметры подписки».
Кстати, слово «отписаться» звучит не очень… «Прекратить подписку», «удалить адрес из рассылки» – длинее, но благозвучнее.

Проситесь в адресную книгу

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

Поэтому просите получателей внести ваш адрес в адресную книгу.

Первые строки

Outlook и Gmail показывают в списке входящей почты первые строки письма. Учитывайте этот фактор и кладите в начало письма значимый текст.

Так Outlook 2003 показыет первые строки письма

Subject и From

Если тема письма не заинтересует получателя, он, скорее всего, не прочтет письмо. Поэтому подумайте над темой. Главное правило — заголовок должен описывать содержание письма.

В поле From, как правило, ставят название компании. Однако, некоторые добиваются неплохих результатов, указывая имя менеджера компании.

Не только HTML, но и text/plain

Считается, что письмо должно иметь plain-text версию. Во-первых, текстовая версия письма отображается у некоторых клиентов, у которых нет графического интерфейса (мобильный телефон, терминал unix). Во-вторых, некоторые фильтры спама больше доверяют таким письмам, потому что спамеры пока не делают plain-text версий.

Не все слова разрешены

Использование некоторых слов может резко ухудшить ваши отношения со спам-фильтрами. Напишите в тексте несколько раз слова «бесплатно», «горящие туры» или «гарантия», и ваше письмо окажется в папке «Нежелательная почта». То же самое касается восклицательных знаков и слов, набранных ПРОПИСНЫМИ БУКВАМИ!!! Это запрещено в почте.

Спамеры пишут заглавно, разноцветно, жирно, с восклицательными знаками. Не делайте так.

Футер

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

Пример футера письма

Тестировать, тестировать и еще раз тестировать

Когда вы делаете дизайн для веб-страницы, вы проверяете его в разных браузерах — в IE, Firefox, Safari и т.д. Клиенты электронной почты тоже по-разному отображают один и тот же код, поэтому вам надо проверять дизайн в разных условиях. 

Быстрое тестирование в браузере: отключите картинки, отключите CSS и вы увидите примерно тоже самое, что и ваши получатели на mail.ru. 

Если вы занимаетесь дизайном много и профессионально, то посмотрите, какие почтовые веб-системы используют ваши подписчики, заведите тестовые ящики в них и проверяйте дизайн в них. Если вы делаете рассылки на русском языке, то вам придется тестировать письма в Яндекс.Почте, Mail.ru, Gmail.com, Pochta.ru, Rambler.Почта, ukr.net и tut.by. Если рассылки на английском языке — то вы столкнетесь с собственными почтовыми клиентами провайдеров AOL, Comcast и Earthlink. И, безусловно, надо тестировать письмо в настольных клиентах Outlook 2003/2007, Outlook Express, Thunderbird, The Bat! (в России), Lotus (в России тоже есть).

Popularity: 47% [?]

No related posts.

Комментарии (14) »

Val — 06.07.2007 14:58 #

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

Сергей — 06.07.2007 15:27 #

Спасибо, будем писать еще :)
По поводу спам-фильтров мы уже писали например про SPF и про junk-фильтр Outlook. Но это тексты скорее для сисадминов, чем для дизайнеров.
Если вы будете делать рассылки с правильным содержанием, хорошим дизайном и отправлять через белые серверы, то спам-фильтры не будут большой проблемой.

Outlook Blogger — 07.07.2007 00:46 #

Спасибо, очень полезно!

Сергей — 08.07.2007 16:00 #

Пожалуйста! А нам понравилась идея вашего проекта aboutmail.ru. И программой Potolook я пользуюсь (купил лицензию несколько лет назад).

mongoose — 11.07.2007 15:13 #

Очень познавательная статья. Все написано простым и доступным ля понимания языком. Особенно заинтересовали акценты на вещах, которые обычно остаются без внимания (например, отписка).

maksimp — 30.08.2007 15:47 #

как много нового узнал!!! хе :)

Юрий — 25.10.2007 01:01 #

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

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

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

Причем другие рассылки, выходящие в тексте, получаю в нормальном формате. Видимо заковырка именно с получением из веб-формы. Что такое неведомое происходит, потому что письмо уходит в голом text/plain.
Перед формой тег . Может он как-то влияет.

Сергей — 25.10.2007 10:30 #

Юрий,

мы не замечали проблем со стандартами.

То, что вы описали похоже на особенность сервера или скрипта отправки.

Для начала я бы проверил формат переводов строки в скрипте – вполне возможно что там стоит cr-lf, а нужен обычный cr.

Яна — 01.02.2008 18:22 #

Сергей, здравствуйте. Я работаю в большой компании, больше 20 подразделений по России. Насмотрелась на самые невообразимые форматы электронных писем от сотрудников. Мы используем Outlook. Каким образом можно по всем филиалам установить в Outlook единый стандарт электронного письма? Большое спасибо, если подскажете!

Сергей — 02.02.2008 02:19 #

Яна,
в аутлуке есть понятие шаблонов писем.

Вот здесь есть про шаблоны по-русски: http://www.microsoft.com/rus/smallbusiness/themes/build-your-business/createoutlookemailtemplatesforsalesletters.mspx

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

Так что разрабатывайте шаблон – сами или с помощью дизайн-студии – и публикуйте его вместе с инструкцией по установке на корпоративном сайте.

? ассылка Ford eZine » Блог о рассылках — 16.05.2008 22:24 #

[...] но он молодец. Письмо соответствует всем нашим рекомендациям по оформлению HTML-писем и правильно отображается в почтовых [...]

OVERMAX — 08.07.2008 15:11 #

Какими программами рассылки Вы советуете пользоваться?

Сергей — 10.07.2008 20:40 #

OVERMAX:
выбор программы зависит от задачи: новостная рассылка, маркетинговая кампания или что-то другое… еще зависит от бюджета…

вообще для новостных рассылок и маркетинговых кампаний неплохо подходит Почтовый Куб ;)

OVERMAX — 11.07.2008 09:40 #

Какие существуют программы для рассылки на бесплатной основе? В некоторых письмах, когда я получал, в поле «Кому» стояло слово – «Undisclosed recipents» – как такое сделать или через какую программу они отправили это сообщение?

Оставить комментарий

Блог Почтового Куба — сервиса почтовых рассылок для дизайнеров.
При перепечатке, пожалуйста, ставьте ссылку на источник.