Итак, вы хотите отправить HTML-письмо своим клиентам, потенциальным клиентам или подписчикам на новостную рассылку. Маркетинг спустился с высоты и объявил это, клиент малого бизнеса хочет этого, и руководитель в управлении прочитал об этом.
А почему бы не? Рейтинг кликов заметно выше в электронной почте HTML. Статистика показывает, что клиенты реже отказываются от подписки на электронные письма в формате HTML, чем на текстовые сообщения. В моей последней рассылке TemplateKit по электронной почте было 11 отписок, 10 из которых были текстовыми получателями. Клиенты просто отвечают большим количеством переходов по ссылкам, большим количеством продаж и большим количеством запросов на информацию, но только если ваше сообщение имеет форму, которую получатель может легко просмотреть и правильно отобразить.
Дело в том, что HTML-браузеры электронной почты просто не равны их веб-браузерам. Ситуация усложняется из-за большого разнообразия настроек, предпочтений, обновлений безопасности, версий и сторонних приложений, что означает, что пользовательский опыт предсказать крайне сложно. Недавно я видел:
- Клиенты пытаются отправить Формы по электронной почте, которая прервана через веб-ридер
- Таблицы стилей, которые конфликтуют с сетевыми системами электронной почты (здесь есть смысл?)
- Перенаправления, которые обрабатываются дважды и ломаются
- Часть Flash или Shockwave, которая начинает потоковую передачу в окне предварительного просмотра Outlook, а затем запускается второй раз при открытии электронной почты
- JavaScripts разлетается на части, когда настройки безопасности зрителя или веб-клиент электронной почты запрещают их
- Ссылки, которые таинственным образом ломаются в системе учета ссылок Hotmail
… И это только некоторые из моих любимых явлений. Поскольку они являются двумя наиболее распространенными почтовыми клиентами, давайте начнем с рассмотрения Microsoft Outlook и Outlook Express и того, как каждый из них будет отображать HTML.
Обычные почтовые клиенты
Outlook принимает решение использовать полную версию IE (в зависимости от имеющейся у вас версии) или использовать «облегченную» версию в зависимости от текущей конфигурации. Два ресурса, которые могут помочь вам понять эти различия:
Когда вы вводите свой контент, вы должны знать о нескольких потенциальных проблемах.
Существует несколько способов отправки почты:
- В виде вложения
- Как встроенный документ
- Как сырой HTML (обратитесь к вашей индивидуальной почтовой программе)
- С помощью стороннего приложения, такого как Traffic Builder от bCentral, или надежной системы, такой как Xchange — eMessaging
Когда вы вводите свой HTML-код в приложение, вы также должны быть осторожны, если вы:
- Вырезать и вставлять с веб-страниц
- Вырезать и вставлять из продукта MS Office
- Используйте ранее отправленный по почте документ в качестве основы для вашего кода
Вырезание и вставка с веб-страницы
Существует несколько способов получить код HTML из существующего документа без использования редактора HTML. Вы можете «просмотреть исходный код» и скопировать код в буфер обмена, вы можете создать копию с помощью команды «сохранить как» или попытаться выбрать код из основного текста документа и вставить его в другую программу. Вам нужно помнить, как устанавливаются ссылки внутри этого документа. Если ваш документ содержит несколько относительных ссылок (например, /images/yourimage.gif), то вы не сможете найти свои изображения, когда придет время их предварительно просмотреть и протестировать.
Возможно, вы захотите включить тег BASE в свою электронную почту HTML, чтобы браузер получателя знал, как интерпретировать относящиеся к документу ссылки. Элемент BASE позволяет установить глобальную справочную информацию. Использование атрибута HREF обеспечивает базовый адрес для интерпретации всех относительных ссылок URL в документе, когда этот документ читается вне контекста. Атрибут TARGET указывает глобальное имя назначения фрейма, которое будет использоваться для изменений активации страницы (в ссылках, формах и картах изображений).
Например:
<BASE HREF="http://www.florentinedesign.com" TARGET="_top">
Вырезание и вставка из продукта Microsoft Office
Если вы вырезаете и вставляете из Microsoft Word, всегда есть вероятность, что некоторое форматирование не очень хорошо перенесется в HTML. Это чаще всего наблюдается в случае автоматического форматирования, когда MS Word преобразует обычные нажатия клавиш в символы -, «», © и множество других. Они называются символами Windows, и они не интерпретируются вашим браузером: Word представляет эти символы ASCI в виде числовых значений, которые браузер не может понять.
Вот почему всегда лучше всего работать в текстовом режиме или сохранять документ как текстовый документ DOS и потерять все форматирование, прежде чем перенести его в свою электронную почту HTML. Отличным текстовым редактором, заслуживающим вашего внимания, является TextPad, который позволит вам указать, какой кодовый набор вы должны использовать, и сохранить ваш документ как. Имейте в виду, что просто вставить свой код в TextPad или сохранить документ в MS Word как текстовый документ недостаточно.
Использование ранее отправленного документа в качестве основы для вашего кода
У вас могут возникнуть проблемы всякий раз, когда вы пытаетесь использовать код, который уже был отправлен по почте, в качестве основы для вашей новой рассылки. Это чаще всего наблюдается, когда код, который вы хотите использовать повторно, уже был обработан через веб-браузер. Многие веб-клиенты электронной почты и компании, предоставляющие изображения, такие как Netscape NetMail или Akamai, имеют свое собственное перенаправление и учет. Эти функции сломают ваши ссылки, если вы попытаетесь отправить им ссылку, которая ранее была обработана их системой.
Итак, проще говоря, не пытайтесь перенаправить перенаправление. Это верно и для ваших собственных перенаправлений.
Поскольку эти системы назначают перенаправления любой HTML-ссылке, которую они могут обнаружить, часто лучше также избегать использования «именованных якорей». Именованный якорь, или «якорь прыжка», — это ссылка, которая ведет вас в другое место в том же документе:
<A Name="foo"> С точки зрения маркетинга, если ваша электронная почта настолько длинна, что вы чувствуете, что вам нужно использовать именованные якоря, возможно, вам следует подумать о редактировании.
<A Href="#foo>This would jump you to "foo" in this email"</A>
Ненужный HTML в вашей электронной почте
Теперь давайте поговорим о различных элементах, которые, хотя и часто включаются в рассылки, на самом деле не являются необходимыми. Следующие элементы должны быть удалены перед отправкой по почте. Это уменьшит общий размер вашей рассылки и увеличит скорость, с которой она доставляется, обрабатывается и принимается вашими клиентами. Хотя для сотен рассылок это не кажется большой проблемой, представьте, что вы отправляете около 5 миллионов писем за один день…
Все метатеги, включая Refresh Cache & Pragma
Многие системы по умолчанию отключают некоторые метатеги, однако, когда Outlook получает команду обновления, он просто отображает пустой контент как на панели предварительного просмотра, так и в открытом сообщении. Веб-системы обычно отображают только контент, взятый между вашими тегами <BODY></BODY>
<TITLE> </ TITLE>
Раздел темы вашего электронного письма заботится об этом элементе.
Длинные комментарии или закомментированные разделы
<! — Нафф Саид–>
Программы, которые экспортируют в HTML
Если вы используете Dreamweaver, FrontPage или Adobe — избегайте любых ссылок на расширения, стили или таблицы Fireworks / Image Ready. Это чаще всего встречается с расширениями Front Page, которые довольно часто ссылаются на стили только для IE. Если у вас есть документ, в котором используется элемент библиотеки, например Dreamweaver, вам придется разбить элемент библиотеки на части и вставить свой код в виде необработанного HTML-кода для правильной работы почтового сообщения.
Перенаправление
Многие веб-клиенты электронной почты размещают свои перенаправления на ваших ссылках (по любым гнусным причинам…). Поэтому, если вы разместите свои собственные перенаправления на URL-адресах, адресах или строках запроса, они могут сломаться или отобразиться в виде простого текста в середине вашего письма.
Посторонние таблицы стилей
Убедитесь, что если вы используете таблицы стилей, они включают только элементы, которые вы будете использовать для определенной рассылки. Это помогает сократить объем и ненужный код из ваших рассылок. Это явление чаще всего встречается, когда макет содержит всю таблицу стилей для веб-сайта, а не только стили, используемые при рассылке.
Таким образом, если у вас есть 100 строк кода, которые определяют 25 стилей на вашем веб-сайте, но вы используете только один стиль для своего электронного письма в формате HTML, вы можете либо разметить стиль в HTML-коде, либо вы можете просто определить один стиль и применить его к вся электронная почта. Хотя это может показаться не таким уж большим делом для пары сотен электронных писем, опять же, это складывается, если вы отправляете миллион писем в день.
Специальные символы
Будьте осторожны, когда используете специальные символы в своем HTML-письме. К специальным символам относятся те, которые должны быть созданы с помощью escape-последовательности (например: © = & copy; в HTML), и многие браузеры электронной почты будут испытывать проблемы при чтении этих символов.
Одной из последовательностей символов, которая должна быть особенно осторожной, является неразрывный пробел (& nbsp;). Многие редакторы WYSIWYG (такие как FrontPage и Dreamweaver) влюбились в этого персонажа. Кроме того, многие редакторы WYSIWYG используют неразрывное пространство для вклинивания открытых <TD>, которые обычно закрываются при просмотре большинством браузеров Netscape. Пробел GIF следует использовать, когда вам абсолютно необходимо держать ячейку <TD> открытой, чтобы ваш дизайн работал.
HTML eMail — эффективное общение
Хотя кажется, что электронная почта в формате HTML требует пониженного уровня функциональности, вы все равно можете обеспечить эффективную связь для своих подписчиков, если вы будете следовать соглашениям, описанным выше.
В следующей части этого обсуждения мы рассмотрим включение в ваши электронные письма таких элементов JavaScript и Rich Media, как Flash и встроенное видео. Увидимся тогда!