Nachdem man einen Bericht geschrieben hat, prüft man ihn auf Fehler in der Rechtschreibung, Zeichensetzung und Grammatik. Viele Textverarbeitungsprogramme bieten für so etwas automatisierte Abläufe (Rechtschreibprüfung u. ä.).
So sollte man auch bei der Erstellung von Webseiten verfahren. Man sollte sie auf die korrekte Syntax prüfen lassen. W3C, welches für die Entwicklung von (X)HTML und CSS zuständig ist, bietet einen “Prüfer” (Validator) für (X)HTML und für CSS. Wobei man sagen muß, daß bei der fehlerhaften Rechtschreibung der Text meistens noch lesbar ist, bei fehlerhaftem HTML und CSS werden die Seiten u. U. fehlerhaft oder auch gar nicht angezeigt.
Es gibt einige Gründe warum man seine Webseiten prüfen lassen sollte. Zum einem können somit Fehler ausgemerzt werden, die evtl. bei dem einem oder anderem Browser Fehlerdarstellungen verursachen bzw. gar keine Darstellung. Zum zweiten, einen “sauberen” Quelltext vorausgesetzt, kann der Validator helfen um evtl. fehlende Tags (HTML-Markierungen) herauszufinden. Und zum dritten ist der Quelltext, der der Prüfung durch den Validator standhält, eine Art Gütesiegel. Denn wenn es dann Fehldarstellungen gibt, liegt es meistens an dem Browser und nicht an dem Quelltext.
Man kann seine Seiten entweder direkt auf der Website von W3C prüfen lassen oder auf eine der Browsererweiterungen zurückgreifen um die Prüfung zu automatisieren.
Wichtig ist auch, daß die zu prüfenden (X)HTML-Dokumente Angaben über den Dokumenttyp und den benutzten Zeichensatz (für westuropäischen und nordamerikanischen Sprachraum: text/html;charset=iso-8859-1) haben. Denn sonst kann der Validator die Dokumente nicht prüfen.
Wenn sich jemand mit diesem Thema nie beschäftigt hat, wird er bei der ersten Prüfung evtl. einen Schock bekommen, denn u. U. tauchen bei dieser Prüfung massig Fehler auf. Aber, keine Panik :-). Die meisten Fehler lassen sich sehr schnell und einfach ausmerzen. Der Validator meckert über fehlende alt-Texte bei den Bildern. Man sollte sowieso bei allen Bildern einen alt-Text einfügen, denn dieser Text erscheint, wenn das Bild aus diversen Gründen nicht geladen wird und diesen Text lesen die Suchmaschinen.
Dann meckert der Validator über das & im Quelltext. Wenn man im Klartext oder in der URL das kaufmännische UND (Ampersand) einfügen will, dann sollte man im Quelltext die HTML-Entity angeben &. Der Browser übersetzt es dann automatisch in &. Und alle sind glücklich :-).
Ein häufiger Fehler ist es ein HTML-Element nicht zu schließen bzw. es gibt die schließende aber nicht die öffnende Markierung. In diesem und im Fall von & taucht die Fehlermeldung im Validator mehrmals auf. Weitere Fehlerquellen sind, die missbilligten HTML-Elemente wie z. B. font (seit HTML 4.01) für Schriftformatierung. Hierbei sollte man sowieso auf CSS umsteigen. Denn CSS bietet mehr Möglichkeiten zur Schriftformatierung und mann kann die Schriftformatierung für alle Dokumente zentral verwalten bzw. auslagern. Es ist übersichtlicher, es erzeugt weniger Quelltext und Änderungen gestalten sich leichter.
Somit kann man sagen, daß die Beschäftigung mit dem Validator dem Webmaster einige Vorteile bietet. Man lernt mehr über (X)HTML und CSS bzw. man arbeitet „suberer“, der Quelltext ist übersichtlicher und kleiner und später, wenn der Quelltext valide ist, gestaltet sich die Fehlersuche einfacher. Es lohnt sich also den Validator zu konsultieren. Der Validator ist somit sehr praktisch und keine Erfindung von „Weltfremden Geeks die von der Praxis keine Ahnung haben“ (Zitat eines Grafikers).
Wir arbeiten seit 20 Jahren mit WordPress und bieten diverse Dienstleistungen rund um das System an. Kontaktiere uns für weitere Informationen oder für ein Angebot.
Hi Perun!
Sicherlich ist ein “valid-xhtml”-Button eine tolle Auszeichnung. Wenn es aber nicht funktioniert, dann wird schnell der Seite -und nicht dem Browser- die Schuld daran gegeben. Argument der Kläger: Bei anderen geht es ja auch. Einfach nur validieren bringt im echten Leben leider noch nichts, testen ist immer notwendig.
Nebenbei ist in Opera für jede Seite “Quelltext prüfen” möglich. Strg-Alt-V übergibt den URI dann an den W3-Validator und öffnet ein neues Fenster für die Ergebnisse.
Insgesamt ein toller Artikel, leider ist
fontnicht generell verboten (obwohl es das sein sollte, sondern in den neueren HTML-Versionen schlicht und ergreifend nicht mehr vorhanden. CSS bietet dafür dann natürlich mehr als guten Ersatz. Übrigens kann man auch sein CSS validieren lassen.Du kannst dir ja mal meine CSS- Seiten ansehen.
Ich hoffe, ich habe jetzt eine valid comment geschrieben
;-)[„Sicherlich ist ein “valid-xhtml”-Button eine tolle Auszeichnung. Wenn es aber nicht funktioniert, dann wird schnell der Seite -und nicht dem Browser- die Schuld daran gegeben. Argument der Kläger: Bei anderen geht es ja auch. Einfach nur validieren bringt im echten Leben leider noch nichts, testen ist immer notwendig.“]
Hi Mathias,
das man seine Website unter mehreren Browsern testet setze ich voraus. Tue ich auch. Worum es mir eher ging ist folgendes: wenn der Code nicht valide ist und die Seite in einigen Browsern nicht das gewünschte Aussehen hat, dann hat man nicht so eine starke Argumentation wie wenn der Code valide ist. Und ich rede hier von privaten Websites und nicht von Auftragsarbeiten. Ich gehe mal davon aus, daß Leute die sowas profesionnel betreiben schon wissen was der HTML-Validator macht 😉 dieser Bericht richtet sich eher an Leute die wenig oder keine Erfahrung mit dem Validator hatten.
Aber es gibt auch genug Beispiele für große und kommerzielle Websites die sich an die Webstandards halten. Allerdings ist es mir schon klar, daß man manchmal, wenn der Kunde darauf drengt, die eine oder andere Regel verwässern muss. Ich bin ja nicht Realitätsfremd.
[„Insgesamt ein toller Artikel, leider ist font nicht generell verboten“]
OK, du hast Recht. Da habe ich etwas überinterpretiert. In der HTML 4.01 Referenz ist es missbilligt.
[„Übrigens kann man auch sein CSS validieren lassen.“]
Weiß ich, der Link zum CSS-Validator steht schon im Text 😉
[„Du kannst dir ja mal meine CSS- Seiten ansehen.
Ich hoffe, ich habe jetzt eine valid comment geschrieben ;-)“]
🙂
Gruß
Hi Perun
Allerdings achte ich auch bei sog. Auftragsarbeiten, also Websites für andere, darauf, dass ich größtenteils standardkonformen Code schreibe. Leider muss ich immernoch auf den verbreitesten Browser (IE) achten, der z. B.
max-width(und ähnliche Eigenschaften) nicht unterstützt.Nebenbei: Der CS-Validator hat wohl ein paar Probleme… Ich habe das kurz in meinem Weblog erwähnt.
Hi Matthias,
„Allerdings achte ich auch bei sog. Auftragsarbeiten, also Websites für andere, darauf, dass ich größtenteils standardkonformen Code schreibe. Leider muss ich immernoch auf den verbreitesten Browser (IE) achten, der z. B. max-width (und ähnliche Eigenschaften) nicht unterstützt.“
Jepp, standkonformer Quelltext und Auftragsarbeiten schließen sich nicht zwangsläufig aus. Das
min-widthundmax-widthvon IE nicht unterstützt werden, finde ich auch schade.„Nebenbei: Der CS-Validator hat wohl ein paar Probleme“
Momentan betrifft es keine von meinen Websites, aber gut zu wissen.
Gruß
Hi Perun!
Naja, in meinem aktuellen Projekt habe ich mich dafür entschieden, Standards nicht um ihrer selbst willen zu befolgen. Die Unterseiten (nicht die Startseite) arbeitet mit
max-width.Zumindenst in den Browsern, die das kennen. Damit die Seite im IE vergleichbar aussieht, habe ich eine IE-only Definition verwendet. Eigentlich ist es nicht wirklich schlimm, da CSS-Regeln ignoriert werden, wenn sie nicht unterstützt werden.
Trotzdem jagt mir der CSS-Validator natürlich mein schönes Stylesheet in die Luft, da die IE-Regel proprietär ist. Ist aber ein Browser-Problem.
Es gibt keine alt-tags, es gibt aber ein alt-Attribut. Arrgh!
öhm….wo steht hier was von alt-tags????
alt Text lese ich, daran ist ja nix auszusetzen, oder?
Was den CSS-Bug betrifft. Geht es da um den voice-family hack?
Ich finde den Aufschrei in der Szene etwas übertrieben.
Insgeheim, finde ich es gar nicht so schlecht, dass das verwenden von
voice-familyin einem Stylesheet des Medientypsscreenals Fehler angemeckert wird.Das wäre ja dasselbe, wenn ich einem HTML-Element ein Attribut geben würde, welches für dieses Element gar nicht vorgesehen ist. Valides Element und valides Attribut, aber in der Kombination eben doch falsch…
Letzten Endes gibt es andere Möglichkeiten mit dem Broken Box Model des alten IE umzugehen, und wenns denn ein Hack sein muss, gibt es ja da auch noch den SBMH.
Ach ja, kleine Anmerkung noch zum Schluss (bisserl Korinthenkacken muss sein ;))…
XHTML Dokumente wenn möglich mit dem korrekten MIME-Typen anbieten (also nix text/html).
Grüße
Hi Minz,
Mea culpa bezüglich Mime-Type, aber dabei bin ich der besten Gesellschaft (Zeldman, Shea und CSS-Technik-News machen es auch) 🙂
Aber laut SelfHTML ist
text/htmlauch erlaubt. Auch im W3C-Buch von Stefan Mintert auf der Seite 378 steht auch das mantext/htmlbenutzen könnte. Oder verstehe ich da was falsch?Ich füge am Anfang auch keine XML-Deklaration (obwohl man es sollte), denn soweit ich weiß springt der IE6 dann in den Quirks-Modus und intepretiert das Box-Modell wie die IE5.x.
P. S. es stand tatsächlich alt-Tags (war aber alt-Text gemeint), tja, ich sollte doch lieber nicht nebenbei zocken während ich etwas schreibe 😉
Perun,
du hast schon recht. Die Specs sagen wohl über XHTML 1.0 es sollte nicht als
text/htmlangeboten werden.Über XHTML 1.1 wird allerdings der Syntax darf nicht verwendet.
Von daher gesehen bist Du da noch im grünen Bereich 😉
Muss ja auch zugeben, dass ich für diese Sache einen Browser-Sniff verwende, wovon ich eigentlich kein großer Fan bin.
Ich meine auch, wenn Du
text/htmlverwendest, brauchst Du auch die XML Deklaration nicht, da kein XML-Parser ins Spiel kommt.Auf der anderen Seite, wenn man den Box Model Hack verwendet, kann man getrost auch den IE6 in den Quirks-Mode versetzen, dann ist man Internet Explorer technisch auf er “sicheren” Seite 😉