Aufbau eines HTML Dokuments

Ein HTML-Dokument besteht aus verschiedenen Bestandteilen. Das erste Bestandteil ist das Identifizierungsmerkmal für das HTML Dokument, der sogenannte Doctype.

Der Doctype steht am Anfang jedes HTML Dokuments und definiert dabei, dass es sich um ein HTML Dokument handelt. Damit wird unterschieden, ob es sich um ein HTML 4, XHTML oder HTML 5 handelt.

Für HTML 4 sieht der Doctype folgendermaßen aus:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

Für XHTML sieht der Doctype wie folgt aus:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

Für HTML5 wurde das Doctype vereinfacht:

<!DOCTYPE html>

 

Struktur eines HTML Dokuments

Nach der Deklaration eines Doctypes kommt das erste HTML Element. Das erste HTML Element beinhaltet zwei weitere Elemente. Das erste Element ist der sogenannte HEAD. Der HEAD beinhaltet Informationen für die Internetseite, die nicht dargestellt werden. Das sind u. a. sogenannte META-Informationen.

Dort stehen beispielweise Informationen über den Zeichensatz, die Sprache, die oder Informationen für die Suchmaschinen drin. Es stehen Beschreibungen über die Internetseiten drin, die sogenannte Description. Die Description ist die Kurzbeschreibung, welches Sie z. B. bei den Suchergebnissen in Google sehen.

Description in den Suchergebnissen

Dann gibt es den Title Tag. Der Title Tag ist das, was im Browser auf einem Tab einer Seite angezeigt wird.

Title im Tab eines Browsers

Dann gibt es noch die Stylesheets. Mit Stylesheets können Sie CSS einbinden. CSS kümmert sich um die Darstellung der Internetseite, z. B. Farben, Abstände usw.

Über den HEAD Bereich können auch noch Skripte eingebaut werden, mit denen Sie auf Ihrer Internetseite interaktive Elemente und Animationen ermöglichen können.

Neben dem HEAD steht der BODY, der Seitenkörper. Der BODY beinhaltet die Inhalte einer Internetseite.

 

Übersicht eines HTML Dokuments

Aufbau eines HTMl Dokuments

 

 

Grundgerüst als Code im HTML Dokument

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<title>Hier kommt der Titel der Seite hinein</title>

<meta name="description"     content="Seitenbeschreibung">

<meta name="keywords"        content="Stichwort 1, Stichwort 2, usw.">

<meta name="author"         content="Ihr Name, beispiel@example.org">

<link rel="stylesheet" type="text/css" href="styles.css">

</head>

<body>

</body>

</html>


 

Allgemeine HTML Syntax

HTML ist eine Auszeichnungssprache für Dokumente bzw. Internetseiten. Im HTML Dokument werden Elemente, Attribute und Werte definiert.

 

HTML Elemente

Elemente werden mit den sogenannten „Tags“ dargestellt. Die meisten HTML Elemente haben einen Start-Tag, also ein einleitendes Tag und ein End-Tag, also ein schließendes Tag.

Start-Tag beliebiger Inhalt End-Tag

Ein Start-Tag beginnt immer mit dem Kleiner-Zeichen „<“. Danach kommt der Elementname, welches auch als Tag bezeichnet wird und wird mit dem Größer-Zeichen „>“ geschlossen.

Nach dem Start-Tag kommt der Inhalt, der ausgezeichnet werden soll.

Dann kommt der End-Tag, der immer mit dem Kleiner-Zeichen „<“ und einem Slash „/“ beginnt und mit dem Größer-Zeichen „>“ geschlossen wird.

<Tag> beliebiger Inhalt </Tag>

 

Attribute für HTML Elemente

Mit Attributen können Sie für HTML Elemente bzw. Tags Eigenschaften definieren, wie z. B. die Sprache oder der Name des Elementes. Es können beliebig viele Attribute in ein solches Tag geschrieben werden.

<Tag Attribut="Wert" Attribut="Wert"> beliebiger Inhalt </Tag>

 

Haben Sie Fragen oder Probleme beim Aufbau eines HTML Dokuments für gutes Webdesign? Gerne helfen wir Ihnen weiter. Kontaktieren Sie uns einfach.