HTMLCSSJavaScriptIndexRoadmapImpressum

Die Grundstruktur eines HTML Dokuments

In diesem Kapitel schaust du dir den Standard-Code an, der immer in deinem HTML-Dokument vorhanden sein muss.

Die Grundstruktur sieht folgendermaßen aus:

Grundstruktur Codebeispiel

1<!DOCTYPE html>
2<html lang="de">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>Seitentitel</title>
7    <style>
8        /* Kommentar: Hier kommt CSS rein */
9        p {
10            color: red;
11        }
12    </style>
13</head>
14<body>
15
16    <h1>Überschrift</h1>
17    <p>Das ist ein Absatz.</p>
18
19</body>
20</html>
  • <!DOCTYPEhtml>Teilt dem Browser mit dass es sich um ein HTML 5 Dokument handelt.
  • <htmllang="de"><html> Umschließt das gesamte HTML Dokument. lang="de" Das ist ein Attribut, das die Sprache des Inhalts angibt – in diesem Fall Deutsch (de = Deutsch).Mehr zu Attributen im Kapitel Attribute
  • <head>Enthält Informationen über die Website wie z.B. Title und Meta- Tags.
  • <metacharset="UTF-8"/>Legt die Zeichencodierung fest. Mehr dazu im im Kapitel Meta-Tags und Zeichencodeirung.
  • <metaname="viewport"content="width=device-width, initial-scale=1.0">Macht Seite responsive. Mehr dazu im im Kapitel Meta-Tags und Zeichencodeirung.
  • <title>Seitentitel</title>Bestimmt den Text im Browser-Tab und Name bei Google.
  • <body>Hier steht alles was Benutzer sehen.
  • <h1>Überschrift</h1>Hauptüberschrift der Seite.
  • <p>Das ist ein Absatz.</p>Normales Text Element

Im nächsten Kapitel lernst du: Meta-Tags und Zeichencodierung