Übersicht HTML

Dies ist eine alte Version des Dokuments!

HTML (HyperText Markup Language) ist die grundlegende Sprache zur Strukturierung von Webseiten. Sie beschreibt den Aufbau und die Inhalte einer Webseite, damit Browser diese korrekt darstellen können. Das Layout und das ganze Aussehen der Webseite wird dann durch CSS definiert.

HTML ist keine Programmiersprache, sondern eine Auszeichnungssprache. Sie besteht aus sogenannten „Tags“, die Inhalte wie Texte, Bilder, Links oder Tabellen strukturieren.

Beispiel eines einfachen HTML-Dokuments:

<!DOCTYPE html>
<html>
  <head>
    <title>Meine erste Webseite</title>
  </head>
  <body>
    <h1>Willkommen!</h1>
    <p>Dies ist ein Absatz.</p>
  </body>
</html>

Ein HTML-Dokument besteht aus zwei Hauptteilen:

Head: Enthält Metainformationen über die Seite (z. B. Titel, Zeichencodierung, Stylesheets).
Body: Enthält den sichtbaren Inhalt der Webseite (z. B. Texte, Bilder, Links).

Typische Elemente im `<head>`:

`<title>` – Titel der Seite (wird im Browser-Tab angezeigt)
`<meta charset=„UTF-8“>` – Zeichencodierung
`<link>` – Verknüpfung zu externen CSS-Dateien
`<style>` – Interne CSS-Definitionen
`<script>` – Einbindung von JavaScript

Hier eine Auswahl der wichtigsten Tags:

`<html>` – Beginn des HTML-Dokuments
`<head>` – Metainformationen
`<body>` – Sichtbarer Inhalt
`<h1>` bis `<h6>` – Überschriften
`<p>` – Absatz
`<a href=„nk
`…` – Bild
`<ul>`, `<ol>`, `<li>` – Listen (ungeordnet/geordnet)
`
` – Container für Layout und Struktur
- `` – Inline-Container * `<table>` – Tabellen ====== Fazit ====== HTML ist die Basis jeder Webseite. Mit seinen einfachen, aber mächtigen Tags lassen sich Inhalte strukturieren und für den Browser lesbar machen. Für das Design und die Interaktivität kommen später CSS und JavaScript hinzu. ^ Tag ^ Beispiel ^ Erklärung ^ | `<h1>` | <code html><h1>Überschrift</h1></code> | Größte Überschrift. Es gibt sechs Stufen: `<h1>` bis `<h6>`. Wird für Titel und Untertitel verwendet. | | `<p>` | <code html><p>Dies ist ein Absatz.</p></code> | Absatz-Tag. Trennt Textblöcke voneinander. | | `<a>` | <code html><a href=„https://example.com/code> | Erstellt einen Hyperlink. Das `href`-Attribut gibt die Zieladresse an. | | `<img>` | <code html><img src=„bild.jpg“ alt=„n Bild ein. `src` gibt die Bildquelle an, `alt` ist eine Beschreibung für Screenreader oder bei Ladefehlern. | | `<ul>` / `<li>` | <code html><ul><li>Eintrag 1</li><li>Eintrag 2</li></ul></code> | Ungeordnete Liste mit Listeneinträgen. Für geordnete Listen verwendet man `<ol>`. | | `
  
  ` |
  
  <div>Inhalt</div>
  
  | Container für Layout und Gruppierung von Elementen. Häufig verwendet mit CSS. |

Übersicht HTML

Was ist HTML?

Aufbau eines HTML-Dokuments

Inhalt des head-Bereichs

Wichtige HTML-Tags

DokuWiki CSC