Search Engine Optimization
One of the goals of Search Engine Optimization, or SEO is to have your Original Content website rank high on the SERP (Search Engine Results Page).
A Search Engine is where you look for information, like Google or Bing. I have NEVER had a client who wanted to have a listing on page 100 (basically the 1,000th website listed!) Indeed, most clients would like to be listed first! Or at least on the First Page of the SERPs! That is because they do not understand the value of being on the second or third page of the SERPs.
Anyway, to move hire than ranking #1,000, you need both Original Content and “well formed code. “You will never get to the top ten pages of the SERPs by coping content from another website. You also will not get there with sloppy code with a lot of errors in it. In other words, NOT Well Formed Code!
Well Formed Code
Thousands of my students have handed me their HTML code and asked me to help them improve it. One of my first questions is usually, “Does it pass the W3C Validator?” I often get a puzzled look! They have put a lot of effort into making their page. Perhaps it is original coding, more likely it was copied out of a book or from a website, and then modified to make it their design. That’s all ok! What is not ok is that they didn’t run their code through the W3C Validator.
When I ask about this they usually tell me they did not know about the W3C Validator, or thought it would not work on their code because they were developing it on some kind of “localhost server” like a Linux LAMP server, or a Windows WAMP server, or a cross platform development server such as XAMPP. While it is true that the W3C Validator cannot read the files on these development servers, there is an easy and simple way to still use the W3C Validator on your code.
Easy W3C Validator
In developing your code, you would likely view it in your browser. I would highly recommend Firefox for this job, but it would likely be possible with any browser. Just view your page and view the source. In Firefox you can do this by right clicking on some blank part of the page, and clicking on “View Page Source.”
Now that you are viewing the page source, you can “Select All” by clicking the right mouse button, or by using a ctrl-a on your keyboard. Then copy all that you selected. By using this technique it does not matter if your source code is written in some version of hypertext markup, or is built from 100 PHP script files.
Now switch to the W3C Validator and click the tab “Validate by Direct Input.” Now paste your copied page source into the box marked “Enter the Markup to validate:”
I would also suggest clicking on “More Options” and “Show Source.” Then click the “Check” button.
The W3C Validator Results
It will now display the results for the testing done on your page as info, warnings and errors. You must fix errors and should fix warnings also.
Converting a document to HTML5
Your goal should always be to convert your documents to well formed valid HTML5 – in steps!
For documents older than HTML5, you should give them a DOCTYPE of XHTML1.0 Strict or XHTML1.1. Test and fix all warnings and coding errors. Always fix the first error first and down the list. When the document passes the W3C Validator wit NO errors, then switch the DOCTYPE to HTML5 – <DOCTYPE html> – and begin testing again – this will catch the maximum number of errors. Again, test, fix and repeat, until there are no more errors.
HTML5 Pitfall
Do NOT try to convert a document directly to HTML5 at the start before testing it as XHTML first. Using the W3C Validator to test and fix your code in XHTML is a crucial and critical step in converting any hypertext to HTML5, because to date, there is no XHTML5 Validator.
WordPress Best Practices
The WordPress Core Team has a number of Best Practices and Coding Standards that are worth reading and following in all coding. The WordPress HTML Coding Standards begin by saying…
Validation
“All HTML pages should be verified against the W3C validator to ensure that the markup is well formed. This in and of itself is not directly indicative of good code, but it helps to weed out problems that are able to be tested via automation. It is no substitute for manual code review. (For other validators, see HTML Validation in the Codex.)”
Now let’s take a quick look at Bitesize HTML5 – Self-closing Elements.