Rake HTML植字

かなり頻繁に、クライアントは定期的なニュースレターを手配します。 ほとんどの場合、彼らはテキストフィードやHTMLフィードの単純なレイアウトに満足していません。 私たちのデザイナーは最大限の創造的な作業を行い、その後、多くの電子メールクライアントでレイアウトのレイアウトのバンプを正しい表示で埋めます。



以下は、私たちが遭遇した機能とそれらを解決する方法のリストです（どういうわけかそれらをソートすることができなかったので、すべてが単一のリストになります）

• エンコーディングに問題がないように-UTF-8で構成し、HEADでは<meta http-equiv = "Content-Type" content = "text / html; charset = utf-8 ">;
• Mail.ru、Yandex、およびRamblerのメールはすべてのcssを切り取るため、HTML3.2を使用してタイプセットする必要があります。
• Mail.ruは、要素を<div id = "mailsub">の文字でラップする必要がないようにインデントします。
• Mail.ru（およびYandexのように見える）は、コードのパディング（\ t）を＆nbsp;に変換します。 したがって、コードをタブで無効にしないでください。
• テキストバージョンはHTMLではなくテキストバージョンであるため、HTMLエンティティを使用できません。 また、テキストバージョンでは、windows-1251にないUnicode文字を使用できません。 mail.ruは、何らかの理由で、このエンコーディングに文字をトランスコードします。
• Outlook 2007では、背景画像を使用できません。 実際に1つのハックが見つかりました。本文の背景画像を指定できます。 次に、このOutlookに背景が表示されます。 ただし、background-positionまたはbackground-repeatを使用すると、ハックは機能しません。 Webクライアントでは、この背景は表示されないため、Outlookの本文のスタイル、およびWebクライアントの「ルート」テーブルの背景にその指示を複製する必要があります。
• Outlook 2007は、div要素の上にマージンを作成します。 cellpadding = 0のセルスペース= 0のテーブルには、そのようなフィールドはありません。
• 最新のディズニーのニュースレターでは、背景画像の使用を完全に放棄しなければなりませんでした。 背景の上に写真を配置し、テーブル内の一連の写真で構成されるメインレイアウトを作成する際に問題が発生しました。 テキストも写真に含まれます。リンクは エリアマップ を使用して配置されます Gmailでそのようなリンクをクリックすることはできません。 文字を写真に切り取り、テーブルに保存する必要があります。
• Gmailでは、表のセルにある唯一の写真の下部から3pxのインデントがある場合、この写真にstyle =“ display：block”を設定することで削除できます。
• Ramblerでは、レターの本文に示されている写真はそれぞれリンクに置き換えられてサーバーにマージされます。http認証の外部から閉じられているサーバーから送信されたニュースレターを見ると、写真は表示されません。
• Yandexでは、メッセージの本文が{strip}内に配置されている場合（すべての改行が切り取られる）、メッセージの本文に理解できない改行が表示され、srcまたはhref属性の値に該当する場合があります。 同時に、画像が表示されず、リンクが開かない場合があります。
• IE6の画像の下部で3pxのインデントを防ぐには、画像タグとセル終了タグの間に空白がないことが必要です（この場合、次のようなコメントを使用して行を転送できます：
  
  <td>
  
  <img src = "" alt = "" /> <！-
  
  -> </ td>
• Outlook 2007は、ストレッチされた画像のサイズを変更しない場合があります。 レイアウトに示されている1対1の画像を使用する必要があります。
• Outlook 2007で、colspanまたはrowspanが設定されたtd内に配置された画像が、colspanまたはrowspanが結合する隣接セルの境界線の延長に沿って切り取られる場合に発生することがあります。 この場合、画像全体の一部が表示されます。 結合されたセルをいくつかの単一のセルに分割し、問題の画像をいくつかの部分に分割しなければ、問題を解決できません。それぞれの部分が1つの単純なテーブルセルを占有します。
• 一部のOutlookインストールでは、改行のない文字が非常に奇妙な方法で破損し始めます。 ハイフネーションなしで個別のテーブルを作成できますが、非常に長い行は避けてください。
• バットで！ 透明gifを使用する場合、透明ドットは黒に置き換えられます。したがって、「透明」スペーサーは、それらが配置されている背景色で塗りつぶされる必要があります

メールホストの名前に言及するときは、POP / IMAPではなく、そのWebインターフェイスを意味します



このリストの2番目の項目については、トピック「メールのHTMLレイアウトに関する10の推奨事項」で詳しく説明します。