This post is part of a series that covers most of notable web development coding standards that you should follow.
You can download the document with all of the post from here: [download id=”8″ format=”1″]
You can see here the other posts within the series.
1 HTML General Rules
1.1 Always close your tags;
1.2 Keep your tag names lowercase:
Ex:
Good:
|
1 2 3 |
<div> <p>Lorem lipsum sit dolorem. </p> </div> |
Bad:
|
1 2 3 |
<DIV> <P>Lorem lipsum sit dolorem. </P> </DIV> |
1.3 Use H1 – H6 tags. For semantic and SEO reasons, try to use heading tags. The hierarchy of them in the page is important too.
1.4 Wrap navigation with an unordered list;
Ex:
|
1 2 3 4 5 |
<ul id="Nav"> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul> |
1.5 Always complete the alt attribute of an image;
1.6 For naming ID’s of HTML tags, use Camel Case and for naming classes use lower case:
Ex:
|
1 2 3 4 5 |
<ul id="NavContainer" class="nav-container"> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul> |
2 HTML Markup Formatting
2.1 Place a comment tag at the end of each important HTML container that notifies the end of that specific tag:
Ex:
|
1 2 3 4 5 6 7 |
<div id="LoginWrapper"> <form action="" method="post"> <input type="text" name="username" class="login-username" value="Please type your email address"/><br/> <input type="password" name="password" class="login-password" value="Please type your password"/><br/> <input type="submit" value="" class="login-button" /><br/> </form> </div><!-- End of #LoginWrapper --> |
2.2 When you want to add comments inside ASP.NET Web Controls, use this syntax:
Ex:
|
1 |
<%-- ASP.NET syntax for comments --%> |
2.3 Use one blank line to separate important HTML containers;
Ex:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<div id="Page"> <div id="Header"> <!-- HTML code --> </div> <div id="Content"> <!-- HTML code --> </div> <div id="Footer"> <!-- HTML code --> </div> </div> |
2.4 Use TAB for indentation. Do not use spaces. Recommended TAB size is 4;
