
📧 So fügen Sie HTML in Outlook Web E-Mails ein: funktionierende Methode 2026
Sie haben eine HTML-E-Mail mit Tabellen, Buttons und einem Firmenlogo erstellt, aber Outlook Web macht daraus ein Durcheinander von spitzen Klammern. Strg+V entfernt das Markup und zeigt nackte <td> und <div> anstelle Ihres Designs. Es gibt keinen „HTML einfügen"-Button in der Browserversion, und den gab es auch nie.
Es existiert ein Workaround, der wenige Minuten dauert: eine eindeutige Markierung im Nachrichtentext plus die browser-eigenen DevTools. Keine Erweiterungen, keine API, kein Entwicklerkonto.
Eine Einschränkung vorab, die die meisten Anleitungen übergehen: Microsoft dokumentiert oder unterstützt diese Methode nicht. Sie beruht darauf, dass das Eingabefeld für Nachrichten ein gewöhnlicher contenteditable-Block ist und keine geschützte Komponente. Es funktioniert seit Jahren, aber Microsoft gibt keinerlei Garantien. Deshalb enthält dieser Artikel einen obligatorischen Schritt „Senden Sie einen Test an sich selbst" und einen Abschnitt zu offiziellen Alternativen im Jahr 2026.
💡 Kurzüberblick:
- Erstellen Sie einen Entwurf in Outlook Web und tippen Sie die eindeutige Markierung
ForHTMLEmailin den Nachrichtentext - Öffnen Sie die DevTools (F12), suchen Sie die Markierung in der DOM-Suche und wählen Sie „Als HTML bearbeiten"
- Ersetzen Sie die Markierung durch Ihren HTML-Zielcode und drücken Sie Strg+Enter
- Senden Sie die E-Mail an sich selbst. Stellen Sie sicher, dass das Markup beim Empfänger ankommt, bevor Sie es an andere versenden
Was sich bis 2026 geändert hat
Fünf Jahre alte Anleitungen sind in drei wichtigen Punkten überholt. Bevor Sie die DevTools öffnen, verstehen Sie die neue Landschaft.
Das neue Outlook ist Outlook Web. Microsoft ersetzt das klassische Outlook für Windows durch das „neue Outlook" (Projekt Monarch). Technisch handelt es sich um einen nativen Wrapper auf WebView2-Basis, der dieselbe Weboberfläche intern ausführt. Die praktische Konsequenz: Die unten beschriebene Technik gilt nicht nur für den Browser, sondern auch für den Client, zu dem Microsoft alle Benutzer hinführt.
Das klassische Outlook lebt noch, aber es stirbt. Microsoft verspricht, bestehende Installationen des klassischen Outlook mindestens bis 2029 zu unterstützen, und die erzwungene Migration wurde verschoben: frühestens 2027-2028. Office 2016 und 2019 verloren den Support am 14. Oktober 2025, Office 2021 am 13. Oktober 2026.
„Einfügen → Datei als Text" existiert nur im klassischen Outlook. Der alte Weg, HTML ohne DevTools einzufügen (der Button „Datei anhängen" → „Als Text einfügen"), bleibt bestehen, aber nur im klassischen Outlook, und der Button muss manuell zur Symbolleiste für den Schnellzugriff hinzugefügt werden. Im neuen Outlook und in der Browserversion gibt es diese Option überhaupt nicht. Alle Rezepte mit VBA-Makros und COM-Add-Ins sind ebenfalls tot: Sie funktionieren im neuen Outlook nicht.
Warnung, Stolperfalle. Im neuen Outlook für den Desktop können Sie die DevTools nicht mehr öffnen: Der Befehl olk.exe --devtools wurde absichtlich deaktiviert. Führen Sie alles im Browser aus, auf outlook.live.com oder outlook.office.com.
Was Sie benötigen
- Einen Chromium-Browser. Chrome, Edge, Brave, Opera, Vivaldi. In Firefox ist die Mechanik dieselbe, nur heißt der Reiter dort Inspektor.
- Ein Outlook-Konto. Privat
outlook.live.comoder geschäftlichoutlook.office.com, die Mechanik unterscheidet sich nicht. - Fertiges HTML mit Inline-Styles. Bewahren Sie die Quelle in einer separaten Datei auf: Falls der Tab geschlossen wird, lässt sich der Vorgang in einer halben Minute wiederholen.
Warum Inline-Styles und Tabellen weiterhin zwingend sind
Die Versuchung ist groß: Da das neue Outlook auf Chromium läuft, könnten Sie mit Flexbox layouten. Nicht so schnell.
Die E-Mail wird vom E-Mail-Client des Empfängers gerendert, nicht von Ihrem. Solange das klassische Outlook lebt (und es lebt bis 2029), öffnen einige Adressaten E-Mails mit der Word-Engine: kein Flexbox, kein CSS Grid, keine Hintergrundbilder, keine Webfonts, und margin wird ignoriert. Selbst dort, wo display: flex formal durchgeht, werden begleitende Eigenschaften (flex-wrap, align-items, justify-content) von den meisten Clients entfernt.
Das Fazit für 2026 hat sich nicht geändert: Tabellenlayout, Inline-Styles, feste Breite von 600 Pixeln. Externe <style>-Blöcke und <link rel="stylesheet"> werden von Outlook Web ignoriert.
1. Einen Entwurf erstellen und eine Markierung setzen
Öffnen Sie Outlook Web, klicken Sie auf „Neue Nachricht". Füllen Sie noch nicht den Betreff oder die Empfänger aus, das ist eine Absicherung gegen versehentliches Senden eines Entwurfs mit der Markierung.
Klicken Sie in den Nachrichtentext und tippen Sie genau ein Wort: ForHTMLEmail. Keine Leerzeichen oder Anführungszeichen, Groß-/Kleinschreibung ist relevant. Die Markierung muss der einzige Inhalt im Textkörper sein: Eine eindeutige Zeichenkombination garantiert, dass die Suche im Nachrichtentext landet und nicht in einem Oberflächenelement.

2. Die Markierung im DOM finden
Drücken Sie F12, ohne das Nachrichtenfenster zu schließen, und wechseln Sie zum Reiter Elemente.

Drücken Sie Strg+F innerhalb des DevTools-Panels (nicht auf der Seite), es öffnet sich eine DOM-Suche. Tippen Sie ForHTMLEmail und drücken Sie Enter. Die DevTools heben den gesuchten Knoten hervor: normalerweise ein <div> oder <p>, das mehrere Tabellenebenen tief verschachtelt ist. Finden Sie das Element, in dem ForHTMLEmail direkter Textinhalt ohne Kind-Tags ist.
3. Die Markierung durch HTML ersetzen
Klicken Sie mit der rechten Maustaste auf das gefundene Element und wählen Sie Als HTML bearbeiten. Oder drücken Sie F2 auf dem ausgewählten Element, das ist schneller.
Das Bearbeitungsfeld klappt auf: Sie sehen etwas wie <p>ForHTMLEmail</p>.
Markieren Sie den gesamten Feldinhalt und löschen Sie ihn. Dies ist der entscheidende Moment: Wenn Sie den alten Inhalt nicht löschen, überlagert das HTML die Markierung und Sie erhalten ein Durcheinander.

Fügen Sie nun Ihren Code mit Strg+V ein. Klicken Sie nicht mit der Maus außerhalb des Feldes, das würde den Bearbeitungsmodus schließen, bevor die Änderung übernommen wird. Wenn die DevTools die Tags eingefärbt und die Verschachtelung als Baum dargestellt haben, wurde der Code als Markup erkannt, nicht als reiner Text.
Drücken Sie Strg+Enter. Kehren Sie zum Nachrichtenfenster zurück: Das Layout sollte direkt im Textkörper gerendert werden, Bilder, Tabellen, Hintergrund, Buttons.

4. Obligatorischer Test vor dem Versand
Dieser Schritt wird übersprungen, und dann senden Leute ihren Kunden eine leere E-Mail. Die Methode ist inoffiziell, also gilt: Vertrauen ist gut, Kontrolle ist besser.
- Senden Sie die E-Mail an sich selbst. Geben Sie Ihre Adresse ein, senden Sie sie, öffnen Sie den Posteingang. Erst dann sind Sie sicher, dass das geänderte DOM tatsächlich zum Server gelangt ist und keine lokale Browser-Illusion geblieben ist.
- Öffnen Sie sie auf einem Smartphone und in einem anderen Client. Zumindest in Gmail. Wenn das Layout dort zerbricht, wird es bei der Hälfte Ihrer Adressaten zerbrechen.
- Betrachten Sie sie ohne Bilder. Outlook blockiert externe Bilder standardmäßig. Die E-Mail muss lesbar bleiben: Alt-Texte, Hintergrundfarben, kein Text als Bild.
- Erst jetzt Empfänger und Betreff ausfüllen.
Stewart Gauld zeigt, wie der gesamte Ablauf in einem Durchlauf aussieht. Das Video wurde vor dem Erscheinen des neuen Outlook aufgenommen, aber die Mechanik der Markierung und „Als HTML bearbeiten" hat sich seitdem nicht geändert.
Offizielle Alternativen, wenn DevTools keine Option sind
Die DevTools-Methode kostet nichts, aber sie ist inoffiziell und erfordert manuellen Aufwand. Wenn Sie regelmäßig HTML einfügen müssen oder eine nicht technisch versierte Person dies tun soll, gibt es 2026 legale Wege.
Methode | Geeignet für | Nuance |
|---|---|---|
Outlook-Add-In (Office.js | Entwickler | Offizielle API, 1.000.000 Zeichen Limit pro Einfügung. Funktioniert sowohl im Web als auch im neuen Outlook |
Fertiges Add-In aus AppSource („Insert HTML by Designmodo") | Nicht-technische Benutzer | Microsoft-verifiziert, Installation aus dem Store. Hauptersatz für DevTools |
Browser-Erweiterung (HTMaiL) | Die, die im Browser leben | Drittanbieter, ~30.000 Benutzer. Risiken abwägen: Erweiterung erhält E-Mail-Zugriff |
Microsoft Graph API ( | Automatisierung und Massenversand aus Code | Erfordert Token. Unsicheres HTML wird gefiltert standardmäßig |
Klassisches Outlook: „Als Text einfügen" | Die, die noch klassisch nutzen | Button muss manuell zur Symbolleiste hinzugefügt werden. Keine Methode im neuen Outlook |
Separat: Die eingebauten „Meine Vorlagen" für HTML funktionieren nicht, sie speichern nur Text, ohne Formatierung und Bilder.
Stolperfallen 2026
- Skripte kommen nicht durch. Microsoft entfernt potenziell gefährliches HTML,
<script>, Formulare, Interaktivität. Das ist keine Neuigkeit von 2026, es ist XSS-Schutz, und Sie können ihn auch nicht über DevTools umgehen: Die Filterung geschieht auf dem Server. - E-Mail-Größe. Halten Sie das HTML innerhalb von 80-100 KB. Gmail beschneidet Nachrichten bei etwa 102 KB und versteckt den Rest hinter einem Link „Gesamte Nachricht anzeigen".
- Dark Theme. Outlook.com invertiert Farben teilweise selbst. Fügen Sie
<meta name="color-scheme" content="light dark">und<meta name="supported-color-schemes" content="light dark">hinzu, aber es gibt keine narrensichere Methode, die Invertierung zu verhindern, Microsoft selbst räumt dies ein. - Kyrillisch. Setzen Sie
<meta charset="UTF-8">an den Anfang der Vorlage, sonst erhalten Sie Kauderwelsch. - Plain-Text-Version. Über DevTools haben Sie keine Kontrolle über den Plain-Text-Teil: Outlook generiert ihn selbst aus dem HTML. Für kritische Mailings ist das ein Argument für einen ordentlichen Mailing-Dienst.
⁉️🤔 Häufig gestellte Fragen
Warum erlaubt Outlook Web kein direktes Einfügen von HTML?
Bei normalem Strg+V übergibt der Browser die Daten als
text/plain, nicht alstext/html, das ist ein Schutz vor bösartiger Markup-Injektion. DevTools umgeht die Barriere, weil es das DOM direkt modifiziert und das Eingabefeld für Nachrichten ein gewöhnlichercontenteditable-Block ist. Microsoft versteckt keinen „geheimen Button": Ein offizieller Weg, beliebiges HTML in der Webversion einzufügen, ist schlicht nicht vorgesehen.
Funktioniert die Methode 2026 noch?
Aktuelle Anleitungen von 2024-2025 beschreiben sie, und es gibt keine sichtbaren technischen Änderungen, die sie brechen würden. Aber Microsoft dokumentiert die Methode nicht und verspricht nicht, sie zu unterstützen: Der Outlook-Web-Editor basiert auf RoosterJS mit einem internen Inhaltsmodell, und theoretisch könnte er das eingefügte HTML überschreiben. Genau deshalb ist der Schritt „E-Mail an sich selbst senden" nicht optional. Geprüft, gesendet.
Funktioniert das im neuen Outlook für Windows?
In der Desktop-Anwendung selbst nicht: DevTools wurden dort absichtlich deaktiviert. Aber das neue Outlook ist ein Wrapper über dieselbe Weboberfläche, öffnen Sie also einfach
outlook.office.comin einem Browser, verfassen Sie die E-Mail dort und senden Sie sie. Das Ergebnis ist identisch.
Bleibt das HTML erhalten, wenn Sie den Entwurf schließen?
Nein. Die Bearbeitung lebt im DOM des aktuellen Tabs. Der geänderte Textkörper gelangt nur beim Senden zum Server (oder wenn der Entwurf automatisch gespeichert wird, aber verlassen Sie sich nicht darauf). Schließen Sie den Tab, und Sie haben einen Entwurf mit der Markierung
ForHTMLEmail. Bewahren Sie das Quell-HTML in einer Datei auf.
Kann man E-Mails jetzt mit Flexbox layouten, da das neue Outlook auf Chromium läuft?
Nein. Ihr Client entscheidet nicht, was die E-Mail beim Empfänger rendert. Solange das klassische Outlook mit der Word-Engine lebt (und Microsoft unterstützt es mindestens bis 2029), werden einige Adressaten ein zerbrochenes Layout sehen. Tabellen und Inline-Styles bleiben mindestens bis zum Ende des Jahrzehnts der Standard.
HTML lässt sich nicht einfügen, was ist zu prüfen?
Drei typische Ursachen. Erstens: DevTools findet die Markierung nicht, Tippfehler oder zusätzliches Leerzeichen, tippen Sie
ForHTMLEmailvon Grund auf neu. Zweitens: Ein Wust von Tags in der E-Mail, Sie haben den Feldinhalt vor dem Einfügen nicht gelöscht, drücken Sie Strg+Z und wiederholen Sie den Vorgang. Drittens: Nach Strg+Enter ist die E-Mail leer, DevTools hat die Bearbeitung wegen eines Markup-Fehlers abgelehnt (nicht geschlossener Tag, nicht gepaartes Anführungszeichen). Lassen Sie den Code durch den W3C Validator laufen.
Fazit: Zwei Regeln, die alles entscheiden
Der gesamte Prozess passt in eine Kette: Markierung → F12 → im DOM finden → Als HTML bearbeiten → einfügen → Strg+Enter → an sich selbst senden → prüfen → versenden.
Zwei Regeln, ohne die die Methode scheitert:
- Der Test an sich selbst ist nicht optional. Die Methode ist inoffiziell. Solange die E-Mail nicht in normaler Form in Ihrem Posteingang angekommen ist, gehen Sie davon aus, dass sie nicht funktioniert.
- Tabellen und Inline-Styles. Chromium unter der Haube des neuen Outlook hebt das klassische Outlook auf der Empfängerseite nicht auf.
Wenn Sie jede Woche HTML einfügen, sehen Sie sich das Add-In aus AppSource an: Es macht dasselbe, aber legal und mit zwei Klicks. Für einmalige Aufgaben sind die DevTools nach wie vor am schnellsten.
Welche E-Mails versenden Sie über Outlook Web und wie oft zerbricht das Layout bei den Empfängern? Schreiben Sie es in die Kommentare.



