Was ist HTML?
HTML steht für HyperText Markup Language und ist die Sprache, die man für Webseiten verwendet. Sie bestimmt die Struktur und den Aufbau von Inhalten im Internet. Mit HTML kann man Texte, Bilder, Links, Tabellen und vieles mehr auf einer Webseite darstellen.
HTML besteht aus sogenannten Tags (z. B. <p> für Absätze oder <img> für Bilder), die den Inhalt der Seite in verschiedene Abschnitte unterteilen. Diese Sprache ist einfach zu lernen und bildet die Grundlage für deine Webseite. Ohne HTML gäbe es keine Webseiten, denn es sorgt dafür, dass Inhalte im Browser richtig angezeigt werden. Dein Browser wertet dann die Tags aus und kann so deine Webseite darstellen.
Zuerst muss der Dokumenten typ festgelegt werden in diesem Falle HTML. Damit weiss der Browser, welche Programmiersprache gesprochen wird. Das wird wir mit dem Tag gemacht:
<!DOCTYPE html>. Der Tag <main> zeigt an, dass man sich im Hauptbereich befinden. Der Tag <h1> ist eine Überschrift. Es gibt h1 - h6, h1 ist die grösste und h6 die kleinste Überschrift.
Auf dem Bild siehst du eine ganz Simple Webseite die nur mit HTML erstellt worden ist. Darunter im PDF-Dokument siehst du den zugehörigen HTML Code.
In der Tabelle siehst du noch einige nützliche HTML Tags die du kennen solltest um eine Webseite zu Programmieren.
| Tag | Bedeutung / Funktion |
|---|---|
| <html> | Start des HTML-Dokuments |
| <head> | Enthält Metadaten |
| <title> | Titel des Dokuments |
| <body> | Sichtbarer Bereich der Website |
| <h1> – <h6> | Überschriften (von groß nach klein) |
| <p> | Absatz |
| <a href=""> | Hyperlink |
| <img src=""> | Bild einfügen |
| <ul> | Ungeordnete Liste |
| <ol> | Geordnete Liste |
| <li> | Listeneintrag |
| <div> | Container für Block-Elemente |
| <span> | Inline-Container |
| <br> | Zeilenumbruch |
| <hr> | Horizontale Linie |
| <strong> | Fettgedruckter Text |
| <em> | Kursiver Text |
| <form> | Formular zur Dateneingabe |
| <input> | Eingabefeld |
| <button> | Button |
| <label> | Beschriftung |
| <table> | Tabelle |
| <tr> | Tabellenzeile |
| <td> | Tabellenzelle |
| <th> | Tabellen-Überschrift |
| <meta> | Metadaten |
| <link> | Externe Datei einbinden |
| <script> | JavaScript einbinden |
