Lernen mit Tuxtechtalks

HTML

Was ist HTML?

HTML (Hypertext Markup Language) ist die standardisierte Auszeichnungssprache, die verwendet wird, um den Inhalt und die Struktur von Webseiten zu definieren. Sie beschreibt das Layout von Text, Bildern, Links, Tabellen und anderen Elementen im Web.

Grundstruktur einer HTML-Seite

Eine typische HTML-Seite hat folgende Struktur:

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="UTF-8">
    <title>Seiten-Titel</title>
  </head>
  <body>
    <h1>Überschrift der Seite</h1>
    <p>Dies ist ein Absatz von Text.</p>
  </body>
</html>

Erklärung der wichtigsten HTML-Tags

  • <!DOCTYPE html> – Gibt an, dass es sich um ein HTML-Dokument handelt.
  • <html> – Der Wurzel-Tag des Dokuments. Alles, was auf der Seite steht, ist innerhalb dieses Tags eingeschlossen.
  • <head> – Enthält Meta-Informationen über die Seite (z. B. den Titel, Zeichencodierung).
  • <meta charset="UTF-8"> – Definiert die Zeichencodierung des Dokuments. UTF-8 ist eine gebräuchliche Wahl.
  • <title> – Definiert den Titel, der im Browser-Tab angezeigt wird.
  • <body> – Enthält den sichtbaren Inhalt der Webseite, wie Text, Bilder, Links, usw.
  • <h1> bis <h6> – Überschriften. <h1> ist die wichtigste, <h6> die am wenigsten wichtige.
  • <p> – Stellt einen Absatz von Text dar.
  • <a> – Definiert einen Link zu einer anderen Seite oder Ressource.
  • <img> – Betten ein Bild in die Seite ein.

HTML-Tags und ihre Verwendung

HTML-Tags werden verwendet, um Inhalte zu definieren und zu strukturieren. Sie bestehen aus einem Start-Tag und in den meisten Fällen einem End-Tag:

  • Start-Tag: <h1> (Beginnt die Definition einer Überschrift).
  • End-Tag: </h1> (Beendet die Definition einer Überschrift).

Beispiel: Eine einfache HTML-Seite

Hier ist ein Beispiel für eine einfache HTML-Seite mit einer Überschrift, einem Absatz und einem Link:

<!DOCTYPE html>
<html>
  <head>
    <title>Meine erste HTML-Seite</title>
  </head>
  <body>
    <h1>Willkommen auf meiner Webseite!</h1>
    <p>Dies ist mein erster Absatz.</p>
    <a href="https://www.example.com">Besuche Beispiel.com</a>
  </body>
</html>