====== HTML und CSS ====== ===== Aufbau von HTML- und XHTML-Dokumenten ===== Der Grundaufbau von HTML- und XHTML-Dokumenten ist, abgesehen von sprachspezifischen Details, identisch. Im Wurzekhment %%%% befinden sich die beiden funktionalen Dokumentbereiche als Dokumentkopf und als Dokumentrumpf. Ersterer stellt einen Container für den Dokumenttitel und optional weitere dokumentbezogene Informationen dar, Letzterer enthält alle sichtbaren Bestandteile des Dokuments. Für die Grundstruktur des Dokuments werden also genau vier Elemente benötigt. Man bezeichnet sie als Struktursprache. Wie die beiden folgenden Beispiele verdeutlichen, sind die Unterschiede zwischen HTML 4, XHTML und HTML5 auf dieser Ebene nur gering: <code html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="de"> <head> <meta http-equiv="Content-Type" content="text/html:charset=UTF-8"> <title>Beispiel HTML 4.01 strict Beispiel HTML 4 01 strict \\ Beachten Sie, dass die Doctype-Deklaration in HTML 4 nicht Pflicht ist. Der HTML-Tag verfügt über ein ''lang''-Attribut. In XHTML ist Doctype hingegen Pflicht, der HTML-Tag besitzt einen Namensraum und verfügt hier über ein ''xml:lang''-Attribut: Beispiel XHTML 1.0 strict Beispiel XHTML 1.0 strict \\ Das neue HTML5 ist demgegenüber stark vereinfacht. Der Doctypc ist der denkbar simpelste, eine Namensraumsdeklaration ist nicht erforderlich (sie ist implizit), und wir haben wieder ein ''lang''-Attribut. Prägen Sie sich diesen Dokumentaufbau gut ein, denn hierin liegt die Zukunft: Beispiels HTML 5 Beispiel HTML 5 strict \\ \\ ==== Aufgaben des Dokumentkopfs ==== Im Dokumentkopf existieren neben dem obligatorischen -Ele-ment noch weitere optionale Elemente. Ihre Anzahl und Reihenfolge sind nicht reglementiert. Die gebräuchlichsten hiervon sind; * Metainformationcn (als <meta>-Tags) * Styleinformationen (über den <link>-Tag oder im <style>-Container) * Scriptinformationen (im <script>-Coniainer) === Der Scriptcontainer <script> in HTML und XHTML === Im Zusammenhang mit JavaScript ist der <script>-Tag von besonderem Interesse, weshalb wir ihn etwas näher beleuchten. Das <script>-Element wird zum direkten Einbetten von Scriptanweisungen verwendet. Es darf sowohl im <head> als auch im <body> des Dokuments in beliebiger Anzahl auftreten, wobei die Blöcke in der Reihenfolge abgearbeitet werden, in der sie im Dokument erscheinen {Scripts im Head also zuerst). Obligatorisch ist die Angabe des MIME Typs mittels des type-Attributs, In der Regel lautet er "text/javascript" für JavaScript. Der Programmcode kann sich direkt im Element befinden, aber auch von außen »hereingeholt« werden. Soll eine außerhalb des HTML-Dokuments liegende Java Script-Datei ausgeführt werden, wird sie über das src-Attributaddressiert. Die externen Scriptdaten verhalten sich, als ob sie sich direkt im Container befinden würden. Das <scr*pt>-Element bleibt in diesem Falle leer, muss aber dennoch mit einer Endmarke geschlossen werden. Das Pflichtattribut type nennt auch hier den MIME-Typ der verwendeten Scriptsprache: <code html> <script type="text/Javascript" src="extern.js"></script> </code> Diese Schreibweise ist in HTML und XHTML identisch. Problematischer ist das direkte Einfügen von Scripten, da das Inhaltsmodell von <script> laut Grammatik in HTML (CDATA-Inhalt) und XHTML (PCDATA-Inhalt) unterschiedlich definiert ist. Um das Parserverhalten zu vereinheitlichen, schließt man, um sicherzuge-hen, in XHTML-Dokumenten den Containennhalt in einen CDATA-Bereich ein.