Designing a Software is not a Single handed job. Multiple resources required to build an application. Let’s assume in your lab 5 peoples are working with you as a Team. Here if your Coding Standards are different from others then practically it is difficult to understood by an another developer. Unplanned Coding Standards waste quality time of a Developer. How it is if we all will maintain similar Coding Standards? This habit makes our job easier. As you know in Software industry Code is the major asset. It has no depreciation. In each revision it shines better. Developers are responsible to generate Codes. Codes are like the Skeleton of an Application. What we invest while designing a Software the major percentage is to develop Codes only. It’s better if before into development your developer team aware about the value of Codes. Looking into these factors here with we are sharing universal HTML5 Coding Standards for web designers.
1. There are many version of HTML. Using <!doctype html> at the top of a HTML File, Client Browser will understood that the web is designed with HTML5. In a HTML5 document always declare this as the First Line.
2. While Creating a HTML page never miss the title tag. It helps in SEO.
3. Meta information’s are useful for Search Engines to track your HTML page. Make a habit to define minimum 2 meta tags in your HTML page. Those are Keywords and Description. If your HTML page is responsive then additionally define meta viewport tag.
4. Use advanced programmer friendly IDE to develop Codes. For an example you can install “MS Visual Studio”.
5. While generating html in HTML5 use the power of Semantic Elements. For an example if in your HTML5 page there are three sections header, container and footer define them inside Semantic Elements. In a large HTML page Semantic Elements helps to maintain hierarchy.
6. HTML is not case sensitive. If you are using <STRONG> tag in place of <strong> it will not affect anything but refer to early age it’s a good practice to write HTML in lower case letters.
7. Generally in-case of Freshers it was noticed they forgot the end tag. Always make practice if you are defining a tag there must be a end tag. For an example if you are using image tag then there are two ways to close this tag. You can go for </img> or /> at the end. It is a best practice to choose /> in place of img end tag. But in the matter of a paragraph tag you must required </p>.
8. Inside a Tag while defining an attribute use lower case letters. Ex. Replace <div CLASS=”tab”> with <div class=”tab”>.
9. Define an attribute value in side double quotes. For an example while defined the source path (src) of an image tag you required to write like <img src=”/images/temp.jpg”. Do same for multiple attribute values. For an example in a div I am with 2 CSS classes <div class=”menu dashboard”.
10. Make a habit to Comment your Codes professionally. I noticed many developers Comments on Unnecessary places. Comment only if you found the block of Code is difficult to understood by you Colleague.
11. CSS helps to Style HTML. In production avoid in-line CSS. For an example it is a wrong practice to write like <div style=”float:left;” /> replace this with <div class=”leftAlign” />. Here leftAlign the class which contains float:left;.
12. Use lower Case letters while creating a File name. Update the HTML5 page extension to .html in place of .htm.
13. Nested HTML elements should be indented once (two spaces).
14. Use language attribute with your html tag. Ex. <html lang=”en-us”>.
15. For IE Compatibility mode use <meta http-equiv=”X-UA-Compatible” content=”IE=Edge”>.
16. Provide Character encoding meta tag to your HTML page. Ex. <meta charset=”UTF-8″>.
17. While embedding CSS or JS file to your HTML document don’t include type=”text/css” or type=”text/javascript”. Modern browsers are too smart they will take care of script type.
Ex.
<!– Code Embed External CSS –> <link rel=”stylesheet” href=”code-guide.css”> <!– In-line CSS –> <style>/* … */</style> <!– Code to Embed External JS –> <script src=”code-guide.js”></script>
18. While defining attributes to a HTML tag maintain the sequence order like class, id or name, data-*, src, type, href, for, value, title or alt, role & aria-*.
19. Whenever it is possible try to reduce superfluous parent elements.
Do you like the above Article related to HTML5 Coding Standards? While Coding HTML Follow this Guidelines.
