Kann E-Mail reagieren?


8

Ich liebe es oder ich hasse es, die Popularität von HTML-E-Mails ist unbestreitbar. Und wie das Internet zuvor ist der Posteingang offiziell mobil geworden - über 50 Prozent der E-Mail-Öffnungen finden auf Mobilgeräten statt.

Kann E-Mail wirklich reagieren, wenn man bedenkt, wie E-Mail-HTML saugt?


Würde das nicht von der E-Mail-Anwendung abhängen, würde meistens das Web-E-Mail-Formular Ihr Ziel verhindern, da es sich um Ihr HTML
dreht

Überprüfen Sie DEVTIPS auf youtube. Ich bin mir ziemlich sicher, dass es ein Video über reaktionsfähige E-Mails gibt.
Komental

Ich mag Ihre Frage, aber zu diesem Zeitpunkt macht es Ihnen etwas aus, sie so zu bearbeiten, dass sie in den Bereich "Design" passt, da dies möglicherweise besser für SO geeignet wäre, da dies eine Code-bezogene Frage und kein Design wäre verwandte Frage.
DᴀʀᴛʜVᴀᴅᴇʀ

Geht es nicht nur darum,% in Tabellen zu verwenden? Ich habe bereits eine Mailchimp-Vorlage mit nur% erstellt, die es für jedes Gerät perfekt machte.
rwzdoorn

Antworten:


3

So kann E-Mail wirklich reagieren

Einfache Antwort auf Ihre Frage .. JA

HTML-E-Mails fallen in gewisser Weise unter die gleiche Regel wie Websites, sind jedoch in der Regel schwieriger zu verarbeiten und stützen sich immer noch auf den alten Code-Stil mit <table>Tags. Es gibt einen großartigen Artikel von Web Design Tuts , von dem ich mir wünschte, er wäre da, als ich anfing, HTML-E-Mails zu schreiben.

Ein wenig über das Tutorial wird erläutert, wie eine reaktionsfähige E-Mail erstellt wird. Ein wichtiger Hinweis beim Erstellen von HTML-E-Mails ist, dass das CSS am Ende inline sein muss. Es wird diskutiert, wie man CSS für Yahoo mit zielt, body[yahoo] .class {}und sie verweisen auf Tina Yes Artikel über " Responsive HTML-E-Mails: eine andere Strategie ".

Da der Artikel von Webdesign Tuts nicht sehr detailliert auf Tinas Artikel eingeht, würde ich Ihnen empfehlen, ihn zu lesen, da sie sich mit der ersten Entwurfsmethode für Mobilgeräte befasst und zeigt, wie für Lotus 8, Outlook 00-03, Outlook 2007+ und Apple zu entwerfen ist ::

Lotus Notes 8 und Outlook 2000-2003

 <!--[if IE]>
  <table width="540" align="center" cellpadding="0" cellspacing="0" border="0">
    <tr>
      <td>
<![endif]-->
[EMAIL BODY HERE]
<!--[if IE]>
      </td>
    </tr>
  </table>
<![endif]-->

Ausblick 2007+

<!--[if (gte mso 9)|(IE)]>
  <table width="540" align="center" cellpadding="0" cellspacing="0" border="0">
    <tr>
      <td>
<![endif]-->
[EMAIL BODY HERE]
<!--[if (gte mso 9)|(IE)]>
      </td>
    </tr>
  </table>
<![endif]-->

Apple Mail

@media only screen and (min-device-width: 541px) {
  .content {
    width: 540px !important;
  }
}

Wenn Sie bei Google nach reaktionsschnellen E-Mail-Vorlagen suchen, gibt es einen Artikel mit dem Titel " 32 reaktionsschnelle E-Mail-Vorlagen für Ihr kleines Unternehmen " von Mashable.
Es werden kostenlose und kostenpflichtige Vorlagen für Ihre E-Mails besprochen, und es geht in Zurb, was ich empfehlen würde, wenn Sie Foundation für das Webdesign verwenden.


1

Sie können sicher! Hier ist eine Vorlage, mit der Sie reaktionsschnelle HTML-E-Mails erstellen können : http://zurb.com/ink/ . Das Erstellen einer HTML-E-Mail von Grund auf erfordert viel Wissen darüber, wie E-Mail-Clients E-Mails analysieren. Diese Vorlage stellt sicher, dass Ihre E-Mail auf allen E-Mail-Clients korrekt angezeigt wird.

Sie müssen lediglich den Inhalt der Datei durch Ihre E-Mail ersetzen und diese Datei über ein Skript in Ihrer Anwendung ausführen, das das Senden von E-Mails übernimmt.


1
Bitte geben Sie weitere Informationen zu dem von Ihnen angegebenen Link an, da es sich derzeit nur um eine Linkantwort handelt. In Zukunft erhalten Sie möglicherweise einige Downvotes, wenn die Website ausfällt.
DᴀʀᴛʜVᴀᴅᴇʀ

1
Antwort bearbeitet.
Nag

Schöne, wirklich interessante (und gut dokumentierte!) Ressource.
user56reinstatemonica8

1

Ja, das können Sie, aber es sei denn, Sie haben eine massive Leidenschaft dafür, stören Sie sich nicht. Stellen Sie sich vor, Sie codieren für IE5 und müssen das testen. Es ist möglicherweise besser, eine Vorlage für diese Art von Dingen zu kaufen, als Ihre eigene maßgeschneiderte Lösung zu erstellen.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.