Monday, January 19, 2015

W3C Free Tool for HTML5 Markup Validation

In this article we describe Step by Step How to use a W3C Free Tool for HTML5 Markup Validation in 5 minutes,  with a simple HTML5 markup , introducing the W3C Online Markup Validator .
HTML5 is a computer language , and it has therefore its own vocabulary, syntax and grammar. However, there are times when the documents written in HTML5 do not complain those grammar rules, and therefore they are considered invalid HTML5 web sites.
The action of verifying whether an HTML5 markup follows the HTML5 syntax rules is called "Validation". Thus, Validity is considered a quality criteria for an HTML5 web page.
We'll make use of the best HTML5 validator: the free tool by the W3C Consortium. It is called HTML5 Markup Validator :

W3C Free Tool for HTML5 Markup Validation



W3C Free Tool for HTML5 Markup Validation





First browse to the HTML5 Markup Validator web site:


W3C Free Tool for HTML5 Markup Validation 1

Once there, select the "Validate by direct input" tab:

W3C Free Tool for HTML5 Markup Validation 2


Open your HTML5 markup:

W3C Free Tool for HTML5 Markup Validation 3


Copy the HTML5 markup and paste it inside the text box at the W3C Markup Validator:

W3C Free Tool for HTML5 Markup Validation 4


Essentially , you'll get the validation information. However, when you click the "Check" button, you may receive a list of validation errors:

W3C Free Tool for HTML5 Markup Validation 5


Now is time to fix the validation errors. Scroll down the validator to see the errors that were found:

W3C Free Tool for HTML5 Markup Validation 6


As you can see, the errors found in this sample case, refer to an Attribute not found in HTML5 syntax. That's because were using here the AngularJS Framework for building SPA (Single Page Applications) apps. Let's fix it by replacing all "ng-xxx" attributes with "data-ng-xxx":

W3C Free Tool for HTML5 Markup Validation 7

After you fixed all the specific errors on your web page , copy-paste again the resultant markup into the Validator:


W3C Free Tool for HTML5 Markup Validation 8


Now Check the HTML5 document. Hopefully it is now "valid" :

W3C Free Tool for HTML5 Markup Validation 9





That All!!!   In this article we learned Step by Step How to perform HTML5 Markup Validation  in 5 minutes. 
Happy programming.....

      by Carmel Schvartzman


כתב: כרמל שוורצמן