HTML-Dokument

zum Vergrößern klicken

Dies ist eine Abbildung der Oberfläche des Open-Source HTML-Editors "Nvu". Zu sehen ist eine HTML-Seite mit 2 Zeilen Inhalt… Wie das? Es stehen doch schon 14 Zeilen Code in der Datei?

Wir wollen uns zunächst das Grundgerüst dieser Datei ansehen. Versuche dazu die nummerierten Elemente zu interpretieren. Als Hilfe kannst du dir die beiden folgenden Links :

Textauszeichnung

Grundgerüst eines XHTML-Dokuments

Zum Ausprobieren und Lernen eignet sich allerdings ein Web-Editor besonders gut: htmlPlayground

Doctype-Varianten

Webseiten sollten/müssen eine gültige DOCTYPE-Definition (DTD) am Anfang des (X)HTML-Documents haben, nicht nur um die richtige Definition und die damit verbundenen Konstrukte benutzen zu können, sondern um auch die Standardkonforme Rendering-Modus in den unterschiedlichen Browsern (Internet Explorer 6, Mozilla/Firefox, Opera,…) zu aktivieren. Wenn hier ein Fehler vorliegt oder die Definition einfach nur unvollständig ist (z.B. der URL-Part fehlt), dann wird der Standard-Modus nicht aktiviert, sondern anstelle dessen der Legacy Quirks Mode.

Was heißt das? Im Prinzip ist das nichts anderes, als dass man mitteilt, in welchen Dialekt man spricht, damit mein Gesprächspartner mich versteht. In diesem simplen Beispiel entspricht somit…

  • …die Mitteilung, welches Dialekt man spricht, der DOCTYPE-Definition
  • …der Standardkonforme Rendering-Modus dem "Übersetzen" und
  • …der Legacy Quirks Mode einer eigenwilligen (aber allgemeinen) Übersetzung, die leider nicht immer so interpretiert, wie man es haben möchte - vor allem Browserübergreifend sieht die ein und dieselbe Seite recht unterschiedlich aus.

Die Transitional DOCTYPE-Definition beinhaltet veraltete (und abgeschaffte) Tags wie font und center, während Frameset DTDs für Seiten, die Frames haben, benutzt werden sollten (d.h. die Seiten, die den frameset- und den frame-Tag beinhalten). Unten siehst du die möglichen Definitionen für HTML 4.01 und XHTML 1.0. Diese müssen am Anfang der (X)HTML-Datei platziert werden.

HTML 4.01

  • Strict:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

  • Transitional1):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

  • Frameset2):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

XHTML 1.0

Anmerkung: Obwohl die korrekte XML-Struktur die DTD nach dem XML-Prolog erwartet, setzt ein Fehler im IE6 den Modus zurück in den Quirks-Modus, wenn vor der DOCTYPE-Definition etwas ist (mehr dazu...).

  • Strict:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

  • Transitional3):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

(Der Transitional-Modus ist der, den wir zunächst benutzen werden.)

  • Frameset4):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Grundgerüst zum Kopieren

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de-de">
  <head>
    <title>Grundger&uuml;st</title>
    <meta name="author" content="E. Alkan" />
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
  </head>
 
  <body>
    <!-- Hier kommt euer Inhalt hin -->
 
  </body>
</html>
1) , 2) , 3) , 4) Transitional und Frameset DTDs schalten im Firefox & Mozilla Browser einen dritten Rendering-Modus ein, den sogenannten "fast Standard"-Modus.
start/info/08_diff/xhtml/dokument.txt · Zuletzt geändert: 23.10.2013 10:12 (Externe Bearbeitung)
www.chimeric.de Creative Commons License Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0