Herzlich willkommen zu deinem ersten Programmier-Tutorial! In dieser Serie lernst du HTML - das ist die Sprache, mit der so gut wie jede Webseite der Welt gebaut ist. Egal ob eine Suchmaschine, ein Online-Shop oder die Webseite deiner Lieblingsmannschaft: Ganz am Anfang steckt überall HTML dahinter.

Das Beste daran: Du brauchst nichts weiter als einen Computer und einen einfachen Texteditor. Kein teures Programm, keine Installation von riesiger Software, keine Vorkenntnisse. Wir fangen bei absolut null an und bauen Schritt für Schritt eine eigene kleine Webseite, die am Ende dieser Serie fertig ist.

Was passiert, wenn du eine Adresse eingibst?

Wenn du im Browser (das ist das Programm, mit dem du Webseiten anschaust, zum Beispiel Chrome, Firefox oder Safari) eine Adresse wie www.mironsoft.de eingibst, passiert im Hintergrund Folgendes:

1. Dein Browser fragt einen anderen Computer im Internet (den Server) nach der Webseite.
2. Der Server schickt eine Textdatei zurück - genau diese Datei schreiben wir in diesem Tutorial selbst.
3. Dein Browser liest diese Textdatei und zeichnet daraus die Webseite, die du siehst: mit Überschriften, Text, Bildern und Knöpfen.

Diese Textdatei ist in der Sprache HTML geschrieben (die Abkürzung steht für "HyperText Markup Language", aber der Name ist erstmal nicht wichtig). HTML sagt dem Browser: "Das hier ist eine Überschrift", "das hier ist ein Absatz", "hier kommt ein Bild hin". Der Browser liest diese Anweisungen und zeigt die Seite entsprechend an.

HTML, CSS und JavaScript: die drei Bausteine des Webs

Webseiten bestehen normalerweise aus drei verschiedenen Sprachen, die zusammenarbeiten. Stell dir ein Haus vor:

• HTML ist wie das Rohgerüst eines Hauses: Wände, Fenster, Türen - also der reine Inhalt und die Struktur.
• CSS ist wie die Farbe, die Tapete und die Möbel: HTML wird damit hübsch gemacht (Farben, Abstände, Schriftarten).
• JavaScript ist wie die Elektrik: Lichtschalter, die etwas passieren lassen, wenn man sie drückt - also Interaktion und Bewegung.

In diesem Tutorial lernst du ausschließlich HTML. Das ist volle Absicht: Genau wie man beim Hausbau erst das Gerüst baut, bevor man streicht, lernt man beim Programmieren erst HTML, bevor man CSS und JavaScript dazunimmt. Am Ende der letzten Lektion bekommst du einen kleinen Ausblick, wie es danach weitergehen könnte.

Was du am Ende dieser Serie können wirst

Wir bauen gemeinsam, über viele kleine Kapitel verteilt, eine eigene kleine Fußball-Fan-Webseite für einen Jungen namens Finn. Am Ende hat diese Webseite mehrere Unterseiten: eine Startseite, eine Seite mit seinen Lieblingsspielern, eine Bildergalerie und ein Kontaktformular. Jedes neue Kapitel fügt der Webseite ein neues HTML-Element hinzu - Schritt für Schritt, ohne Hektik.

Du kannst diese Webseite genauso mitbauen wie im Tutorial gezeigt, oder du änderst die Beispiele einfach ab und baust deine eigene Webseite über dein Lieblingsthema (Tiere, ein anderer Sport, ein Videospiel - was du magst). Der Code funktioniert genauso, nur die Wörter ändern sich.

Bist du bereit?

Im nächsten Kapitel richten wir gemeinsam die zwei einzigen Werkzeuge ein, die du für dieses gesamte Tutorial brauchst: einen Texteditor zum Schreiben und einen Browser zum Anschauen. Beide sind kostenlos. Los geht's!