Eine kleine Einführung in das Thema XHTML: was ist das überhaupt, kann man das essen, welche Unterschiede gibt es zu HTML und auf was muss man bei der Notation achten?
was ist XHTML?
Die Abkürzung XHTML steht für Extensible HyperText Markup Language, zu deutsch: erweiterbare Hypertext-Auszeichnungssprache. Im Gegensatz zu HTML ist also das X am Anfang hinzugekommen. XHTML ist in der Lage, im XML-Format vorliegende Informationen zu verarbeiten – so kann man den Inhalt einer Website einmalig als XML-Datei anlegen und diese kann dann wiederum von den unterschiedlichsten Medien ausgelesen werden: Browser, Feedreader, PDAs, … eine Möglichkeit, die in Zukunft immer wichtiger werden wird.
Die Notation von XHTML entspricht weitestgehend der von HTML – man muss sich also nicht großartig in eine neue Sprache einarbeiten, wenn man von HTML auf XHTML umsteigen möchte. Lediglich einige Unterschiede gilt es zu beachten:
XML-Deklaration, Doctype & Namensraum
Ganz zu Beginn der Datei, also noch vor dem HTML-Tag, steht die XML-Deklaration. Diese enthält zum Einen die Information, dass es sich im Folgenden um eine XHTML-Datei handelt und gibt darüber hinaus über die verwendete Zeichenkodierung Auskunft.
<?xml version="1.0" encoding="ISO-8859-1" ?>
Den Doctype, sprich die Angabe des Dokumenttyps, kennt man schon von HTML her. Allerdings sieht er in XHTML etwas anders aus. Genau wie in HTML, kann man aber auch hier entscheiden, ob man Strict, Transitional oder Frameset verwendet. Notiert wird er nach der XML-Deklaration; für Transitional sieht er so aus:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Nun folgt das HTML-Tag – allerdings benötigt dieser in XHTML die Nennung des verwendeten Namensraums. Das heißt, dass man das öffnende HTML-Tag einfach um diese Angabe ergänzt:
<html xmlns="http://www.w3.org/1999/xhtml">
Kleinschreibung
In HTML spielt es keine Rolle, ob man <A HREF…> schreibt oder <a href…> – in XHTML hingegen schon. Hier müssen alle Element- und Attributmamen kleingeschrieben werden!
leere Elemente und der Slash
Als leere Elemente gelten diejenigen, bei denen zwischen dem öffnenden und schließenden Tag nichts notiert wird – dies ist zum Beispiel der Fall bei img, hr, br, link oder input.
Hier darf man in XHTML nun das schließende Tag nicht mehr notieren – stattdessen erhält das öffnende Tag am Ende einen Slash. Also:
<img src="..." alt="..." />
das alt-Attribut
… womit wir auch schon beim nächsten Punkt wären: die Angabe des alt-Attributs ist für Bilder zwingend notwendig. Was das alt bedeutet, kannst du hier nachlesen.
Anker
Wenn man in HTML einen Ankerpunkt setzt, benennt man diesen mit name=”blah” und springt ihn durch einen Link mit dem Ziel href=”#blah” an. In XHTML funktioniert solch ein Verweis nun nur noch, wenn anstelle von name das Universalattribut id verwendet wird (um sicherzustellen, dass auch ältere Browser damit klarkommen, sollte man beide Angaben notieren):
<a href="#blah">Verweis</a>
<p>... der Inhalt ... </p>
<a id="blah" name="blah">Ankerpunkt</a>
Attributwerte in Anführungszeichen
In HTML kannst du deine Attributwerte auch ohne Anführungszeichen notieren – beispielsweise <div id=content>. In XHTML muss der Attributwert nun zwingend in Anführungsstrichen stehen: <div id=”content”>.
alles richtig gemacht?
Wenn du deine bereits bestehenden Quelltexte nun in XHTML umgeschrieben hast oder komplett neu gecodet hast, dann solltest du nun zum Schluss überprüfen, ob du alles richtig gemacht hast und dein Code somit valide ist. Sehr komfortabel geht dies zum Beispiel auf dieser Seite – hier musst du lediglich deine URL eingebenen und erhältst eine Auswertung deines Quellcodes. Falls dir Fehler unterlaufen sind, werden dir diese mitsamt der Angabe der jeweiligen Zeile genannt.
Und wenn du alles richtig gemacht hast, kannst du deine Seite mit folgendem Button schmücken und deinen Besuchern somit zeigen, dass du auf valides Coding achtest:
Ich wollte schon immer mal wissen, was es mit diesem XHTML auf sich hat, dachte immer, das wäre wesentlicher komplizierter… Aber wenn es so ist, werde ich wohl beim nächsten Coding drauf umsteigen, da ich die meisten Sachen eh schon so mache… ^^
Danke für das Tut, dann weiß ich zumindest, wo ich drauf achten muss. :)
Ach ja: Wann ist das Tut für das stylesheet bei wordpress geplant? xD
Liebe Grüße.
komisch ist nur wenn ich das einfüge kann ich irgendwie keine sachen mehr per php includen da mekert er immer das die zeile nicht stimmt :S
ach problem behoben ich muss dann auch xml datei speichern dann geht das mit den includen wieder ^^
@ Mausz:
erm, entweder noch heute Abend oder innerhalb der nächsten drei Tage *versprech* ;-)
@ Nobi:
an sich musst du die datei nicht als *.xml speichern. Was für eine Fehlermeldung hattest du denn genau?
@ neontrauma:
er zeigt mir dann immer diese fehlermeldugn an
Parse error: syntax error, unexpected T_STRING in /var/www/web843/html/DeepSide/Lay1.php on line 1
@ Mausz:
feeertig… ;-)
http://neontrauma.de/wordpress/ein-wordpress-layout-erstellen-teil-3/
@ Nobi:
mh, die oberste Zeile, sprich die XML-Deklaration, kann man auch rauslassen, nur der Doctype muss auf jeden Fall drinbleiben. Mit der XML-Deklaration fällt der Internet Explorer in den Quirks-Mode statt in den Standard-Mode wie alle anderen Browser (und wie es auch sein sollte).
@neontrauma:
hab sie nun auch rausgelassen aber doctype ist schon drinnen =)
Hallo!
Ich werde gerade durch mein Studium mit XHTML vertraut gemacht, vieles, was du hier schreibst, wusste ich daher schon. Deshalb hat mich eine Sache sehr erstaunt: wir haben die Anker nicht mit id=”Ankername” sondern nach wie vor mit name=”Ankername” gesetzt. Es funktioniert ;)
Hej,
in XHTML 1.0 Transitional ist das name-Attribut auch noch erlaubt; allerdings nicht mehr in 1.0 Strict sowie in 1.1.
Ah ok, das macht Sinn! Wir schreiben nämlich transitional. Danke dir!
Nichts zu danken =)
schöner und hilfreicher artikel =)
ich werd bald auch mal mein coding aufräumen und möglichst valide coden. mal gucken ob ich’s hinbekomme. ;)
woher weiß man eigentlich ob man jetzt strict, transitional oder frameset coden sollte und was gibt’s dort für unterschiede?
Kannst du bei xhtml ncoh n tut schreibn zum includen.
bzw geht das? kann ich xhtml zeug als .php abspeichern, usw..
wäre nett <3