2

HTMLメールに画像付きの署名を挿入しようとしています。Gmailに問題があります(iPhoneクライアントでは問題なく動作します)。

ユーザーが画像を受け入れる前に、画像のサイズが適切に設定され、代替テキストが表示されます。

ユーザーが許可する前の画像

各画像のHTMLは次のようになります。

<img alt="Bonne" width="80" height="80">

したがって、これは正常ですが、ユーザーが[この電子メールで画像を許可する]をクリックすると(英語の正確なラベルがわからない)、単に消えます。

ユーザーが許可した後の画像

要素を調べると、それらを非表示にするためのコードが追加されていることがわかります。

<img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/happy.png" alt="Bonne" width="0" height="0" style="display: none !important; visibility: hidden !important; opacity: 0 !important; background-position: 80px 80px; ">

Gmailがこれを行うのかわからない、誰かが考えを持っていますか?

編集

元の画像タグ:

<img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/unhappy.png" alt="Mauvaise" width="80" height="80" style="border : 0; width:80px; display: block;   margin-left: auto;   margin-right: auto;" hspace="10" />

グローバルHTML:

    <center>
        <table border="0" cellpadding="0" cellspacing="0" id="backgroundTable" style="border-color:#FFFFFF" >
            <tbody>
            <tr>
                 <td valign="top">
                    <div >
                        <h4 class="h4">Si vous avez une seconde, vous pouvez évaluer ma réponse :</h4>
                    </div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="top">
                    <table border="0" cellpadding="0" cellspacing="0" width="600" id="templateBody" style="border-color:#FFFFFF">
                        <tbody>
                            <tr>
                                <td valign="top" width="180" class="leftColumnContent">
                                    <table border="0" cellpadding="20" cellspacing="0" width="100%" style="border-color:#FFFFFF">
                                        <tbody><tr>
                                            <td valign="top">
                                                <a href="http://demo.smartadserver.com/Shared/happy-customers/vote/21142b09-3eab-4c07-aa64-e09e6924cd89/Happy" style="text-decoration: none;outline: none; " title="Bonne">
                                                    <img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/happy.png" alt="Bonne" width="80" height="80" style="border : none;  width:80px; display: block;   margin-left: auto;   margin-right: auto;"  />
                                                    <div style="text-align: center;">
                                                       <h4 class="h4" style="text-decoration: underline; color:#50b748; margin-bottom:0;">Bonne</h4>
                                                       <span style="color:#50b748;">Rapide, utile et agréable.</span>
                                                    </div>
                                                </a>
                                            </td>
                                        </tr>
                                    </tbody></table>
                                </td>
                                <td valign="top" width="180" class="centerColumnContent">
                                    <table border="0" cellpadding="20" cellspacing="0" width="100%" style="border-color:#FFFFFF">
                                        <tbody><tr>
                                            <td valign="top">
                                                <a href="http://demo.smartadserver.com/Shared/happy-customers/vote/21142b09-3eab-4c07-aa64-e09e6924cd89/Neutral" style="text-decoration: none;outline: none; margin-bottom:0;" title="Moyenne" >
                                                  <img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/neutral.png" alt="Moyenne" width="80" height="80" style="border : 0; display: block; width:80px;   margin-left: auto;   margin-right: auto;" >
                                                  <div   style="text-align: center;">
                                                    <h4 class="h4" style="text-decoration: underline; color:#ffd300; margin-bottom:0;" >Moyenne</h4>
                                                    <span style="color:#ffd300;">Acceptable, mais insufisant.</span>
                                                  </div>
                                                </a>

                                            </td>
                                        </tr>
                                    </tbody></table>
                                </td>
                                <td valign="top" width="180" class="rightColumnContent">
                                    <table border="0" cellpadding="20" cellspacing="0" width="100%" style="border-color:#FFFFFF">
                                        <tbody><tr>
                                            <td valign="top">
                                                <a href="http://demo.smartadserver.com/Shared/happy-customers/vote/21142b09-3eab-4c07-aa64-e09e6924cd89/Unhappy" style="text-decoration: none;outline: none;" title="Mauvaise">
                                                  <img src="http://demo.smartadserver.com/Shared/happy-customers/Content/images/unhappy.png" alt="Mauvaise" width="80" height="80" style="border : 0; width:80px; display: block;   margin-left: auto;   margin-right: auto;" hspace="10" />
                                                    <div style="text-align: center; ">
                                                    <h4 class="h4" style="text-decoration: underline; color:#be1e2d; margin-bottom:0;">Mauvaise</h4>
                                                        <span style="color:#be1e2d;">Malheureusement, je n'en suis pas satisfait.</span>
                                                    </div>
                                                </a>
                                            </td>
                                        </tr>
                                    </tbody></table>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
        </table>
    </center>

ありがとう

4

1 に答える 1

10

この種の属性はGmailではなく、ブラウザが使用しているプラ​​グイン、特にAdblockPlusプラグイン(フィルタにsmartadserver.comが含まれている)によって追加されます。それ以外の場合、HTMLはGmailで完全に機能しています。試してみました。

プラグインを無効にするか、Adblockフィルターリストからsmartadserver.comを削除することで、ブラウザーに表示できます。

ただし、これが他の人に起こらないようにする場合は、画像を別のサーバーでホストして、ドメインが広告フィルターでブラックリストに登録されないようにします

また、別の互換性に関する注意事項...一部のメールクライアントはpng画像形式をサポートしていませんでした。

于 2013-03-07T15:32:32.983 に答える