Overview
Das Video behandelt die grundlegende Syntax und den Aufbau von HTML-Tags, die für die Darstellung von Webseiten im Browser erforderlich sind.
Aufbau und Funktion von HTML-Tags
- HTML besteht aus sogenannten Tags, die bestimmte Bereiche im Text hervorheben oder formatieren.
- Ein HTML-Tag wird mit spitzen Klammern geschrieben: <Tagname>Text</Tagname>.
- Jeder öffnende Tag benötigt einen passenden schließenden Tag mit einem Slash, z.B. </Tagname>.
- Tags legen fest, wie der Browser den eingeschlossenen Text darstellen soll.
Beispiel für HTML-Tags
- Der <h1>-Tag definiert eine Überschrift erster Ordnung; der Text erscheint groß und fett.
- Beispiel: <h1>Überschrift 1</h1> zeigt „Überschrift 1“ als große, fette Überschrift.
- Alles zwischen öffnendem und schließendem Tag wird entsprechend formatiert.
Verschachtelte Tags und Reihenfolge
- Tags können verschachtelt werden, z.B. <b><i>Text</i></b> für fett und kursiv.
- Beim Verschachteln müssen die inneren Tags zuerst geschlossen werden ("LIFO-Prinzip").
- Falsches Schließen der Tags führt zu Darstellungsfehlern im Browser.
HTML-Datei und Darstellung im Browser
- Eine HTML-Datei wird vom Browser interpretiert, um das Layout anzuzeigen.
- Die Interpretation erfolgt von oben nach unten und Tag für Tag.
- Einzelne Tags wie <br> erzeugen Zeilenumbrüche und benötigen keinen schließenden Tag.
- Unformatierter Text außerhalb der Tags wird normal angezeigt.
Key Terms & Definitions
- HTML — Auszeichnungssprache zur Strukturierung von Webseiten mit Hilfe von Tags.
- Tag — Markierung im HTML-Code, bestehend aus öffnendem und meist schließendem Element zur Formatierung.
- Verschachtelung — Das Einfügen eines Tags innerhalb eines anderen Tags.
- <h1> — Tag für eine Hauptüberschrift, formatiert Text groß und fett.
- <b> — Tag für fette Schrift.
- <i> — Tag für kursive Schrift.
- <br> — Tag für einen Zeilenumbruch, benötigt keinen schließenden Tag.
Action Items / Next Steps
- Verschachtelte Tags selbst ausprobieren und auf die richtige Schließreihenfolge achten.
- HTML-Grundstruktur in einem Editor nachbauen und im Browser testen.