t3n News Software

Ink: Responsive E-Mail-Framework von den Foundation-Machern

Ink: Responsive E-Mail-Framework von den Foundation-Machern

Ink ist ein Open-Source-Framework, das dir dabei helfen soll responsive HTML-E-Mails für alle Clients zu erstellen und soll dabei selbst stets problematische wie Outlook 2000 versorgen.

Ink: Responsive E-Mail-Framework von den Foundation-Machern

Ink: Responsive HTML-E-Mails für alle Clients (Screenshot: ZURB)

Ink löst ein langwieriges Problem, das Webworker mit der Gestaltung von E-Mails haben. Wer schon mal das Vergnügen hatte, ein HTML-E-Mail-Template erstellen zu dürfen, kennt die vielen technischen Probleme bei der Erstellung solcher Templates, die klassische Cross-Browser-Probleme alt aussehen lassen. Zwar kursieren im Internet zahlreiche Guidelines zu diesem Thema, die alltäglichen Probleme, bei der Erstellung von HTML-Emails, lösen diese aber nicht.

Der Umstand, dass 40 Prozent aller E-Mails über mobile Endgeräte abgerufen und gelesen werden, ist ein zusätzlicher Faktor, der weitere Herausforderungen mit sich bringt.

Zurb hat bereits einige der beliebtesten E-Mail Templates erstellt und fasst die Erfahrung und das Wissen mit Ink zusammen.

Lösung für HTML-E-Mail-Probleme: Ink

Ink Responsive eMail
Ink verspricht responsive E-Mails, die selbst in veralteten Clients funktionieren. (Screenshot: ZURB)

Ink ist für E-Mails das, was Bootstrap und andere Web-Frameworks für deine Seite sind. Nutze die Vorlagen von Ink, füge dein Branding und Design hinzu und innerhalb kürzester Zeit erhältst du eine responsive HTML-E-Mail um deren Kompatibilität du dir keine Sorgen zu machen brauchst. Hierfür hält Ink fünf Boilerplate-Templates für dich bereit.

Das wäre natürlich auch mit MailChimps E-Mail-Templates möglich. Mit Ink kannst du aber deinen eigenen Code erstellen und brauchst keine Sorgen zu haben, dass deine E-Mail falsch dargestellt wird.

Zu den Funktionen des gehören Features wie ein Gridsystem, CSS-Klassen für Sichtbarkeit – damit du Elemente ein- bzw ausblenden kannst – sowie Buttons, die sich den Fähigkeiten des Clients anpassen – falls Bilder im Client deaktiviert sein sollten. Mit dem Ink-Inliner-Tool, dass das Stylesheet direkt in das deiner E-Mail schreibt, werden deine Buttons auch in Webmail-Clients angezeigt.

Anders als bei der Entwicklung von Hand, kannst du mit Ink auch mit vergleichsweise geringen HTML-Kenntnissen schnell und unkompliziert zu guten Ergebnissen kommen. Wenn du mal nicht weiterkommen solltest, steht dir eine sehr detaillierte und gut nachzuvollziehende Dokumentation zur Verfügung.

Derzeit unterstützt Ink folgenden Clients:

  • Apple Mail (5 and 6)
  • Microsoft Outlook (2000, 2002, 2003, 2007, 2010, 2011, 2013)
  • Mozilla Thunderbird (3, latest)
  • Native (2.3, 4)
  • iOS Native (6, 7)
  • AOL Mail
  • Gmail
  • Yahoo! Mail
  • Outlook.com

Ink: Responsive E-Mails für alle

Die Befreiung von HTML-E-Mail-Design jenseits der 90er Jahre ist vielleicht ein wenig zu hoch gegriffen – vor allem da weiterhin auf Tabellen-Layouts gesetzt werden muss. Zurbs Ink schafft jedoch den Alltag von Webworkern einfacher zu machen, da sich nicht mehr der Kopf über veraltete Clients zerbrochen werden muss. Auf der offiziellen Seite von Ink erfährst du mehr.

Benutzt ihr Tools wie MailChimp oder Campaign Monitor – oder entwickelt ihr eure Newsletter selbst?

Vorheriger Artikel Zurück zur Startseite Nächster Artikel
12 Antworten
  1. von gadean am 13.01.2014 (15:13 Uhr)

    Wer auch immer "HTML"-Emails eingeführt hat gehört geknechtet und verknüppelt. Ich versteh echt nicht wo darin der Nutzen liegen soll, in ner Mail will ich die Infos haben und keine bunten Bildchen. Fehlt nurnoch das irgendwelche Werbebanner eingeblendet werden :facepalm:

    Antworten Teilen
  2. von JayMeeLee am 13.01.2014 (15:22 Uhr)

    Wahrscheinlich war das der selbe Typ, der dagegen war, dass das Web nur aus Text besteht. Was hat der sich nur dabei gedacht...

    Antworten Teilen
  3. von andy am 13.01.2014 (17:28 Uhr)

    JayMeeLee YMMD! :D

    Antworten Teilen
  4. von gadean am 13.01.2014 (19:39 Uhr)

    Dann gehört der eben auch geknechtet, was fällt denen bitte ein. Das textbasierende Websites wunderbar funktionieren weiß man doch schon länger - oh halt dafür müssen die Websites ja Inhalte die bieten die nicht einfach nur kopiert wurden o.ä. O.O

    Antworten Teilen
  5. von John am 13.01.2014 (19:42 Uhr)

    Ich verlange, dass das Internet sofort abgeschaltet wird!

    Antworten Teilen
  6. von xxxfanta am 14.01.2014 (09:10 Uhr)

    Niemand gehört geknechtet.. Ausser Microsoft, die in gefühlt jeder Outlook-Version die Rendering-Engine wechseln..

    Es geht nicht um bunte Bildchen, aber um klar-strukturierte E-Mails. Ohne HTML müsstest du dann auch immer auf die Schriftart des E-Mail-Clients angewiesen sein..

    Und textbasierte Webseiten? Ich bitte euch.. Selbst die benutzen Stylesheets um Schriften, Farben und Formen zu definieren..

    Antworten Teilen
  7. von Jonas am 14.01.2014 (09:16 Uhr)

    Ausgiebig getestet und an sich eine feine Sache. Jedoch merkt man noch, dass Ink ein wenig in den Kinderschuhen steckt. Teilweise machen da vorgefertigte Templates von Mailchimp & Co eine bessere Figur.

    Die Verschachtelungen sind teilweise sehr unübersichtlich, aber aufgrund des für viele Mailclients notwendige Tabellenlayout wohl nicht anders machbar.

    Antworten Teilen
  8. von involatus am 14.01.2014 (09:49 Uhr)

    Hmm... ein netter Anfang. Noch nicht wirklich ganz ausgereift.

    Da setze ich momentan lieber auf http://www.campaignmonitor.com/templates/. Einfach und schnell

    Antworten Teilen
  9. von Mathis am 14.01.2014 (17:16 Uhr)

    Ich sehe weniger Outlook 2000 ist ein Kindergeburtstag gegen 2007 und 2010, ich meine welcher *piep* kommt den ernsthaft auf die MS Word als Rendering Engine zu nehmen o.O

    Antworten Teilen
  10. von wefwef am 14.01.2014 (22:23 Uhr)

    Gähn, das Oulook 2007/2010 Problem ist ja nun kein neues. Da sollte man doch in den letzten Jahren genug Erfahrungen gemacht haben. Mittlerweile macht Gmail mehr Probleme.

    Antworten Teilen
  11. von Stefan Müller am 16.01.2014 (17:38 Uhr)

    Einfach umzusetzen, wunderbar responsive in der Browser-Ansicht. Leider weder in Outlook noch in Aqua (Mobil, Android).
    Das macht traurig... Oder ich muss noch üben :(

    Antworten Teilen
  12. von RobertS am 02.12.2014 (12:02 Uhr)

    Ganz interessant, aber scheint doch etwas kompliziert..
    Ich empfehle, mal bei LianaMailer von Lianatech vorbeizuschauen (http://www.lianamailer.de)
    Mit LianaMailer lassen sich responsive mobilfreundliche E-Mails ohne Programmierkenntnisse einfach mit dem Drag & Drop Editor erstellen. Zusätzlich gibt es umfangreiche Analysefunktionen, Abonnentensegmentierung und einen erstklassigen persönlichen Kundendienst. Achja, und alle gängigen E-Mail Clients werden natürlich auch unterstützt ;)

    Beste Grüße,
    Robert

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema Frameworks
Noch leichter zu responsiven E-Mails: Foundation for E-Mails 2 ist da
Noch leichter zu responsiven E-Mails: Foundation for E-Mails 2 ist da

Mit Foundation for E-Mails 2 ist jetzt der Nachfolger von Ink veröffentlicht worden. Wir verraten euch, was das Framework für responsive E-Mails für Neuerungen im Gepäck hat. » weiterlesen

Wie diese 14 Unternehmen mit E-Mails erfolgreich werben
Wie diese 14 Unternehmen mit E-Mails erfolgreich werben

Der E-Mail-Posteingang wird immer wichtiger und im Jahr 2016 zu einem essentiellem Teil der Kunden-Erfahrung. In diesem Artikel zeigen wir einige brillante Beispiele für Behavioral … » weiterlesen

Plain: So einfach kann E-Mail sein
Plain: So einfach kann E-Mail sein

Plain Email ist ein App-Konzept für einen effizienteren Umgang mit der täglichen E-Mail-Flut. Wir haben einen Blick auf den Prototyp geworfen. » weiterlesen

Alle Hefte Jetzt abonnieren – für nur 35 €

Kennst Du schon unser t3n Magazin?