HTML ändern · Anleitung

HTML-Datei erstellen — Windows und Mac

Kurz gesagt: Eine HTML-Datei ist eine reine Textdatei mit der Endung .html. Du brauchst kein Programm dafür — Notepad oder TextEdit genügen. Entscheidend sind zwei Dinge: das Grundgerüst im Inhalt und die richtige Endung beim Speichern. An der Endung scheitern die meisten.

Das Grundgerüst zum Kopieren

<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Meine Seite</title>
</head>
<body>

  <h1>Hallo</h1>
  <p>Das ist meine erste Seite.</p>

</body>
</html>

Das ist alles. Kopiere es in einen Texteditor, speichere es als seite.html, doppelklicke die Datei — fertig, deine erste Seite läuft im Browser.

Was die Zeilen im Kopf bedeuten

Zeile	Wofür sie da ist	Weglassen?
`<!DOCTYPE html>`	Sagt dem Browser: Das ist modernes HTML	nein — sonst schaltet der Browser in einen alten Modus und das Layout verrutscht
`lang="de"`	Die Sprache der Seite	besser nicht — Screenreader lesen sonst mit falscher Aussprache vor
`charset="UTF-8"`	Die Zeichenkodierung	nein — sonst werden Umlaute zu Zeichensalat
`viewport`	Macht die Seite auf dem Handy nutzbar	nein — ohne diese Zeile erscheint die Seite mobil winzig
`<title>`	Steht im Browser-Tab und in Google-Ergebnissen	nein

Der Unterschied zwischen head und body: In den <head> gehört alles, was der Besucher nicht sieht — Titel, Kodierung, Stylesheets. In den <body> gehört alles Sichtbare. Wer Text versehentlich in den head schreibt, sieht ihn auf der Seite nicht.

Speichern — hier geht es meistens schief

Windows

Notepad öffnen (Windows-Taste, „Notepad" tippen, Enter).
Code einfügen.
Strg + S.
Wichtig: Unten im Feld Dateityp von „Textdokumente (*.txt)" auf „Alle Dateien" umstellen.
Als Namen seite.html eingeben und speichern.

Die Endungs-Falle: Vergisst du Schritt 4, hängt Windows stillschweigend .txt an. Die Datei heißt dann seite.html.txt und ist keine Webseite, sondern eine Textdatei — der Browser zeigt nur Code. Und weil Windows bekannte Endungen standardmäßig ausblendet, siehst du den Fehler nicht.

Schalte das einmal dauerhaft ab: Im Explorer oben auf Ansicht, dann Anzeigen, dann Dateinamenerweiterungen anhaken. Ab jetzt siehst du bei jeder Datei, wie sie wirklich heißt. Das ist die nützlichste Einstellung, die du an Windows vornehmen kannst, wenn du mit Dateien arbeitest.

Mac

TextEdit öffnen (Cmd + Leertaste, „TextEdit" tippen).
Wichtig: Im Menü Format auf „In reinen Text umwandeln" klicken. TextEdit arbeitet sonst als Textverarbeitung und speichert Formatierungen mit, die die Datei unbrauchbar machen.
Code einfügen.
Cmd + S, Name seite.html.
Fragt der Mac, ob die Endung .html statt .txt sein soll: „.html verwenden" wählen.

Der häufigste Fall: Code aus einem KI-Chat zur Datei machen

Das ist inzwischen der übliche Weg — und der Grund, warum viele überhaupt nach „HTML-Datei erstellen" suchen. Du hast Claude, ChatGPT oder Gemini eine Seite bauen lassen und einen langen Code-Block vor dir.

Gibt es einen Download-Knopf? Dann nimm ihn. Prüfe danach nur, ob die Datei wirklich auf .html endet.
Gibt es nur „Kopieren"? Code kopieren, in einen Texteditor einfügen (bei TextEdit vorher „In reinen Text umwandeln"), als .html speichern.

Nimm den ganzen Block, von <!DOCTYPE html> bis </html>. Fehlt am Anfang oder Ende ein Stück, öffnet die Seite zwar, sieht aber kaputt aus. Und kopiere keine Erklärtexte der KI mit — nur den Code selbst.

Wenn die Datei dann steht und du Texte, Preise oder Bilder darin ändern willst, musst du nicht zurück in den Chat. Wie das ohne Code geht, steht im Guide zu den drei Wegen.

Brauche ich einen richtigen Code-Editor?

Für eine einzelne Datei: nein, Notepad und TextEdit reichen. Wenn du regelmäßig im Code arbeitest, lohnt einer — er färbt den Code ein und zeigt sofort, wenn eine Klammer fehlt. Verbreitet und kostenlos sind Visual Studio Code und Notepad++ (nur Windows).

Nicht geeignet: Word, Google Docs, Pages. Diese Programme speichern eigene Formatierungen mit und zerstören die Datei. Mehr dazu auf HTML-Datei öffnen.

Die Datei ins Internet bringen

Eine .html-Datei auf deinem Rechner ist noch keine Website — sie liegt auf deiner Festplatte, in der Adresszeile steht file:///. Damit andere sie sehen, lädst du sie zu einem Anbieter hoch, bei dem deine Domain liegt. Wie das geht, hängt vom Anbieter ab; gesucht ist dort meist „Dateimanager" oder „Webspace".

Der Ablauf bleibt danach immer derselbe: Datei ändern, hochladen, ersetzen. Genau deshalb lohnt es, das Ändern schnell zu machen.

Und wenn die Datei schon steht

Dann brauchst du keinen Editor für Code, sondern einen fürs Ändern. PageFix ist ein deutschsprachiger Web-Editor für KI-gebaute HTML-Seiten: Datei reinziehen, anklicken, was anders soll, fertige Datei herunterladen.

Im Code

Datei im Editor öffnen, Stelle im HTML suchen, ändern, speichern, im Browser neu laden, prüfen. Vorher eine Kopie der funktionierenden Datei sichern.

Per Klick

Datei reinziehen, die fertige Seite erscheint statt des Codes. Anklicken, ändern, herunterladen. Ohne Code, ohne KI-Tokens, ohne neuen Chat.

Einmalzahlung von 49 €, kein Abo, Updates inklusive.

Häufige Fragen

Wie erstelle ich eine HTML-Datei?

Du öffnest einen Texteditor — unter Windows Notepad, unter Mac TextEdit —, fügst das HTML-Grundgerüst ein und speicherst die Datei unter einem Namen, der auf .html endet. Ein Zusatzprogramm brauchst du nicht. Bei TextEdit musst du vorher im Menü Format auf „In reinen Text umwandeln" klicken.

Warum zeigt mein Browser nur Code statt der Seite?

Dann endet die Datei nicht auf .html. Unter Windows hängt Notepad stillschweigend .txt an, wenn im Feld Dateityp nicht „Alle Dateien" gewählt ist — die Datei heißt dann seite.html.txt. Weil Windows bekannte Endungen ausblendet, siehst du das nicht. Schalte im Explorer unter Ansicht die Dateinamenerweiterungen ein.

Welche Zeilen braucht eine HTML-Datei mindestens?

<!DOCTYPE html>, damit der Browser modernes HTML annimmt; <meta charset="UTF-8">, damit Umlaute richtig erscheinen; und die viewport-Zeile, damit die Seite auf dem Handy nutzbar ist. Dazu <html>, <head> mit <title> und <body> für den sichtbaren Inhalt.

Kann ich eine HTML-Datei in Word erstellen?

Besser nicht. Word und andere Textverarbeitungen speichern eigene Formatierungen mit und erzeugen unter Umständen ein anderes Dateiformat. Die Seite funktioniert danach oft nicht richtig. Nimm einen reinen Texteditor oder einen Code-Editor.

Wie mache ich aus Code von ChatGPT oder Claude eine Datei?

Wenn es einen Download-Knopf gibt, nimm ihn. Sonst kopierst du den Code, fügst ihn in einen Texteditor ein und speicherst ihn als .html. Nimm den ganzen Block von <!DOCTYPE html> bis </html> und keine Erklärtexte der KI.

Warum erscheinen meine Umlaute als Zeichensalat?

Dann fehlt <meta charset="UTF-8"> im Kopf der Datei, oder der Editor hat die Datei in einer anderen Kodierung gespeichert. Ergänze die Zeile im <head> und speichere die Datei erneut als UTF-8.

Jetzt starten

Erst ausprobieren? Öffne die Demo — der echte Editor, ohne Konto.

Zuletzt aktualisiert: 12. September 2026

← Zurück zur Startseite und PageFix ansehen