yubb.de-Logo
Tutorials
yubb@yubb
yubbService
Inside yubb

Der strengste Seitencheck der Welt: Der Validator vom W3C



"Der Validator... Was ist das überhaupt?"
Schon mal nachgedacht, wer auf die Idee kam, dass
Code:
<html>
ein HTML-Dokument einleitet oder warum
Code:
<img>
der Befehl zum Einfügen von Bildern ist? Diese Befehle denken sich Leute vom W3C (frei übersetzt: World Wide Web Konsortium) aus. Sie erstellen in langen Sitzungen Elemente und neue Standards. Ihr neustes Werk ist die Zukunftssprache XML.
Diese Leute haben auf ihrer Seite http://www.w3c.org den sogenannten HTML-Validator. Das ist ein Online-Programm, das Quellcodes von Seiten auf die Richtigkeit der Standards testet. Ist etwas falsch, so wird eine Fehlermeldung ausgeben.

"Quelltexte interessieren doch eh nur Seitenklauer"
Diese Ausrede höre ich von immer mehr Leuten, die sich als "Webmaster" bezeichnen. Aber der Quelltext hat einen immensen Sinn. Nicht nur, dass er dafür sorgt, dass man etwas sieht, ist er z.B. auch für die Ladezeit zuständig. Ist auch ganz klar, je größer die Datei, desto länger dauert das Laden.
Aber meist ist ein Quelltext "dreckig" programmiert, dass nur der Internet Explorer die Seiten vernünftig darstellen kann. Vielleicht kommen auch neuere Versionen von Netscape mit dem Quelltext klar, aber ab Opera bzw. Mozilla ist Schicht im Schacht. Denn die Browser haben verschiedene "Fehlerkorrektur"-Programme eingebaut. Beim Internet Explorer ist das Programm äusserst variabel und fügt auch mal ein vergessenes
Code:
</td>
oder ein
Code:
</b>
dort ein, wo es hin soll. Andere Browser geben wegen diesen vergessenen Elementen einen extremem Kauderwelsch aus.
Darum ist es wichtig, einen möglichst validen Quelltext zu haben.

"Und wo ist dieser HTML-Validator?"
Du findest ihn unter http://validator.w3.org. Einfach deine Adresse eingeben und validieren lassen.

"Mal testen... Ach, du meine Nase, die Seite lädt und lädt und der Scrollbalken wird immer kleiner. Ist das gut?
Definitiv nicht. Denn, wenn alles ok ist, wird gleich recht weit oben der Glückwunsch ausgesprochen und man kann sich entspannt zurücklehnen.

"Und was mach ich nun, das lädt ja immer noch..."
Meist kann man die Probleme recht schnell beheben. Hier einige Beispiele von typischen Fehlern:

Falscher Doctype
Der Doctype gibt an, in welcher "Programmiersprache" die Seite geschrieben ist (da gäbe es die verschiedenen HTML-Versionen 4.0, 4.01 usw., XML oder XHTML). Dies ist wichtig für den Browser zum Interpretieren der Webseite.
Der Doctype sieht für HTML 4.01 so aus:
Code:
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Die meisten Seiten besitzten jedoch entweder keinen Doctype oder den verkürzten:
Code:
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
. Der verkürzte gibt zwar die Sprache samt Version an, aber nicht die Bibliothek für die Sprache. In dieser Bibliothek sind alle von W3C standardisierten HTML-Elemente gespeichert und abrufbar. Deswegen ist der Zusatz immens wichtig.

Verschachtelung nicht eingehalten
Zudem kann es sein, dass die korrekte Verschachtelung nicht eingehalten wurde. Das kann z.B. bedeuten, dass du diese Situation hast (verkürzt aufs wesentliche):
Code:
<table>
<p>Blablabla
</table>
</p>

Hier gibt der Validator einen Fehler aus: Du hast das Element
Code:
<p>
in der Tabelle
Code:
<table>
begonnen, aber ausserhalb der Tabelle
Code:
</table>
wieder geschlossen. Das geht nicht, du musst ein Element(1), der in einem anderen Element(2) ist, beenden, bevor Elemnt(2) beendet wird. Klingt kompliziert, ist aber logisch. Das valide Bespiel sähe also folglich so aus:
Code:
<table>
<p>Blablabla
</p>
</table>

Ein weiterer Aspekt ist das einfache Vergessen von Elementen. Kein Mensch ist perfekt, natürlich vergisst man mal ein abschliessendes
Code:
</td>
,
Code:
</table>
oder sogar das
Code:
</html>
. Auch hier schlägt der Validator an.

Nicht erlaubte Elemente/Attribute benutzt oder Attribute vergessen
Es gibt einige Dinge, die halten sich knallhart in den Köpfen niederer Webmaster. So auch Elemente oder Attribute, die es offiziell gar nicht gibt.
Auf einer Seite habe ich vor kurzem das Element
Code:
<nobanner></nobanner>
gefunden. Solche Elemente wie dieses gibt es schlicht und ergreifend nicht. Denn sie sind nicht in der Bibliothek der Elemente enthalten, auch wenn das Element an sich recht einfallsreich ist ;) Aber falsch ist falsch und das quittiert der Validator mit einer Fehlermeldung.
Darüber hinaus gibt es ein Attribut, das wird manchmal sogar von erfahrenen Webmastern empfohlen: die bgproperties. Mit diesem Attribut, eingesetzt im
Code:
<body>
, könne man ein Hintergrundbild "festkleben", dass es sich beim Scrollen nicht mitbewegt. Dieses Attribut ist aber von Microsoft erfunden. Darum wird er nur vom Internet Explorer erkannt. Die restlichen Browser haben, je nach Stärke der Fehlerkorrektur, mehr oder weniger Probleme damit. bgproperties ist aber ein nicht standartisiertes Attribut und deswegen auch eine Fehlerquelle. Das ist natürlich nur ein Beispiel, es gibt einige Atribute dieser Art.
Ein weiterer Aspekt ist das vollständige Ausnutzen von Attributen. Ich möchte dies am Beispiel eines Bildelements klar machen:
Code:
<img src="picture.jpg">
. Dieses Element fügt das Bild picture.jpg ein. Aber der Validator gibt mindestens eine Fehlermeldung für dieses kleine Element aus. Denn diesmal fehlt ein Attribut. Zu dem
Code:
<img>
-Befehl gehört nämlich laut W3C die Angabe eines Alternativtextes (alt) für Textbrowser oder Browser, die die Bildanzeige ausgestellt haben. Benutzt man dieses Attribut, so hat auch der Validator hieran nichts zu meckern:
Code:
<img src="picture.jpg" alt="Dies ist ein Demobild">
.
Und eines noch... Man muss mal mit einem Gerücht den Garaus machen: Tabellen können keine Höhenangaben besitzen.
Code:
<table border="0" width="500" height="60">
ist falsch. Möchtest du eine Höhenangabe nutzen, so tue dies in den
Code:
<td>
-Befehlen, da ists erlaubt, aber nicht in den
Code:
<table>
-Elementen!

"Oh mann, das ist ja viel. Ist der Validator echt so kleinlich?"
Ja, ist er. Der Validator (ich nenne ihn schon verliebt "Valli") drückt nie ein Auge zu. Wenn ein Fehler da ist, so gibt er ihn auch aus.
Aber nur so kann man auch eine valide Seite erhalten. Zudem helfen einem ja die Zeilenangaben und die englischen Kommentare. Arbeitet man einige Zeit mit dem Validator, so weiß man nach einiger Zeit, was er will und woran er meckert...

"Labern kannste viel! Ist deine Seite denn validatorgerecht, hä?"
Ja, ist sie, wie du unter dem About sehen kannst.

"Hmmm, coole Grafiken, woher/wofür bekomm ich die?"
Mach einfach eine valide Seite und du bekommst diese Grafiken.

"Und die 2. Grafik, was ist das.. Valid CSS?"
Stimmt. Der Validator hat noch n kleinen Bruder, der die CSS-Datei einer Seite genauso streng wie sein Großer validiert (http://jigsaw.w3.org/css-validator/). Hat man eine valide CSS-Datei, so bekommt man auch diese Grafik "verliehen".
Macht natürlich hammermäßig Eindruck, zu zeigen, dass seine Seite durch den härtesten Checker der Welt ohne Blessuren durchgekommen ist...

"Ahhh, ich hab alles gemacht und trotzdem meckert der!!!"
Kein Problem, schreib dein Problem einfach ins Forum, da hilft bestimmt einer.

Geschrieben von Phil Marx am 18.06.2004 (10446x gelesen)
weiterempfehlen weiterempfehlen   Druckversion Druckversion   kommentieren kommentieren

ich weiß ja nicht, bei mir findet der blöde valli 200 000 fehler, dabei wird die seite selbst von opera richtig angezeigt
Geschrieben von dasepp
>>Diese Befehle denken sich Leute vom W3C<<



HTML stammt nicht vom w3c - die sind jetzt dafür zuständig, html stammt vom CERN-Institud.



>><table>

<p>Blablabla

</p>

</table><<



das ist genauso invalide ... aber du hast dummerweise ein falsches Beispiel gewählt: table dard direkt nur <tr> enthalten, sonst nix ...



>><nobanner></nobanner><<



der hat bestimmt XML-Literatur zur Hand genommen



gruß

rené
Geschrieben von René
Erbsenzähler ;)
Geschrieben von Phil Marx
Naja, der Text enthält schon noch einige Fehler.

Auch wenn (oder gerade weil) er für Anfänger ist, würde ich nicht andauernd von "Befehlen" reden. Die gibt es in HTML einfach nicht....
Einmal schreibst du "Programmiersprache" im Zusammenhang mit HTML - du setzt es zwar in Anführungszeichen, es bleibt aber deshalb genauso falsch. Schreib doch einfach "[...]in welcher Sprache die Seite[....]" - ist genauso verständlich aber richtig.

Dann schreibst du weiter unten von "programmieren". HTML wird nicht programmiert sondern geschrieben.

Auf den Fehler mit dem table-Element hat dich ja René schon aufmerksam gemacht.

Außerdem ist es sicher nicht der strengste Seitencheck der Welt. Auch eine validierte Seite kann noch extrem schlechten Quelltext haben. Guter Quelltext ist auch semantisch richtig.

klugscheissend,
niemand
Geschrieben von niemand