Computer, Webwork

XHTML Grundgerüst

Ein Beispiel für ein standardkonformes XHTML Grundgerüst. Um das nicht im Raum allein stehen zu lassen gibt es im Anschluss noch einige Erklärungen dazu.


<?xml version="1.0" encoding="ISO-8859-1"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>HTML Grundgerüst</title>
<meta name="keywords" content="keywords, html, aufbau" />
<meta name="description" content="Hier kommt die Beschreibung der Seite hin." />
<meta name="author" content="Max Mustermann" />
<meta name="language" content="de" />
<link type="text/css" rel="stylesheet" href="style.css" />
</head>
<body>
</body>
</html>

  • Zum DOCTYPE muss ich sicher nichts mehr erklären, zu beachten ist hierbei nur, kein Zeilenumbruch zwischen zwei Anführungsstrichen. Weitere DOCTYPE Deklarationen sind in meiner kleinen DOCTYPE Übersicht zu finden.
  • Das <html>-Tag ist der Rahmen für die HTML-Datei. Alle Weiteren Tags stehen zwischen <html> und </html>
  • Der Head-Tag bietet einen Bereich für zusätzliche Informationen, die von Browser und Suchmaschinen ausgelesen werden können, zum Beispiel den Seitentitel und verschiedene Meta-Tags.
    • Das titel-Tag gehört zwischen den öffnenden und schließenden head-Tags (<head></head>), diese Angaben werden vom Browser in der Titelleiste angezeigt. Im Seitentitel sollten Schlüsselwörter verwendet werden, die in Bezug zum Inhalt der jeweiligen Seite stehen.
    • Die Meta-Tags stehen ebenfalls im Kopf-Bereich des HTML-Dokuments, beim Abrufen der Webseite an den Browser geschickt, aber nicht angezeigt. Mithilfe von Meta-Tag lassen sich Suchroboter von Suchmaschinen steuern. Suchmaschinen indizieren und benutzen die Meta-Angaben, auch wenn die Inhalte, der Meta-Angaben, gegenwärtig nicht zur Bestimmung des Rang herangezogen werden.
  • Das Body-Tag ist der eigentliche Seitenbereich, er enthält alle weiteren Tags und die Texte und Bilder, die auf der Webseite angezeigt werden sollen.
  • Externe Informationen werden mit Hilfe des <link>-Elements eingebunden

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

  • Das Attribut rel gibt an, in welcher Beziehung die Information zu der XHTML-Datei steht. In diesem Beispiel wird ein Sylesheet eingebunden, also wird der Wert „stylesheet“ verwendet. Durch einen relativen Link (href) wird auf die Externe CSS-Datei (style.css) verwiesen.