0

メールマガジンをコーディングしています。私は良い電子メールコーディングに関するいくつかのガイドラインを見てきました。たとえば、電子メールニュースレターのcssコードについて質問したいのですが、たとえば、インラインcssをコード化するのが好ましいですが、いくつかの無料テンプレートでは、このようなコードを見つけました

       <style type="text/css">

       body { color:#000; background-color:#fff; font-family:Arial, Helvetica, sansserif; text-align:center; }
       h2 { color:#2255DB; font-size:16px; margin-top:15px; margin-bottom:0px; }        
       h2 a:link { text-decoration:none; }
      .footer { fontsize:11px; text-align:center; color:#2255DB; }// and son on 

       </style>

足のボディコードは次のようになります

    <p class="footer" style="color:#2255DB;"> footer...</footer>//again style  tag

そして時々私はこのトータルインラインスタイリングのように見つけました..

    <span style="font-weight: bold; width: 525px;">
    Lorem ipsum dolo
    </span><br><br>// and son on  ,,  

上記のコードは両方とも電子メールクライアントで正常に機能しています。キャンペーンモニターなどの標準も確認したので、どちらのスタイルが優れているか混乱しています。上記のコードのようにスタイルを使用するか、完全なインラインコーディングを使用する必要があります。これについて私をクリアすることができます..それは大きな恩恵になるでしょう

編集 :コード化されたら、メールクライアントの有効なコードかどうかを確認するのに役立つ無料のサービスはありますか?

4

7 に答える 7

2

HTMLニュースレターがデザインと同じように見えるようにするために、私は間違いなくインラインスタイルを使用します。

残念ながら、スタイルを非常に具体的にする必要があります。そうしないと、一部のソフトウェア(Gmailなど)がスタイル宣言を上書きします。それは時々本当に苦痛ですが、IMOのようにそれを行う価値があります。

HTMLメールの署名についても同じことが言えます。

だから間違いなくインラインスタイリングに行きます:)

ああ、そしてもう1つ。2012年であり、HTMLメールや署名にhtmlタグ(html5要素も含む)を使用するように多くのデザイナー/フロントエンダーがアドバイスしていることは知っていますが、昔ながらの方法に固執し、テーブルを使用してコードに不要なアーティファクトはありません。

于 2012-12-04T18:45:15.817 に答える
2

多くのメールクライアントは、埋め込まれたスタイルシートを削除します。すべてにインラインスタイルを使用するのが最善です。

あなたの例では、BODYタグをスタイリングしていますが、Gmailでメールを読んだ場合、ページにはすでに独自の本文タグが付いているため、削除されます。

キャンペーンモニターガイドは、フォローするのに最適なリソースであることがわかりました。

これが良いテストです。静的なHTMLページに電子メールを保存してから、MSWordで開きます。これはかなり良い「最悪のシナリオ」です。

本格的なメールマーケティング作業を行う場合、Exact Targetには、さまざまなクライアントで実際にメールをレンダリングし、それらのプラットフォームからのスクリーンショットのPDFを提供して確認できる優れたツールがあります。

于 2012-12-04T18:42:48.030 に答える
2

私が行ったHTMLメールから、またhttp://24ways.org/2009/rock-solid-html-emails/からのアドバイスに従って、常にスタイルをインライン化することをお勧めします。

http://www.campaignmonitor.com/css/についておっしゃいましたが、これは、スタイルがインライン化されないという問題が発生するクライアントがGmailであることを示しています。

編集:このシナリオでGmailが黒い羊である理由に関心がある場合は、セクション1194.22、http://mail.google.com/mail/help/accessibility.htmlを確認してください。

于 2012-12-04T18:43:33.570 に答える
2

電子メールニュースレター形式の場合、電子メールクライアントが異なればレイアウトのレンダリングも異なるため、テキストのスタイル設定にはインラインcssと主にフォントタグとその属性を使用することを強くお勧めします。また、divレイアウトの代わりにテーブル構造を使用して、ほとんどの電子メールクライアントでレイアウトの一貫性を維持します。

于 2012-12-04T18:49:54.100 に答える
2

電子メール用のHTMLテンプレートを作成するのは本当に面倒です。また、すべてをテストすると言っているサービスからでも、テストは非常に困難で信頼性が低いことがよくあります。古いメールクライアントは、CSSおよび新しいHTML要素を無視することが知られています。さらに、メールクライアントはCSSの一部を独自のもので上書きし、レイアウトを操作する場合があります。

私のアドバイス:

1)他の人が述べたように、インラインスタイルを使用します。それらをすべてに適用します。たとえば、divにフォントサイズを追加してdiv<p>内に適用することを期待しないでください(そうあるべきです!)。両方、または少なくとも直接の親にスタイルを追加します。

2)余白やパディングではなく、任意のレイアウトにテーブルを使用します(うーん!)。古いメールクライアントの中には、CSSをあまり気にせず、すべてを削除したり、CSSのスニペットのみを適用したりするものがあります。

3)電子メールクライアントがすべてのCSSを破棄した場合でも読み取り可能なように電子メールを設計します(これは明確な可能性です)。これが、ほとんどが画像であるメールマガジンを頻繁に受け取る理由です。

于 2012-12-04T18:55:23.630 に答える
1

すべてにインラインスタイルを使用して、HTMLメールがすべてのクライアントで同じように表示されるようにします。

HTMLコンテンツをインライン化するために使用できる優れたツールがあります。これはmail-chimp(メールについて1つか2つ知っていると思います)によって提供されますhttp://beaker.mailchimp.com/inline-css

于 2012-12-04T18:48:26.203 に答える
0

一部の主要な電子メールクライアント(Outlook 2007など)は電子メールでCSSをサポートしていないため、埋め込みcssではなくインラインスタイルを使用することをお勧めします。

Gmailは埋め込みCSSをサポートしていません。

この問題を回避する1つの方法は、各テスト結果の[開発者ツール]ドロップダウンにあるCSS変換ツールを使用して、埋め込まれたCSSをインラインに変換することです。

フォント、フォントの色、フォントサイズなどの問題を回避する別の方法があります。GmailはBodyタグをDIVに変換します。BODY内でDIVによってサポートされるインラインCSSプロパティを使用できるため、これは実際に有利に機能します。ただし、一部のクライアントはBODYタグをサポートしていないため、埋め込みCSS内に同じ宣言を含める必要があることを知っておくことが重要です。また、「bgcolor」などのBODY属性は、DIV内ではサポートされていないため、信頼できないことに注意してください。

于 2014-06-17T07:10:44.047 に答える