HTML zu Text: Tags entfernen und sauberen Klartext gewinnen
📷 Florian Olivo / PexelsHTML zu Text: Tags entfernen und sauberen Klartext gewinnen
Wie man HTML-Tags entfernt, Klartext extrahiert, Entities dekodiert, Zeilenumbrüche erhält und wann man HTML-zu-Text statt HTML-zu-Markdown einsetzen sollte.
Es gibt eine ganz bestimmte Art von Frustration, die entsteht, wenn man Text von einer Webseite kopiert und ihn als riesige Wand aus <p>-Tags und -Zeichen einfügt. Oder wenn man eine HTML-E-Mail-Vorlage im Texteditor öffnet, um ein Zitat herauszuholen, und stattdessen <td>- und <span style="color:#333333">-Tags rund um jedes einzelne Wort vorfindet.
Genau das löst ein HTML-zu-Text-Konverter. Klingt simpel — Tags entfernen, Text anzeigen — aber es gibt genug kleine Fallstricke (Entities, Zeilenumbrüche, Normalisierung von Leerzeichen), sodass ein einfaches Regex-Replace nicht ausreicht. Dieser Artikel erklärt, was unter der Haube wirklich passiert, wann man dieses Tool braucht und wo es an seine Grenzen stößt.
Was ein HTML-zu-Text-Konverter wirklich macht
Oberflächlich betrachtet bedeutet die Konvertierung von HTML zu Text, alles innerhalb von < >-Klammern zu entfernen. Aber das ist nur der Anfang.
Tag-Entfernung ist der offensichtliche Teil. Jedes Element — <div>, <p>, <span>, <a>, <img>, das gesamte Repertoire — wird entfernt. Was bleibt, ist alles, was zwischen öffnendem und schließendem Tag stand.
Entity-Dekodierung ist der Punkt, an dem viele naive Implementierungen scheitern. HTML verwendet Entities, um Zeichen darzustellen, die andernfalls das Markup beschädigen würden. Das kaufmännische Und & wird zu &, das Kleiner-als-Zeichen < wird zu <, ein geschütztes Leerzeichen zu , und geschwungene Anführungszeichen erscheinen oft als “ und ”. Wer nur Tags entfernt, aber die Entities stehen lässt, erhält einen Text voller nackter Codes — kaum lesbar.
Ein ordentlicher Konverter dekodiert den vollständigen Satz benannter Entities (&, <, >, ", ', und Hunderte weitere wie —, ©, ®) sowie numerische Entities in dezimaler ( ) und hexadezimaler ( ) Form.
Erhalt von Zeilenumbrüchen ist das dritte wichtige Element. HTML behandelt Leerzeichen anders als reiner Text — mehrere Leerzeichen werden zu einem zusammengefasst, und Zeilenumbrüche im Quellcode haben visuell keine Bedeutung. Die Struktur, die man im Browser sieht, stammt aus Block-Elementen: <p>, <div>, <h1> bis <h6>, <li>, <blockquote>, <br>, <hr> und so weiter. Ein durchdachter Konverter fügt Zeilenumbrüche oder Leerzeilen ein, wenn er auf diese Elemente trifft, damit die Ausgabe eine gewisse Absatzstruktur aufweist, statt alles in einer einzigen langen Zeile zu bündeln.
Einfach /tools/html-to-text aufrufen, das HTML einfügen — das Tool erledigt alle drei Schritte automatisch.
Reale Anwendungsfälle
Hier sind die Situationen, in denen ich dieses Tool tatsächlich einsetze — vielfältiger als man zunächst vermuten würde.
HTML-E-Mail-Inhalte bereinigen
Moderne Marketing-E-Mail-Vorlagen enthalten notorisch viel HTML. Wenn ein Kollege eine E-Mail weiterleitet und man einen bestimmten Satz daraus zitieren soll, aber nur die rohe .eml-Datei oder eine chaotisch eingefügte Version aus Outlook hat, sieht der Inhalt so aus:
<td class="mcnTextContent" style="padding-top:0;padding-right:18px;padding-bottom:9px;padding-left:18px;">
<p>Wir freuen uns, unsere Q2-Produkt-Roadmap vorzustellen…</p>
</td>
In den Konverter eingefügt, erhält man:
Wir freuen uns, unsere Q2-Produkt-Roadmap vorzustellen…
Nur das war gefragt.
Klartextversionen für E-Mail-Kampagnen erstellen
Wer HTML-E-Mail-Kampagnen versendet, sollte immer auch eine Klartextversion als Fallback mitschicken — das verbessert die Zustellrate und dient Empfängern, deren E-Mail-Clients oder -Einstellungen kein HTML rendern. Die Klartextversion von Hand aus einer gestalteten Vorlage zu schreiben ist mühsam. Das HTML durch den Konverter laufen lassen ergibt einen brauchbaren Entwurf, den man dann bereinigt — echte Zeilenumbrüche einfügen, überflüssige Navigationslinks entfernen und so weiter.
Das Ergebnis wird nicht perfekt sein — Navigationsmenüs und bildlastige Header erzeugen oft seltsame Ausgaben — aber es ist ein wesentlich besserer Ausgangspunkt als eine leere Datei.
Web-Scraping und Inhaltsextraktion
Beim Scraping einer Webseite erhält man typischerweise das vollständige HTML zurück, das Navigation, Seitenleisten, Werbung, Footer und Skripte enthält. Nach der Auswahl des Hauptinhaltcontainers (mit einer Bibliothek wie BeautifulSoup oder cheerio) liegt der Inhalt oft immer noch als HTML vor. Ihn durch einen Konverter laufen lassen liefert lesbaren Text.
Für einmalige Scraping-Aufgaben — eine Produktbeschreibung kopieren, den Text eines Blogbeitrags extrahieren, ein Rezept herauslösen — ist das Einfügen des HTML ins Tool deutlich schneller als das Schreiben eines Parsers. Für systematische oder großangelegte Aufgaben braucht man serverseitige Tools, aber für schnelle Aufgaben ist dieser Ansatz kaum zu übertreffen.
Datenbank- oder Suchindexbefüllung
Wer Inhalte als HTML speichert (etwa in einem CMS-Blog oder einem Rich-Text-Editor-Feld), aber Klartext für die Volltextsuchindizierung, als KI-Modelleingabe oder für die Darstellung in einem Kontext ohne HTML-Rendering braucht, benötigt eine saubere Extraktion. Die Konvertierung in Klartext liefert eine Version, die sicher indiziert, verglichen oder an nachgelagerte Systeme weitergegeben werden kann, ohne das Risiko, Tag-Syntax preiszugeben.
In Klartext-Kontexte einfügen
Google Docs, Notion, reine Texteditoren, SMS-Vorlagen, Terminal-Ausgaben — es gibt viele Orte, die Text akzeptieren, aber kein HTML. Beim Kopieren von Text aus dem Browser werden oft versteckte HTML-Formatierungen mitgenommen. Erst zu konvertieren und dann aus der Klartextausgabe einzufügen, umgeht dieses Problem.
Was HTML-Entities sind und warum sie wichtig sind
Das verdient eine etwas ausführlichere Erklärung, denn hier passieren häufig Fehler.
Die HTML-Spezifikation definiert eine Reihe benannter Zeichenreferenzen — Zeichenfolgen wie &, <, >, " — die Sonderzeichen repräsentieren. Sie existieren, weil HTML selbst ein Textformat ist, das <, > und & als Syntaxzeichen verwendet. Um ein wörtliches < im Browser anzuzeigen, muss man im HTML < schreiben, sonst denkt der Browser, man beginne ein neues Tag.
Wenn man die HTML-Tags entfernt, aber die Entities stehen lässt, sieht das Ergebnis so aus:
Eingabe-HTML:
<p>Der Preis beträgt 10 € & der Versand ist kostenlos. Siehe die <Details>-Seite.</p>
Nach dem Entfernen der Tags:
Der Preis beträgt 10 € & der Versand ist kostenlos. Siehe die <Details>-Seite.
Nach dem Entfernen der Tags + Entity-Dekodierung:
Der Preis beträgt 10 € & der Versand ist kostenlos. Siehe die <Details>-Seite.
Die zweite Version ist das, was Nutzer im Browser tatsächlich sehen. Das ist das gewünschte Ergebnis.
Häufige Entities im Überblick:
&→&<→<>→> → geschütztes Leerzeichen (in der Ausgabe oft als normales Leerzeichen)—→—(Geviertstrich)…→…(Auslassungspunkte)©→©“und”→ linkes und rechtes geschwungenes Anführungszeichen
Ein guter Konverter verarbeitet all diese transparent.
HTML zu Text vs. HTML zu Markdown
Beide Formate konvertieren HTML in ein anderes Format, dienen aber unterschiedlichen Zwecken.
HTML zu Text verwenden, wenn:
- wirklich unformatierter, reiner Inhalt benötigt wird
- die Ausgabe an ein System weitergegeben werden soll, das kein Markdown versteht
- Klartextversionen für E-Mails erstellt werden
- Textanalyse oder Natural Language Processing betrieben wird, bei dem Markup nur Rauschen ist
- benutzergeneriertes HTML zur sicheren Speicherung oder zum Vergleich bereinigt werden soll
HTML zu Markdown verwenden, wenn:
- die Dokumentstruktur erhalten bleiben soll (Überschriften, Fettschrift, Kursivschrift, Links, Listen)
- Inhalte von einem HTML-CMS zu einem Markdown-basierten System migriert werden
- der Inhalt später an einem Ort gerendert werden soll, der Markdown unterstützt
- ein Ergebnis gewünscht wird, das ein Mensch noch komfortabel bearbeiten kann
Der entscheidende Unterschied: HTML zu Text verliert die gesamte Formatierungsstruktur. HTML zu Markdown behält sie in menschenlesbarer, bearbeitbarer Form. Wer einen Blog von WordPress zu Astro oder Hugo migriert, braucht die Markdown-Konvertierung. Wer Text für eine Suchmaschine oder ein Sprachmodell extrahiert, ist mit Klartext meist besser bedient.
Zeilenumbruchverhalten und was man erwarten kann
Einer der kniffligsten Aspekte der HTML-zu-Text-Konvertierung ist die Leerzeichen-Behandlung.
In HTML werden Zeilenumbrüche im Quellcode als Leerzeichen behandelt, und mehrere Leerzeichen werden zu einem zusammengefasst. Die visuellen Zeilenumbrüche im Browser stammen ausschließlich aus Block-Elementen und CSS. Beim Entfernen der Tags muss entschieden werden, was mit jeder Element-Grenze passiert.
Ein vernünftiger Regelkanon:
<br>→ einzelner Zeilenumbruch<p>,<div>,<h1>–<h6>→ doppelter Zeilenumbruch (Leerzeile davor und danach)<li>→ Zeilenumbruch mit einem Aufzählungszeichen oder einer Nummerierung<hr>→ eine Linie aus Bindestrichen oder einfach eine Leerzeile- Inline-Elemente (
<span>,<a>,<strong>,<em>) → nur ihr Textinhalt, kein zusätzlicher Abstand
Das HTML-zu-Text-Tool wendet Regeln wie diese an, sodass die Ausgabe lesbar und sinnvoll strukturiert ist — keine einzige monströse Zeile. Bei komplexen Layouts (Tabellen, mehrspaltige Divs) kann das Ergebnis unperfekt sein — dazu gleich mehr im Abschnitt zu den Einschränkungen.
Einschränkungen: Wo dieses Tool an seine Grenzen stößt
Ich möchte ehrlich darüber sein, was die HTML-zu-Text-Konvertierung nicht gut kann.
Bilder verschwinden vollständig. Es gibt keine Entsprechung für ein Bild in reinem Text. Das <img>-Tag wird zusammen mit src, alt und allem anderen entfernt. Wenn ein Bild wichtige Informationen trug — ein Diagramm, eine Grafik, ein Logo — gehen diese Informationen verloren. Der Alt-Text ist im HTML vorhanden, wird aber von den meisten einfachen Konvertern nicht ausgegeben. Wer den Alt-Text erhalten möchte, sollte zu Markdown konvertieren (wo Bilder zu  werden).
Komplexe Tabellenlayouts werden schlecht dargestellt. HTML-Tabellen, die für das Layout verwendet wurden — wie die altmodischen tabellenbasierten E-Mail-Vorlagen — produzieren oft schwer lesbaren Klartext. Zellen werden in Leserichtung zusammengefügt, was möglicherweise nicht dem entspricht, was ein Mensch erwarten würde. Einfache Datentabellen kommen gut rüber; komplexe Layout-Tabellen werden ein Durcheinander.
Per CSS versteckte Inhalte werden trotzdem einbezogen. Elemente mit display: none oder visibility: hidden sind im HTML-Quellcode weiterhin vorhanden, sodass ihr Textinhalt in der Klartextausgabe erscheint. Hat eine Seite ein verstecktes mobiles Menü, eine versteckte doppelte Überschrift oder versteckten Tooltip-Text, taucht das alles auf. Ohne die vollständige Browser-Rendering-Pipeline zu durchlaufen, ist kein Filtern nach CSS-Zustand möglich.
JavaScript-gerenderter Inhalt ist nicht vorhanden. Fügt man den rohen HTML-Quellcode einer Seite ein, die ihren Inhalt dynamisch per JavaScript lädt, sieht der Konverter nur das, was im statischen HTML steht — was möglicherweise sehr wenig ist. Für JS-gerenderte Seiten braucht man erst einen Headless-Browser, um die gerenderte Ausgabe zu erhalten.
Keine semantische Interpretation. Der Konverter weiß nicht, dass <nav> eine Navigation ist, die man möglicherweise überspringen möchte, oder dass <aside> eine Seitenleiste ist, die man wahrscheinlich nicht im extrahierten Inhalt haben will. Er behandelt alle Elemente gleich. Man sollte eventuell das HTML vorverarbeiten — <nav>, <footer>, <aside>, <script> und <style>-Blöcke entfernen — bevor man konvertiert, um eine sauberere Ausgabe zu erhalten.
Für Web-Scraping empfehlen sich im Produktionsbetrieb BeautifulSoup (Python) oder cheerio (Node.js), da sie das Targeting spezifischer Elemente mit Selektoren vor der Textextraktion erlauben. Das HTML-zu-Text-Tool eignet sich am besten für schnelle, einmalige Konvertierungen, bei denen diese Kompromisse akzeptabel sind.
Verwandte Tools
Der HTML-zu-Text-Konverter passt gut zu einigen anderen Tools:
- HTML-Encoder: Das Gegenteil der Entity-Dekodierung — Sonderzeichen zurück in HTML-Entities kodieren. Nützlich, wenn Text sicher in HTML eingebettet werden soll.
- HTML zu Markdown: Wenn die Struktur erhalten statt entfernt werden soll. Besser für die Inhaltsmigration.
- HTML-Minifier: Wenn das HTML beibehalten, aber durch Entfernen von Leerzeichen, Kommentaren und redundanten Attributen verkleinert werden soll. Anderes Ziel — Inhalt wird nicht extrahiert, sondern Markup wird komprimiert.
Ein schnelles Workflow-Beispiel
Angenommen, man hat den Quellcode des <main>-Elements einer Produktseite gescrapt und braucht den Klartext für eine Vergleichstabelle:
- HTML aus dem Scraper oder dem Browser-DevTools kopieren.
- In /tools/html-to-text einfügen.
- Die Ausgabe erscheint: Tags entfernt, Entities dekodiert, Block-Elemente in Zeilenumbrüche umgewandelt.
- Ergebnis in die Tabellenkalkulation kopieren.
Gesamtzeit: etwa 15 Sekunden. Das mit einem Regex in der Browser-Konsole zu erledigen würde länger dauern und würde die Entities mit ziemlicher Sicherheit zerstören.
Fazit
Die HTML-zu-Text-Konvertierung ist eine jener Aufgaben, die trivial erscheinen — bis man es wirklich versucht und feststellt, dass es mehrere Schichten von Komplexität gibt, die korrekt behandelt werden müssen. Tags sind der offensichtliche Teil; Entities und Leerzeichen-Normalisierung sind das, woran es hakt.
Das HTML-zu-Text-Tool erledigt alles in einem Schritt. Für schnelle, einmalige Extraktionen — aus E-Mails, gescrapten Seiten, CMS-Exporten oder überall sonst, wo es HTML-Daten gibt — ist es der schnellste Weg von Markup zu Klartext.
Wer Formatierungen lieber erhalten statt entfernen möchte, sollte sich HTML zu Markdown ansehen. Und wer direkt mit HTML-Entities arbeitet, findet in HTML-Encoder und HTML-Minifier nützliche Ergänzungen des Werkzeugkastens.