HTML is meant to display the data and you can code HTML in many ways, which will be rendered by different browsers in a different manner. So, we need some rules to be followed by all browsers to show the data uniformly. That's why we have World Wide Consortium (http://www.w3.org/) to handle this.
Web designers or developers should remain up-to-date with the latest technology and web standards, which include HTML5, CSS 3, JSON, and so on. Well, that doesn't mean you have to read every single specification line by line, but you will have to follow minimal web standard to achieve high percentage of uniformity of web standards over all the web browsers without losing your users.
If you are using HTML (not HTML5 for now), try to always write this line of code:
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
Here, xmlns is the XML namespace and it should always have the value as http://www.w3.org/1999/xhtml. You can define in which language it should be rendered by setting the value of the lang attribute.
Put all the CSS files at the top under the head tag and try to move down all JavaScript at the bottom of the HTML code. CSS is required at the top for two reasons:
To have a presentational layout as it should be
So that it can be downloaded in parallel along with other HTTP requests
Use the tableless design whenever possible. The tableless forms may not make the page load faster but it will surely enhance the speed due to the following reasons:
Less number of DOM elements to be parsed
Layout being taken care by CSS
We can use the same CSS code for more tables if present, which would save a number of lines of code and would render faster
If you are good at CSS, converting HTML table elements into a CSS layout should be a cakewalk.
Check your W3C standard validity related to HTML, CSS (mainly), and load time on a regular basis.
We shouldn't leave back any error while writing tags. It should be properly closed and you should use proper tags for the specific purpose, for example, don't use the <b> tag to make the string bold, rather use <strong>. Use proper ending methods of one-sided tags, for example, <br /> instead of <br>. It would not make the site faster but will make parsing faster without any error.
We should avoid using inline JavaScript as much as possible and you should put external JavaScript files at the bottom of the HTML code. Because while downloading JavaScript files, it doesn't allow downloading anything else that will make the page load slower.
You can follow HTML standards by analyzing errors and warnings caused by specific pages by using a Firefox add-on HTML Validator (https://addons.mozilla.org/en-us/firefox/addon/html-validator/). It has the option to check HTML and CSS validation separately online using a w3.org tool or by using W3C's free online validator tool (http://validator.w3.org/).
Results may vary from one tool to another due to analyzing error pattern difference. <br> may not be erroneous under HTML Tidy but it's an error under the W3C validator as it should be <br />.
In the following screenshot, you can see the result from HTML Validator for the URL www.packtpub.com:
While the following screenshot, shows the result from W3C's online validator for the same www.packtpub.com URL:
The preceding screenshot shows that there are 27 errors and 2 warnings that exist and should be taken care of.
Try W3C's online validator for your own website and try and fix all the errors and warnings shown by this tool.