Valid HTML5 code is very important because it helps accessibility in the ever growing platform and user agent market such as smart phones, tablet computers, the Android browser and more. It also helps show professionalism and good practice, aids debugging and future proofing.
Languages and Rules
Web pages are written in the language of HTML and the current version is HMTL 5. Every language has its own syntax and therefore every document written in the language of HTML is supposed to follow its official rules.
The rules set out define how the syntax can be used, what order the language can be written in and how it all fits together. For example, you will always start a web page with the opening HTML tag and finish with the closing HTML tag. Between these tags is the head tag and body tag. The body tag comes after the head tag.
The rules also specify how certain syntaxes work and shouldn’t work. In a HTML list you use a block level item, such as a <div> tag, as a list item.
What is valid HTML code?
Valid code is HTML code that follows these rules set out by the W3C is dubbed “valid code”. This is because the code is properly formatted, based on standards created by the World Wide Web Consortium (W3C). Any code that is not properly formatted is dubbed invalid code. Invalid code can be a result of typing mistakes or HTML code that was once valid but now obsolete. For example the <b> tag for bold is invalid and superseded by the <strong> tag.
Why should you as a designer validate your code?
The main reason designers should be strongly encouraged to check their code and use validation services like the W3C’s very own HTML validation tool for accessibility reasons.
With the arrival of Web browsers on tablet computers, smart mobile phones, games consoles and televisions it has become nearly impossible to predict just how your website will viewed. Any incorrect HTML can create an error in the browser or prevent your document from working in a particular browser. This will then turn any your audience.
For example, if you’re going to be running a social media campaign and planning on running a story on Digg and the majority of Digg users use Safari or Firefox. If your website fails to load correctly because of bad code or poor CSS formatting, your story is going to get no attention and you’ll be missing out on the potential of hundreds of organic editorial links.
Validated code is simply more predictable and makes life for Internet browsers and assistive technologies easier in order to present websites and their content in an accessible way.
Validation is a sign of professionalism
Today there is little certification for Web professionals beyond NVQ levels and computer and Information Technology related degrees. Many web designers so far have to learn by themselves. Seasoned designers can take pride in creating Web content using well-formed markup. Validation can then be used as a quick check to determine whether the code is the clean work of a seasoned HTML author, or quickly hacked-together tag soup. Validation therefore can set you as a designer apart from others and show you as the professional to hire.
Validation helps teach good practices.
Many professionals have been authoring the Web with HTML and CSS since the beginning and will know these technologies by heart. Beginners and students will find automated checking tools invaluable in spotting mistakes and make a good introduction to broader, more complex quality concepts such as accessibility.
Validation as a debugging tool
While many contemporary Web browsers do an increasingly good job of parsing even the worst HTML “tag soup”, some errors are not always found. Very often, different software on different platforms will not handle such errors so easily.
Using standard markup and style sheets offers a much greater chance of having your webpage and website handled consistently across all platforms and user-agents. Indeed, most developers creating Web applications know that reliable scripting needs the document to be parsed by User-Agents without any unexpected error, and will make sure that their markup and CSS is validated before creating a rich interactive layer.
Validation as a future-proof quality check
Checking that a page displays properly in several contemporary Web browsers may be a reasonable insurance that the page will work today, but it does not guarantee that it will work tomorrow. Internet browsers change and new versions appear all the time. Everyone who accessed the Web will use a different browser that is older or newer that your version.
Validation is one of the simplest ways to check whether a page is built in accordance with Web standards, and provides one of the most reliable guarantees that future Web platforms will handle it as designed.
Why designers do not check their code?
Validation, as any process of debugging code, is sometimes difficult and time consuming. Also, the vast improvements in automatic error correction have made the modern Web browser cope very well with errors in HTML or CSS. This makes validation seem pointless or costly to many people, and the following statements are common
“My site looks right and works fine?”
Markup languages are no more than data formats. A website doesn't look like anything at all until presented by your browser.
In practice, different Web browsers can and do display the same page very differently. Typically Internet Explorer is the one that will show things differently. This is deliberate, and doesn't imply any kind of browser bug.
“Lots of websites out there don't validate - including household-names.”
Household-name companies expect people to visit because of the name and in spite of dreadful websites.
Accessibility is the law in many countries. Whilst validation doesn't guarantee accessibility there is no substitute for common sense and actually looking into it. Do you want to risk being on the wrong side of a lawsuit if your website proves inaccessible to - for instance - a disabled person who cannot use a 'conventional' browser?
“Validation doesn’t work because of modern apps and add-ons”
Many new code inserts for many of the social media website and other website apps do tend to flag themselves as code error when you validate your code. This can be in some cases unavoidable because the app or code will not comply with the HML code specification, even if it is tweaked to comply. However if the rest of the code is valid except for the app or code insert then it can be forgiven.
Examples of this have included embedded Flash and YouTube code. YouTube however allows users to use an “older code” code insert which satisfies most code validation processes.