Golden rule
Every line of code should appear to be written by a single person, no matter the number of contributors.
1.Syntax
- Use soft tabs with two spaces—they're the only way to guarantee code renders the same in any environment.
- Nested elements should be indented once (two spaces).
- Always use double quotes, never single quotes, on attributes.
- Don't include a trailing slash in self-closing elements—the HTML5 spec says they're optional.
- Don't omit optional closing tags(e.g.</li>).
2.HTML5 doctype
- <!DOCTYPE html>
3.Language attribute
- <html lang="en-us">
4.Character encoding
- <meta charset="UTF-8">
5.CSS and JavaScript includes
- typically there is no need to specify a type when including CSS and JavaScript files as text/css and text/javascript are there rerspictive defaults
- <link rel="stylesheets href="code-guide.css">
- <script src=code-guide.js“></script>
6.Practicality over purity
- Strive to maintain HTML standards and semantics, but not at the expense of practicality. Use the least amount of markup with the fewest intricacies whenever possible.
7.Attribute order
- HTML attributes should come in this particular order for easier reading of code.
- class
- id, name
- data-*
- src, for, type, href, value
- title, alt
- role, aria-*
- Classes make for great reusable components, so they come first. Ids are more specific and should be used sparingly, so they come second.
8.Boolean attributes
- A boolean attributes is one that needs no declared value
- e.g.: <input type="text" disabled>
9.Reducing markup
- Whenever possible, avoid superfluous parent elements when writing HTML.
10.JavaScript generated markup
- Writing markup in JavaScript file makes the content harder to find, harder to edit, and less performant. Avoid it whenever possible.