Tastaturkürzel
Shortcuts und Programmtipps
Lotus-Software
Microsoft-Software
OpenOffice
Andere
Infos
DFÜ
Befehlszeilenparameter
und Programmtipps
Hardware
Fristenlisten
Obligatorisches
Downloads
Diese XHTML-Tipps dienen einer groben Übersicht über die kleinen Unterschiede zwischen HTML und XHTML. So können die gröbsten Schnitzer vermieden werden.
Einige Tags werden in XHTML 1.1 nicht von HTML 4 übernommen.
Grundsätzlich implementiert XHTML 1.1 nicht uneingeschränkt HTML 4. Zu diesen depricated Tags, also abgelehnten Tags, gehören <font>, <basefont>,
<center>, <dir>, <isindex>, <menu>, <s>, <strike>, <u>.
Ein gutes Webdesign wird durch die Trennung von Inhalt und Layout, so wie es XHTML vorsieht, einfacher. Und es ist auch schon der halbe Weg zur
barrierefreien Gestaltung, weswegen diese Themen in einer Frist zusammengefasst
werden.
Mit gängigen Weg-Editoren ist das XHTML-konforme Design nicht einfach, das besonders grafische Editoren das Bearbeiten im Quelltext schwierig machen.
Text-Editoren sind zwar einfacher, aber auch diese verwenden fast ausschließlich HTML-konforme oder gar proprietäre, also Browser-spezifische Tags. Hilfreich
ist es, wenn man viele HTML-Seiten auf einen Rutsch bearbeiten kann, um so zum Beispiel die <br>-Tags in <br />-Tags zu verändern. Aber gerade das Bearbeiten
von Tabellen und Grafiken ist im Quelltext mühselig. Auf der anderen Seite werden Informationen für Suchdienste besser zugänglich und die Indizierung
vereinfacht.
Barrierefreien Design erlaubt es nicht nur sehbehinderten, die Seiten besser lesen zu können, sondern wird von vielen Firmen gewünscht, Seiten, die von
öffentlicher Hand finanziert werden, müssen sogar per Gesetz ab dem 31. Dezember 2005 barrierefrei gestaltet sein.
Framesets vermeiden Framesets werden nicht eingesetzt. Man kann Inhaltsverzeichnisse und Texte zum Beispiel durch die von vielen Webhostern unterstützten SSIs zusammenbasteln, siehe auch SelfHTML. Fortgeschrittenes Zusammenstellen der verschiedenen Inhalte, die man sonst in Rahmen stecken würde, kann man auch mit PHP, Perl, ASP oder Python realisieren. |
|
Tabellen nicht als Layout-Hilfe einsetzen Tabellen werden nicht als Layouthilfe, sondern nur für tabellarische Inhalte verwendet, da Screenreader ansonsten überfordert werden. |
|
Tags klein schreiben Laut XHTML-Standard werden tags ausschließlich klein geschrieben |
|
Tags immer schließen Alle tags müssen in XHTML geschlossen werden. Deshalb werden alle tags, die in HTML nicht geschlossen durch entsprechende Tags ersetzt: <hr> wird zu <hr /> <br> wird zu <br /> <img …> wird zu <img … /> <b>…</b> wird durch <strong>…</strong> ersetzt. |
|
Doctype angeben - HTML - Strict: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> Transitional: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Frameset: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
- XHTML - |
|
Zeichenkodierung angeben XHTML-Dateien sollen im Kopf neben der Kennzeichnung als ebensolche auch die Zeichenkodierung enthalten: <?xml version="1.0" encoding="ISO-8859-1"?> oder <?xml version="1.0" encoding="UTF-8"?>. Einige ältere Browser kommen damit aber leider nicht klar. |
Validatoren einsetzen Mit Hilfe verschiedener Validatoren lässt sich die Konformität des Quelltextes überprüfen. Siehe Linkliste am Ende des Dokuments. |
|
Akronyme kennzeichnen Akronyme werden von Screenreadern wie zusammen geschriebene Worte behandelt. Deshalb werden diese Abkürzungen mit dem tag <acronym title="Ausgeschriebenes Akronym"> versehen. Zum Beispiel: <acronym title="Union der Sozialistischen Sowjetrepubliken">UdSSR</acronym>. |
|
Links durchnummerieren Links werden in der jeweiligen Seite mit der Tabulator-Taste von einem zum nächsten bewegt. Man kann diese Links, genau wie auch bei Formularen, aber in eine vorgegebene Reihenfolge bringen. Dazu dient hier wie dort das Attribut tabindex, zum Beispiel <a hef="verlinkteseite.shtm" tabindex="1">Hier und dort</a>. Ein sinnvoller Einsatz diese Attributes ist nicht nur eine Erleichterung für Sehbehinderte, sondern für jeden Betrachter einer Seite, der nicht nur mit der Maus kickt, sondern gerne auch die Tastatur benutzt. |
|
Tabellen betiteln Der Titel einer Tabelle steht in caption-Tags vor dem ersten td- oder th-Tag und wird im allgemeinen über die Tabelle geschrieben. Im Style-Sheet kann die Position entsprechen verändert werden. |
|
Tabellen-Inhalte differenzieren In Tabellen kann eine Zelle Daten oder eine Überschrift enthalten. Für Überschriften ist das Tag <th>, Für Daten das Tag <th> zuständig. Dadurch können auch hier zentrale Formate in den CSS-Dateien erstellt werden. |
|
Abkürzungen in Tabellen kennzeichnen mit Hilfe des abbr-Attributes kann man Abkürzungen in th-Tabellenzellen ausgeschrieben eintragen, damit ein Screen-Reader nicht die Abkürzungen vorließt, z.B.: <th abbr="Hamburg">HH</th> |
Bilder immer mit alt-Tag versehen Bilder werden immer mit alt-Tag versehen, es wird immer ein title-Tag gesetzt und bei wichtigen Bildern wird longdesc verwendet. Die Benutzung des alt-Tags ist in XHTML vorgeschrieben, title- und longdesc-Tags dienen der Übersicht und sind bei Benutzung eines Screenreaders sinnvoll. Die Unterschiede zwischen den einzelnen Attributen stehen hier. |
| [17. Juli 2008]