Einführung in HTML

Dieses Kapitel gibt einen Überblick über HTML und dessen Rolle beim Erstellen von Webseiten. Ziel ist es, zu verstehen, was HTML ist, wofür es verwendet wird und wie Webseiten strukturiert werden.

1. Was ist HTML?

Definition:
HTML (HyperText Markup Language) ist eine Auszeichnungssprache, die zur Strukturierung von Inhalten im Web verwendet wird. Sie definiert Semantik und Struktur von Texten, Bildern, Links und anderen Elementen.

HTML selbst ist keine Programmiersprache, sondern beschreibt, was angezeigt wird, nicht wie es verarbeitet wird.

Webbrowser interpretieren HTML und rendern daraus die sichtbare Webseite.

2. Wofür wird HTML verwendet?

Erstellung und Strukturierung von Webseiten
Darstellung von Text, Bildern, Links, Tabellen und Formularen
Grundlage für CSS (Design) und JavaScript (Interaktivität)

Beispiel:
Eine einfache HTML-Struktur:

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

3. Historischer Hintergrund

HTML wurde 1991 von Tim Berners-Lee entwickelt, um wissenschaftliche Dokumente über das Internet zu verknüpfen.

Ziel: Hypertext-Dokumente verlinken
Später Erweiterung durch Tabellen, Formulare, Multimedia
HTML5: moderne Standards, Multimedia, semantische Elemente

4. Grundprinzipien von HTML

HTML besteht aus Elementen, die Inhalte markieren. Jedes Element wird meist durch ein Start- und ein End-Tag definiert:

<tagname>Inhalt</tagname>

Elemente können Attribute haben, z.B. <img src="bild.jpg" alt="Beschreibung">
Einige Elemente sind selbstschließend, z.B. <br> oder <img>
HTML ist hierarchisch: Elemente können andere Elemente enthalten

5. Hyperlinks und Navigation

Hyperlinks verbinden Seiten und Ressourcen im Web. Sie werden mit dem <a>-Tag erstellt.

<a href="https://www.example.com">Besuche Example</a>

Das href-Attribut gibt die Ziel-URL an.

6. Bilder und Multimedia

HTML ermöglicht die Einbindung von Bildern, Videos und Audio über entsprechende Tags.

<img src="bild.jpg" alt="Beschreibung" width="300">
<video src="video.mp4" controls></video>
<audio src="audio.mp3" controls></audio>

7. Tabellen und Listen

Tabellen werden mit <table>, <tr> und <td> erstellt. Listen mit <ul> oder <ol>.

<ul>
  <li>Erster Punkt</li>
  <li>Zweiter Punkt</li;
</ul>

<table>
  <tr><td>Name</td><td>Alter</td></tr>
  <tr><td>Anna</td><td>21</td></tr>
</table>

8. Zusammenfassung

HTML strukturiert Webseiten, keine Programmlogik
Grundelemente: Text, Links, Bilder, Listen, Tabellen
HTML ist hierarchisch und semantisch
Hyperlinks verbinden Ressourcen
Multimedia wird über spezielle Tags eingebunden