1. Einführung in HTML-Dokument
Lass uns mal schauen, wie HTML-Dokumente aufgebaut sind. Womit beginnt jedes HTML-Dokument? Jedes HTML-Dokument hat eine Struktur, die aus drei verschachtelten Tags besteht: html
, head
und body
.
Das ist der Standard, ein Beispiel:
<!DOCTYPE html>
<html>
<head>
Servicetags
</head>
<body>
Hauptdokument
</body>
</html>
Alles, was der Browser anzeigt, befindet sich innerhalb des Paar-Tags
body
(Dokumentkörper). Innerhalb des Tags
head
befinden sich Tags mit
Service-/Hilfsinformationen
für den Browser.
Es ist auch üblich (nicht obligatorisch), den Dokumenttyp am Anfang zu schreiben — DOCTYPE, damit der Browser besser versteht, wie er Fehler interpretieren soll. Viele Browser können Dokumente mit kaputtem Layout korrekt anzeigen.
2. Beispiel für ein HTML-Dokument
HTML-Dokument — das ist die Grundlage jeder Webseite. Es informiert den Browser, wie die Seite aussehen soll. Hier ist ein einfaches Beispiel für ein HTML-Dokument:
<!DOCTYPE html>
<html>
<head>
<title>Seitenname</title>
</head>
<body>
<h1>Hallo, Welt!</h1>
<p>Das ist meine erste Webseite.</p>
</body>
</html>
Hauptteile eines HTML-Dokuments
Diese Zeile wird Dokumenttyp-Deklaration (doctype) genannt. Sie teilt dem Browser mit, dass das Dokument in HTML5 geschrieben wurde, der neuesten Version der Sprache HTML. Das ist wichtig für die korrekte Anzeige der Seite.
<html>
Das Tag <html>
öffnet das HTML-Dokument. Der gesamte Inhalt der Webseite muss sich innerhalb dieses Tags befinden. Es markiert den Anfang und das Ende des HTML-Dokuments.
<head>
Das Tag <head>
enthält Serviceinformationen über die Seite. Diese Informationen werden nicht direkt auf der Webseite angezeigt, sind aber für Browser und Suchmaschinen wichtig.
Das Tag <title>
definiert den Seitennamen, der auf dem Tab des Browsers angezeigt wird. Das ist das Erste, was der Benutzer beim Öffnen der Seite sieht.
<body>
Das Tag <body> enthält den gesamten sichtbaren Inhalt der Webseite: Texte, Bilder, Links, Tabellen und so weiter. Alles, was der Benutzer auf dem Bildschirm sieht, befindet sich innerhalb dieses Tags.
<h1>
Hallo, Welt!</h1>
Das Tag <h1> repräsentiert eine Überschrift der ersten Ebene. Es wird für die wichtigsten Überschriften auf der Seite verwendet. Der Text in diesem Tag wird in großer und fetter Schrift angezeigt.
<p>
Das ist meine erste Webseite</p>
Das Tag <p>
markiert einen Textabsatz. Es wird verwendet, um den Text in logische Blöcke zu unterteilen. Der Text in diesem Tag wird als normaler Absatz angezeigt.
GO TO FULL VERSION