oder: HTML: Warum das Internet aussieht wie es aussieht (und du schuld bist, wenn es hässlich ist)
HTML ist die Sache, die du täglich benutzt, ohne es zu merken – wie Zahnpasta oder deine Bildschirmzeit. Es ist der Grund, warum Webseiten aussehen, als wären sie Webseiten. Und nicht wie das Chaos aus Ordnern, Dateien und digitalen Scherben, das sie eigentlich sind.
Wenn HTML eine Person wäre, dann wäre sie die stille Mitbewohnerin, die nie was sagt, aber jeden Tag die Küche aufräumt. Du ignorierst sie, bis du das erste Mal selbst eine Webseite machen willst – und plötzlich merkst: Ohne sie geht gar nichts.
Also. Was ist HTML? Wirklich?
HTML steht für Hypertext Markup Language.
Übersetzt: Es ist eine Auszeichnungssprache – das klingt nach Prädikatsexzellenz, meint aber: Text bekommt eine Struktur. HTML beschreibt, was etwas ist, nicht wie es aussieht. Es sagt dem Browser:
„Hey, das hier ist eine Überschrift.“
„Und das da? Das ist ein Link zu irgendeiner dubiosen Webseite, die dein Cookie-Herz höher schlagen lässt.“
Ein Tag kommt selten allein
HTML funktioniert mit sogenannten Tags. Ein Tag ist wie ein Tupperdeckel – wenn du ihn nicht ordentlich zumachst, quillt dir irgendwann alles entgegen.
Ein Absatz zum Beispiel wird so geschrieben:
<p>Ich bin ein Absatz.</p>Ein öffnendes <p> und ein schließendes </p> – fertig. Mehr braucht’s nicht. Kein Punkt, kein Semikolon, kein Blabla. Der Browser versteht: Das hier ist Inhalt, formatiert als Absatz.
Und nein, du kannst das nicht einfach weglassen. HTML ist unforgiving. Du vergisst eine schließende Klammer, und schon sieht deine Seite aus wie eine kaputte Wikipedia-Version von 1998.
Der Grundaufbau einer Webseite
Hier. Lies das und atme ruhig durch:
So sieht jede Webseite im Kern aus. Kein Framework. Kein Baukasten. Nur du und ein paar spitze Klammern.
<html> ist der Wurzelknoten – also der Anfang von allem. Darin wohnen <head> und <body>.
- Im <head> stehen Metainformationen: Zeichencodierung, Seitentitel, CSS-Verlinkung, Google-Tracking-Skripte (liebe Grüße an die Datenschutzbeauftragten).
- Im <body> steht das, was der Mensch sehen soll: Texte, Bilder, Links, Listen, Chaos.
DOM: Wenn HTML Bäume pflanzt
Willkommen in der Welt des DOM – dem Document Object Model. Klingt sperrig, ist aber genial. Stell dir das HTML-Dokument als Baumstruktur vor. Ganz oben: <html>. Darunter zwei Äste: <head> und <body>. Die verzweigen sich weiter in <title>, <meta>, <h1>, <p>, etc.
Dieser DOM-Baum ist das, was dein Browser intern aufbaut – und was du siehst, wenn du in Chrome F12 drückst und die Developer Tools öffnest. Das ist kein Hackermodus. Das ist dein digitales Innenleben. Und dort kannst du live deine Seite manipulieren. CSS verändern, Elemente löschen, dich selbst in <h1> zur Königin des Internets ernennen. Du hast die Macht. Zumindest lokal.
Styling? Nicht HTMLs Job.
Wenn du möchtest, dass deine Überschrift rot ist und dein Text in Helvetica erscheint, dann ruf bitte CSS an.
HTML ist der Rohbau. CSS ist Tapete, Möbel und Farbkombination zwischen „Skandi-clean“ und „Pinterest-Overkill“.
Beispiel:
In deiner CSS-Datei (styles.css) schreibst du:
h1 {
color: tomato;
font-family: 'Comic Sans MS', cursive;
}Dann verlinkst du diese Datei im <head> deiner HTML-Seite:
<link rel="stylesheet" href="styles.css">Und zack: Deine Seite hat Stil. Oder zumindest Geschmack.
Und ja – du kannst das. Auch ohne Informatikstudium.
Du brauchst keine IDE, keinen Kurs auf Udemy, kein Youtube-Tutorial mit EDM-Beats im Hintergrund.
Öffne den Texteditor. Schreib <html>. Speichere es als .html. Öffne es im Browser.
Du wirst sehen: Es funktioniert.
Das ist das Schöne an HTML. Es verzeiht nichts – aber es zeigt dir alles. Kein Compiler. Kein schwarzer Bildschirm. Keine 387 Abhängigkeiten. Nur du und dein Code.
Das ist nicht retro. Das ist ehrlich.
Fazit: HTML ist der Beweis, dass du das Internet nicht verstehen musst, um es zu nutzen – aber solltest.
Wenn du eine eigene Website bauen willst, fang mit HTML an. Kein Baukastensystem. Kein WordPress. Nur Klartext.
HTML bringt dir bei, wie das Web funktioniert – nicht, wie man es hübsch anmalt.
Und wenn du irgendwann mit <div>-Spaghetti kämpfst oder dir CSS den letzten Nerv raubt, denk dran:
Ohne HTML ist deine Webseite nur ein leerer Bildschirm mit Träumen.
Nächste Folge: Warum <div> das toxische Beziehungselement des Webs ist. Und wie du lernst, wieder mit <section> zu daten.
Kommentar schreiben