Die W3C-Validierung ist manchmal schwierig zu verwenden, aber Sie können damit Fehler erkennen, die durch das Layout-Design verursacht wurden. Der Validator gibt viele Fehler und Warnungen aus, die darauf hinweisen, dass Ihr XHTML noch nicht vollständig ist und möglicherweise nicht in verschiedenen Browsern konsistent funktioniert. Die folgenden zehn subtilen Fehlerprobleme haben viele Programmierer in Verlegenheit gebracht, und wir verraten Ihnen, wie Sie sie lösen können. Bevor ich mit diesem Artikel beginne, werde ich einige Probleme vorstellen, die bei der Verwendung des W3C-Validators beachtet werden müssen.
Machen Sie sich keine Sorgen über die Warnungen des Prüfers – wenn der Prüfer angibt, dass er 12 Fehler und 83 Warnungen gefunden hat, ignorieren Sie dies und fahren Sie mit dem nächsten Schritt fort.
Korrigieren Sie jeweils einen Fehler – Arbeiten Sie der Reihe nach von oben nach unten und korrigieren Sie jeweils einen Fehler. HTML wird mit einem Browser von oben nach unten betrachtet und diese Fehler werden in derselben Reihenfolge angezeigt.
Aktualisieren Sie den Code nach jeder Korrektur, um ihn wieder gültig zu machen – ein kleiner Fehler kann oft eine Fehlerkaskade auf der gesamten Seite auslösen. Wenn es also falsch gemacht wird, kann das „Beheben von Fehlern“ auch zu mehr Fehlern führen. Durch eine erneute Validierung des Codes nach jedem Fix wird sichergestellt, dass das Problem vollständig behoben ist.
Da wir die oben genannten grundlegenden Ausnahmen kennen, werfen wir einen Blick auf mehrere Gründe, warum das Layout-Design ungültig ist.
1. Das div-Tag ist nicht geschlossen. Dies ist einer der häufigsten Gründe für ein Scheitern des Layout-Designs. Es ist immer wieder überraschend, wenn wir erfahren, wie viele heikle Layoutentwürfe daran scheitern. Umfragen zeigen, dass offene div-Tags einer der häufigsten Fehler bei der Abschnittsgestaltung und einer der am schwierigsten zu diagnostizierenden sind. Der Validator zeigt manchmal auf das falsche öffnende div-Tag, was wie die Suche nach der Nadel im Heuhaufen sein kann.
2. Das problematische Embed-Tag In den frühen 1990er Jahren begannen Microsoft- und Netscape-Browser, nicht standardmäßige eindeutige Schriftarten zu erkennen. Leider bedeutet dies, dass der W3C-Validator bestimmte wichtige HTML-Tags wie „embed“ noch nicht erkennt, obwohl diese Tags weit verbreitet sind. Wenn Sie wirklich eine strenge DOCTYPE-Validierung (Dokumenttyp) wünschen, können Sie nur auf die Verschachtelung verzichten.
Wenn Sie gleichzeitig ein wirkungsvolles Layout und eingebettete Medien wünschen, können Sie die Flash Satay-Methode ausprobieren.
3. Falsche DOCTYPE-Deklaration Das Nichtdeklarieren von DOCTYPE oder die falsche Deklaration von DOCTYPE am Anfang der Datei ist ebenfalls ein häufiger Fehler. Nach allgemeiner Erfahrung ist Strict DOCTYPE die höchste Verifizierungsstufe, die jeder anstrebt. Eine strenge Validierung bedeutet, dass Ihre Webseite in allen Browsern optimal angezeigt wird. Der Strict-Deklarationscode lautet wie folgt:
4. Abschließender Schrägstrich Wenn Ihre Website nicht verifiziert werden kann, fehlt wahrscheinlich irgendwo im Code der abschließende Schrägstrich. Es ist leicht, Dinge wie abschließende Schrägstriche zu übersehen, insbesondere in Elementen wie Bild-Tags. Zum Beispiel:
Im strikten DOCTYPE hat dies keine Auswirkung. Um dieses Problem zu lösen, fügen Sie „/“ am Ende des img-Tags hinzu.
5. Align-Tag Wenn DOCTYPE auf Transitional eingestellt ist, verwenden Sie das „align“-Tag. Wenn Sie jedoch anspruchsvoller sind und eine strikte Überprüfung wünschen, werden viele Fehler angezeigt. Align ist ein weiteres Tag, das nicht für die Layoutgestaltung verwendet werden kann. Sie können versuchen, „float“ oder „text-align“ anstelle von align zu verwenden, um Elemente zu transformieren.
6. JavaScript
Wenn Strict DOCTYPE deklariert wurde, muss das CDATA-Tag in JavaScript überschrieben werden. Dieser Aspekt des Verifizierungsprozesses stellt viele Programmierer vor ein Rätsel, da Websites dazu neigen, eingebettetes JavaScript für Anzeigen und Tracking-Skripte zu verwenden. Wenn JavaScript verwendet werden muss, können Sie davor und danach die folgenden Tags hinzufügen:
7. Bilder erfordern das „alt“-Attribut Sie haben es vielleicht nicht bemerkt, aber Bilder sind auch ein potenzieller Stolperstein für die erweiterte Validierung. Zusätzlich zum abschließenden Schrägstrich ist für die erweiterte Validierung auch ein Alt-Tag zur Beschreibung des Bildes erforderlich, z. B. alt= „Scary vampire picture“.
Auch Suchmaschinen nutzen Alt-Tags, um Bilder auf Webseiten zu identifizieren, daher ist es immer eine gute Idee, Alt-Tags hinzuzufügen, egal was passiert.
8. Unbekannte Entitätsdaten Entitätsdaten sind ein weiterer häufiger Fehler, der sich auf die Verifizierung auswirkt. Wir können erwägen, geeignete Codierungszeichen zu verwenden, um Symbole wie „&“ zu ersetzen. Eine vollständige Liste entsprechend codierter Zeichenentitätsdaten, die im XHTML-Abschnittsdesign verfügbar sind.
9. Schlechte Verschachtelung Verschachtelung bedeutet, dass das Element das Element Sweet! enthält.
Die Reihenfolge verschachtelter Elemente kann leicht verwechselt werden. Beginnen Sie beispielsweise das starke Tag vor dem div-Tag, schließen Sie dann aber zuerst das div-Tag. Das Abschnittslayout wird dadurch möglicherweise nicht geändert, Ihr Abschnittsdesign wird dadurch jedoch ungültig.
10. Fehlendes „title“-Tag Obwohl dies wie ein offensichtlicher Fehler erscheint, vermissen viele Programmierer (ich eingeschlossen) oft das Title-Tag im „head“-Abschnitt. Wenn Sie sehen, dass ein erforderliches Unterelement von HEAD fehlt, werden Sie feststellen, dass Sie vergessen haben, das Titel-Tag hinzuzufügen.