W3C-validatie is soms niet erg vergevingsgezind, maar geeft u de mogelijkheid om fouten te zien die worden gegenereerd door uw markup. Veel fouten en waarschuwingen die door de validator worden gegenereerd, zijn een goede indicatie dat uw XHTML niet in een goede conditie is en in verschillende browsers niet consistent kan zijn. Hier zijn 10 stiekeme validatieproblemen waarmee ontwikkelaars te maken krijgen en hoe ze te vermijden.
Voordat we aan de slag gaan, zijn hier enkele goede tips om te onthouden bij het gebruik van de W3C-validator.
Laten we, met die basistips uit de weg, eens kijken naar enkele van de redenen waarom uw markup niet valideert.
Een van de meest voorkomende redenen waarom indelingen niet geldig zijn. Het blijft verbazen hoe vaak dit de boosdoener is voor een funky lay-out. Niet-gesloten div-tags zijn een van de meest voorkomende lay-outfouten en ook een van de moeilijkst te diagnosticeren. De validator wijst niet altijd naar de juiste niet-gesloten div-tag, dus het is niet altijd eenvoudig om de naald in de hooiberg te vinden.
Begin jaren 90 begonnen browsers zoals Microsoft en Netscape unieke lettertype-declaraties te herkennen die nooit werden gestandaardiseerd. Helaas betekent dit dat de W3C-validator nog steeds enkele belangrijke HTML-tags zoals 'insluiten' niet herkent, ook al worden ze tegenwoordig veel gebruikt. Als u echt op zoek bent naar die strikte DOCTYPE-validatie, moet u de insluiting verwijderen.
Als u echt geldige markeringen wilt hebben en ingesloten media, probeer dan de Flash Satay-methode te gebruiken.
Een veel voorkomende fout is het niet declareren van een DOCTYPE of het declareren van de verkeerde DOCTYPE aan het hoofd van het document. Als algemene vuistregel is Strict DOCTYPE de hoogste validatie om op te schieten. Strikte validatie betekent dat uw webpagina's de beste kans bieden om op de juiste manier te worden weergegeven in alle browsers. Dit is hoe een strikte verklaring eruitziet:
Als uw site niet goed valideert, is de kans groot dat de reden een ontbrekende slash ergens in uw code is. Het is heel gemakkelijk om iets als een trash over het hoofd te zien, vooral in elementen zoals afbeeldingslabels. Bijvoorbeeld:
Dit zal niet valideren tegen een strikte DOCTYPE. Voeg een '/' toe voordat de img-tag in elk geval eindigt om het probleem op te lossen.
Met de tag 'align' kun je prima werken als je DOCTYPE is ingesteld op Transitional, maar als je de hogere weg hebt genomen en een Strict-validatie hebt gekozen, zie je fouten. Uitlijnen is een ander afgeschreven tag die niet meer mag worden gebruikt in markup. Probeer het in plaats van uit te lijnen vlotter of text-align om het element te verschuiven.
Als je een Strict DOCTYPE hebt gedeclareerd, moet je CDATA-tags rondom je JavaScript-code omwikkelen. Dit aspect van validatie heeft veel ontwikkelaars doen struikelen, omdat sites de neiging hebben om in-line JavaScript te gebruiken voor zaken als advertenties en trackingscripts. Als u JavaScript wilt toevoegen, voegt u deze tags vóór en na:
Als je het nu nog niet hebt gemerkt, zijn afbeeldingen een groot potentieel struikelblok voor een goede validatie. Behalve achteropgaande slashes, hebben ze ook alt-tags nodig die afbeeldingen beschrijven, d.w.z. alt = "Scary vampire picture".
Zoekmachines rekenen ook op deze alt-tag om afbeeldingen op de pagina te identificeren, dus het is een goede gewoonte om de alt-tags toch toe te voegen.
Entiteiten zijn een andere kleine valkuil die de validatie in de weg staat. In plaats van dingen als het "&" -symbool te gebruiken, is het een goed idee om correct gecodeerde tekens te gebruiken. Hier is een volledige lijst van correct gecodeerde karakterentiteiten voor gebruik in XHTML-markeringen.
Nesten is wanneer je elementen in elementen hebt, zoals:
Zoet!
Het is vrij gemakkelijk om door elkaar te komen en mix is de volgorde van geneste elementen. Bijvoorbeeld het starten van de sterke tag vóór de div-tag, maar eerst het sluiten van de div-tag. Dit mag het uiterlijk van de lay-out niet veranderen, maar het zorgt er wel voor dat uw opmaak zeker niet wordt gevalideerd.
Hoewel het een voor de hand liggend probleem lijkt, laten veel ontwikkelaars (waaronder ikzelf) toch af en toe een 'title'-tag in de' head'-sectie achter. Als u de foutmelding "een vereist subelement van HEAD" mist, weet u dat u een title-tag mist.
Als je dit bericht nuttig hebt gevonden, stem er dan voor op Digg.