HTML Introduction
HTML steht für HyperText Markup Language. Es handelt sich um eine Auszeichnungssprache, die zur Erstellung von Webseiten und Anwendungen verwendet wird, die im Internet angezeigt werden können. In den 1990er Jahren entwickelt, kombiniert es Hypertext (der Links zwischen Webseiten definiert) und Markup (das die Struktur des Inhalts festlegt).
HTML-Tags werden verwendet, um HTML-Elemente zu definieren. Ein HTML-Element besteht normalerweise aus einem Starttag und einem Endtag, wobei der Inhalt dazwischen eingefügt wird. HTML-Tags werden verwendet, um HTML-Dokumente zu erstellen und deren Inhalt in Webbrowsern darzustellen. Zu den grundlegenden HTML-Tags gehören <html>, <head>, <title>, <body>, <h1> bis <h6>, <p>, <br>, <hr>, <ul>, <ol>, <li>, <a>, <img> und viele mehr.
HTML-Versionen
HTML wurde 1990 vom britischen Physiker Tim Berners-Lee entwickelt. Seitdem gab es viele Versionen von HTML.
| Version | Jahr |
|---|---|
| HTML | 1991 |
| HTML+ | 1993 |
| HTML 2.0 | 1995 |
| HTML 3.2 | 1997 |
| HTML 4.01 | 1999 |
| XHTML 1.0 | 2000 |
| HTML5 | 2012 |
Grundlegende HTML-Konzepte
Elemente, Tags und Attribute sind grundlegende Konzepte in HTML.
HTML-Elemente sind die wichtigsten strukturellen Einheiten einer Webseite. HTML-Tags werden verwendet, um HTML-Elemente zu definieren, und Attribute liefern zusätzliche Informationen zu diesen Elementen.
HTML-Tags
HTML-Tags werden verwendet, um den Inhalt einer Website zu strukturieren (Text, Hyperlinks, Bilder, Medien usw.). Tags werden in Browsern nicht angezeigt; sie „weisen“ Browser lediglich an, wie der Inhalt der Webseite dargestellt werden soll.
Es gibt über 100 Tags in HTML, die Sie in unserem HTML-Tutorial finden können.
HTML-Tags werden in spitzen Klammern geschrieben (z. B. <html>).
Die meisten HTML-Tags kommen in Paaren vor, wie z. B. <p> </p>. Das erste Tag eines Paares wird als Start- (Öffnungs-)Tag bezeichnet, das zweite Tag als End- (Schließungs-)Tag. Die Informationen werden zwischen Öffnungs- und Schließungs-Tags geschrieben.
Es gibt jedoch auch nicht gepaarte bzw. leere Tags, die nur ein Öffnungs-Tag besitzen (z. B. <img>).
Betrachten wir ein Beispiel.
Wenn Sie einen Absatz definieren möchten (was ein Element ist), sollten Sie das <p>-Tag verwenden. Den Inhalt des Absatzes schreiben Sie zwischen das Öffnungs- (<p>) und das Schließungs- (</p>)-Tag.
Beispiel
Dies ist ein Absatz zwischen dem Öffnungs- <p> und dem Schließungs- </p>-Tag.
HTML-Attribute
HTML-Attribute werden zu einem HTML-Element hinzugefügt, um zusätzliche Informationen darüber bereitzustellen. Wenn Sie beispielsweise ein Bild mit dem <img>-Tag definieren, können Sie die Attribute src, height und width verwenden, um Informationen zur Quelle, zur Höhe und zur Breite bereitzustellen.
Struktur eines HTML-Dokuments
Die <!DOCTYPE html>-Deklaration gibt die im Dokument verwendete HTML-Version an. Jedes HTML-Dokument sollte mit dieser Deklaration beginnen, damit Browser die Seite konform zu den HTML-Standards rendern können.
Für jede HTML-Version gibt es mehrere definierte <!DOCTYPE>-Typen.
Der gesamte Inhalt der Webseite wird zwischen <html>- und </html>-Tags geschrieben. Das <html>-Element dient dazu, den Browsern mitzuteilen, dass es sich um ein HTML-Dokument handelt.
Das <head>-Element enthält Metadaten (Daten über das HTML-Dokument), Zeichensatz, Dokumenttitel, Stylesheets usw. Diese Daten werden den Besuchern nicht angezeigt.
Der <title> zeigt den Titel der Webseite in der Browserregisterkarte an, wenn die Seite geladen wird. Der Titel wird zwischen <title>- und </title>-Tags geschrieben.
Das <body>-Element enthält den Inhalt der Webseite (Text, Bilder, Videos usw.). Der Inhalt wird zwischen <body>- und </body>-Tags geschrieben.
Überschriftenelemente enthalten verschiedene Arten von Überschriften. Es gibt sechs Überschriftenebenen - <h1>-<h6>, wobei <h1> das wichtigste und <h6> das unwichtigste Tag ist.
Das <p>-Element enthält Textabsätze. Der Inhalt wird zwischen <p>- und </p>-Tags geschrieben.
Beispiel
HTML-Einführung
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Title of the document</title>
</head>
<body>
<h1>The most important heading.</h1>
<p>The first paragraph.</p>
<h2>Subheading</h2>
</body>
</html>Ergebnis
Um mit dem Schreiben von HTML-Code für Ihre Website zu beginnen, benötigen Sie einen Editor. Sprechen wir im nächsten Kapitel über HTML-Editoren.
Praxis
Was ist HTML und wofür wird es laut der angegebenen Webseite verwendet?