Web Tip #3 - Valideer uw site met de W3C HTML validator

Valideer uw site met de W3C HTML validator

De ultieme test voor uw site is natuurlijk het gebruik in de meest gangbare browsers. Voor de meeste webmasters is dit waar het testen begint en ophoudt. Dat kan anders, en beter. De meeste browsers proberen elke site zo goed mogelijk te laten zien, en zijn in hoge mate fouttolerant. Met andere woorden, u kunt veel fouten maken in de HTML maar Firefox en Internet Explorer spelen het nog steeds klaar om de pagina prima te renderen. Hier kleeft echter één nadeel aan: U ontdekt uw vergissingen pas erg laat. Soms wordt het dan heel veel werk alles recht te trekken. Veel beter is het, om regelmatig te controleren of uw pagina's nog aan de geldende W3C standaards voldoen. Dit is nooit een vervanging van het testen met browsers, maar garandeert wel een solide basis voor de browser tests. Het kost maar enkele seconden, en het is helemaal gratis.

Het valideren van uw site

Ga naar de W3C HTML validator op de W3C website.
U kunt uw site online laten testen door de URL in te geven, of u kunt een file uploaden om gevalideerd te worden. Erg handig als u een testsite heeft die nog niet live is maar waar u wel mee wilt testen. Wees niet te gefrustreerd als uw site tientallen fouten oplevert, meestal is een klein foutje genoeg om een heel regiment foutmeldingen van de validator uit te lokken. De meeste foutmeldingen zijn echter 'gevolgschade'. Concentreer u dus op de bovenste foutmelding.
Bent u tevreden met uw HTML, dan zijn de stylesheets aan de beurt. Die kunt u testen op de W3 CSS Validation Service website.

Het gevalideerd houden van uw site

Nu uw site helemaal standaards-compliant is, is het zaak om dat zo te houden. De W3C website biedt 2 handige XHTML code fragmenten aan, waarmee u links kunt maken waarmee u snel kunt testen of u nog steeds aan de standaards voldoet.
Voor de HTML validator ziet dat er als volgt uit:

<p>
   <a href="http://validator.w3.org/check?uri=referer">
   <img src="http://www.w3.org/Icons/valid-xhtml10"
   alt="Valid XHTML 1.0!" height="31" width="88" /></a>
</p>

Voor CSS is het volgende fragment:

<p>
  <a href="http://jigsaw.w3.org/css-validator/">
  <img style="border:0;width:88px;height:31px"
    src="http://jigsaw.w3.org/css-validator/images/vcss" 
    alt="Valid CSS!" />
  </a>
</p>

U kunt het resultaat op de voorpagina van onze site zien.
De links maken het overigens ook erg gemakkelijk voor een bezoeker om uw site te valideren. Ik heb mijzelf ook alweer op een aantal slordigheidjes betrapt. U bent gewaarschuwd! :)