Validator
HTML-Validator: Die professionellen W3C-Validatoren sind am besten, um kostenlos und kinderleicht HTML oder CSS Ihrer Website zu prüfen und zu korrigieren.
- Inhaltsverzeichnis
Was ist ein HTML-Validator?
Ein HTML-Validator oder CSS Validator ist ein Programm, welches die formale Gültigkeit eines Dokumentes auf die Einhaltung der Regeln für HTML oder CSS überprüft. Der Validator prüft das Dokument beispielsweise auf:
- fehlende notwendige Elemente, z. B.
<head>und</head> - fehlerhafte Elemente z. B.
<span>als direktes Kind von<ul> - fehlende Attribute wie z. B.
<alt>bei dem Tag<img> - unzulässige Attribute z. B.
<alt>bei dem Tag<ul> - unbekannte Elemente bzw. Attribute wie z. B.
<fantasie> - Verschachtelungsfehler, wie z. B. Verwendung von
<h2>vor<h1>
Der Webdesigner erhält so wertvolle Informationen zur Entwicklung von validen Webseiten nach den Standards des Wordl Wide Web Consortiums (W3C).
W3C setzt Internet-Standards
Weltweit werden Webseiten nach dem W3C-Standard entwickelt. Das W3C ist das World Wide Web Consortium, das Standards für die Web-Entwicklung definiert. Zum W3C-Standard gehören beispielsweise Spezifikationen zu JavaScript, HTML5, XML, XHTML und CSS. Das W3C legt den jeweiligen Standard fest, entwickelt ihn weiter und pflegt ihn. Deshalb verwenden beispielsweise alle Web-Browser wie Google Chrome oder Mozilla Firefox die Richtlinien und Vorschriften des W3C-Konsortiums.
Daher sollten Sie möglichst W3C-konforme Webseiten erstellen, damit Ihre Webseiten richtig dargestellt werden.
Versuchen Sie Ihren Quellcode möglichst valide mit Ihrem HTML-Editor zu erstellen und sich damit an die Web-Standards des World Wide Web Consortiums (W3C) zu halten. Den Quellcode können Sie in Ihrem Browser über „rechte Maustaste“ > “Seitenquelltext anzeigen“ einsehen.
Die Einhaltung der W3C-Standards ist schwierig, aber zumindest sollte Sie versuchen, diese komplett einzuhalten.
Die Vorteile hierbei liegen auf der Hand:
- Ihre Internetseiten werden von verschiedenen Browsern korrekt dargestellt
- Ihre Webseiten werden kleiner und laden schneller.
- Ihre Webseiten lassen sich - nach einer Einarbeitung - leichter erstellen und weiterentwickeln.
- Jeder Webentickler kann Ihre Webseiten nach den Standards weiterentwickeln.
- Es werden keine Fehler ausgegeben.
- Ihre Webseiten sind zukunftssicher.
- Ihre Webseiten sind sicherer.
- Suchmaschinenoptimierung: Die Einhaltung der Spezifikationen des W3C-Konsortiums verbessert das Ranking in Suchmaschinen
W3C Validator: HTML und CSS validieren und korrigieren
Sie können die Syntax Ihres Codes sehr einfach mit dem Markup Validation Service des W3C prüfen und analysieren:
- Rufen Sie den kostenlosen HTML und CSS Validator des W3C auf.
- Geben Sie die URL der zu prüfenden Webseite ein, laden Sie den HTML-Code als Datei hoch oder geben Sie den Code direkt ein.
- Klicken Sie auf "Check". Fertig!
Als Ergebnis des ersten Prüfschritts erhalten Sie eine Übersicht der gefundenen HTML- und CSS-Fehler mit genauen Hinweisen zur Behebung. Sie finden im Prüfergebnis beispielsweise genaue Zeilenangaben und Fehler-Ursachen. Dies ist z. B. ein vergessenes schließendes Tag wie </p>, die veraltete Verwendung einer CSS-Anweisung oder falsche Verschachtelung von Tags, z. B. die Verwendung von <h2> vor <h1>. Dadurch können Sie die Fehler in Ihrem Dokument sehr leicht korrigieren.
In einem zweiten Prüfschritt können Sie über "More Options" > "Clean up Markup with HTML-Tidy" Ihren Quellcode automatisch bearbeiten lassen.
Der Markup Validation Service des W3C unterstützt ebenso das Validieren der Dokumenttypdefinition (DTD) für HTML. Der HTML-Validator prüft zum Beispiel, ob das Dokument einen <head>-Bereich hat und das richtige HTML-Grundgerüst sowie doctype verwendet:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Insgesamt bietet der W3C-Validator viele hilfreiche Funktionen zur Überprüfung der korrekten HTML-Syntax. Der Validator unterstützt auch die Entwicklung von barrierefreien bzw. barrierearmen Webseiten. Der Prüfdienst bietet jedoch leider keine Validierungsmöglichkeit des Quelltexts für verschiedene Browserversionen.
Validierung per URL-Eingabe, Datei-Upload oder Code-Eingabe
Ihren HTML-Code können Sie auf drei verschiedenen Wegen prüfen:
- Sie geben eine Internetadresse mit der genaue URL an. Beispiel:
https://www.bueroassistent.de/webdesign/validator - Sie laden eine Datei mit dem HTML-Code zur Überprüfung auf den W3C-Server.
- Sie geben Ihren HTML-Code direkt in ein Eingabe-Feld ein.
Nach einem Klick auf "Check" wird Ihr Code überprüft und Sie erhalten hoffentlich die erfreuliche Nachricht "Document checking completed. No errors or warnings to show." Ansonsten erhalten Sie vielfältige Hinweise bei der Fehlersuche und zum Korrigieren des Codes.
Fehlermeldungen filtern
Falls der Validator Fehler findet, können Sie mit Einsatz des "Message Filtering" bestimmte Fehlermeldungen ausblenden und die Fehlerausgabe strukturieren. Dadurch wird die Fehlersuche gerade bei vielen Fehlern erleichtert.
Weitere HTML-Validatoren
Nebem dem besten HTML-Validator des W3C gibt es noch weitere HTML-Validatoren, die Sie zur Validierung von HTML-Code nutzen können:
Nu Html Checker: HTML-Validator mit URL-Prüfung
Das W3C Konsortium bietet alternativ zum Markup Validation Service den Nu Html Checker - (X)HTML5-Validator an. Dieser Validator prüft HTML5-Webseiten ebenso einfach auf Übereinstimmung mit den Richtlinien des W3C. Dieses Validierungs-Tool basiert auf dem von Henri Sivonen entwickelten HTML-Validator. Es testet auf die korrekte Verwendung von HTML, CSS und Grafiken im Dateiformat SVG. Getestet wird hierbei jedoch nicht die Dokumenttypdefinition (DTD). Der Nu Html Checker ist Open Source und wird als Projekt bei https://validator.github.io/validator/ weiterentwickelt. Nu HTML Checker steht kostenlos für Linux, Windows und macOS zum Download bereit.
Sie können entweder eine URL überprüfen, Code eingeben oder eine Datei hochladen. Es besteht jedoch nicht die Möglichkeit Fehlermeldungen auszublenden (message filtering), wodurch die Auswertung der Fehlermeldungen erschwert wird.
HTML validieren per Datei-Upload oder Code-Eingabe
Mit zwei weiteren HTML-Validatoren können Sie Code per Datei-Upload oder per Code-Eingabe prüfen:
- Der HTML Validator bei appdevtools.com basiert ebenfalls auf dem Nu Html Checker des W3C. Als Besonderheit bietet dieser Validator die Möglichkeit, nur Teile des HTML-Code zu validieren. Hierzu aktivieren Sie die Option "Fragment". Der HTML-Code wird dann als Teil eines HTML-Dokuments behandelt und nicht als vollständiges Dokument.
Appdevtools.com bietet zusätzliche Validatoren für YAML und JSON. - Der freeformatter HTML-Validator basiert auf dem Nu Html Checker des W3C. Das Online-Tool unterstützt HTML5, SVG 1.1, MathML 3.0, ITS 2.0, RDFa Lite 1.1.
Freeformatter.com bietet zusätzliche Validatoren für XML und JSON.
HTML mit einem Web-Editor überprüfen
Ebenfalls sehr gut können Sie Ihren HTML-Code mit einem HTML-Editor validieren. Fast jeder HTML-Editor hat eine automatische Code-Prüfung und Code-Vervollständigung. Diese unterstützt Sie dabei, validen Quellcode für Ihre Webseiten zu erstellen.
Ähnlich wie ein HTML-Validator markiert ein Editor fehlerhaften HTML-Code und zeigt, wie dieser behoben werden kann
Chrome und Firefox Extension
Marc Guery bietet die Browser-Extension "HTML Validator" für Google Chrome und Mozilla Firefox an. Die kostenlose Webextension überprüft in Chrome oder Firefox Ihr HTML5-Dokument auf Validität. Dabei nutzt es Tidy und OpenSP, welche die Grundlage für den Validator des W3C bilden. Der Vorteil dieser Extension ist, dass die Überprüfung des Quelltexts auf dem lokalen Computer statt findet, ohne dass dafür Daten über das Internet gesendet werden müssen. Die Webextension wurde 2021 in Version 0.98 komplett neu programmiert und wird beständig weiterentwickelt. Sie funktioniert in Firefox ab der Browserversion 57 und in Google Chrome ab der Version 36.
CSS Validieren
Das W3C Konsortium bietet auch einen speziellen CSS Validator. Mit dem CSS Validation Service können Sie CSS Stylesheets per URL-Eingabe, Datei-Upload oder Direkt-Eingabe des CSS Codes validieren.
HTML-Links Validieren
Ein weitereres sehr nützliches Tool zur Fehlerkorrektur des HTML-Code ist der W3C Link Checker. Dieser Link-Checker prüft alle internen und externen Links einer Webseite auf korrekte Verlinkung. Er gibt genaue Fehler- und Korrekturhinweise mit Zeilenangaben, wenn er einen defekten HTML-Link findet. Besonders toll ist, das der W3C Link Checker auch fehlerhafte Sprungmarken (Text-Anker) innerhalb einer Webseite findet und auf den fehlerhaften Anker hinweist.
HTML-Validator deutsch
Leider gibt es keinen guten HTML Validator auf Deutsch. Alle hier vorgestellten Prüfdienste für HTML und CSS bieten nur Englisch und nicht Deutsch als Sprache an.
Fazit
Alle vorgestellten Tools zur Validierung von HTML-Code sind sinnvoll. Jedoch bietet der HTML-Validator des W3C die beste Benutzerfreundlichkeit mit der besten Qualität bei Fehlererkennung, Fehlersuche und Korrekturhilfen.
Testen Sie unbedingt immer wieder Ihre Webseiten mit dem HTML-Validator des W3C. Auf diese Weise erhalten Sie höchste Qualität bei der Gestaltung Ihrer Webseiten und sehr zufriedene Besucher Ihrer Website. Denn dann werden Ihre Webseiten richtig dargestellt und Besucher können sie ohne Fehler nutzen.
Im übrigen sind Syntax und Quelltext dieser Webseite standardkonform und weisen keine HTML-Fehler aus ;-)
Weitere Tipps zu HTML:
- HTML-Editor Online, WYSIWYG, kostenlos: 22 beste HTML-Editoren im Vergleich
- HTML Link einfügen mit a href - so geht's!
- HTML einfach und verständlich erklärt
- Phase 5 - exzellenter kostenloser HTML-Editor
- Bluegriffon - kostenloser WYSIWYG-HTML-Editor mit Vorschau | Download und Tutorial
- Linkchecker: kostenlos alle defekte Links finden - 5 beste Tools
FAQ
Was ist der beste HTML-Validator?
Der beste HTML-Validator ist der kostenlose Markup Validation Service des W3C.
Das W3C ist das World Wide Web Consortium, das Standards für die Web-Entwicklung definiert. Deshalb macht es absolut Sinn, den HTML Validator des Konsortiums zu nutzen, das die HTML-Standards setzt. Darüber hinaus ist der W3C-Validator sehr benutzerfreundlich, da Fehler sehr klar markiert werden. Zu jedem Fehler gibt es eine genaue Anleitung, wie er einfach behoben werden kann.
Was ist ein HTML-Validator?
Ein HTML-Validator ist ein Programm, welches die formale Gültigkeit eines Dokumentes auf die Einhaltung der Regeln für HTML überprüft. Wenn der HTML-Validator einen Fehler findet, erläutert er, wie Sie diesen beheben. Beispiel: Nicht geschlossenes Tag <p>. Bitte schließen Sie es mit </p>.
Warum sollte HTML überprüft werden?
Die Vorteile einer Überprüfung von HTML sind:
- Internetseiten werden von verschiedenen Browsern wie gewünscht dargestellt.
- Webseiten werden kleiner und laden schneller.
- Webseiten lassen sich leichter erstellen und weiterentwickeln.
- Es werden keine Fehler ausgegeben.
- Webseiten sind zukunftssicher.