15 HTML5 Best practices for beginners.

Whether you are a beginner or an expert in Hyper Text Markup Language (HTML) it is important to follow some best practices in order to keep your HTML documents consistent and organized.
HTML5 has been around for many years now and has been stable and supported at least partially supported by most major browsers since 2014. Here I present list of best coding practices regarding HTML5 markup. Lets get started:

1. File Structure

   Be concerned to the project file structure from day one. Its extremely important for mid to large scale application for batter maintenance.

2. Declare correct Doctype

If correct Doctype is not declared new HTML5-specific tags will not interpreted by the browser.

1. ###Write w3c valid markup

Use validator like w3c validator to check your markup and write error free more structured code. Validator will suggest you some best practice of HTML5 coding standard. I strongly recommend you to valid your code by w3c validator.

1. ###HTML5 semantic elements

Make sure correct use of the HTML5 semantic elements like: ,,,. Its will help you to write more structured piece of code.

1. ###Meaningful img alt attribute

Always try to use alt attribute with meaningful text in img tag. Its also best practice for SEO purpose.

1. ###Kebab-case class naming

Use kebab-case while class naming. If you dont use any structured naming convention like, BEM convention.

1. ###Relevant selector naming

Tried to use meaningful class naming relevant to your block of code .
Tricks: Tried to use .noun-adjective format.

1. ###Type attribute with and

Dont need to use type attribute for external styleSheet and script linking in HTML5 structure.

1. ###Atomic Class

Use specific class or atomic class when needed, try to use short meaningful class name.

1. ###Variant class in parent element

Tried to added class in parent element if need give another style to the same block or need same block different style.

1. ###Complex wrapping

For better performance please tried to avoid unnecessary wrapping. It will create unnecessary node in your HTML tree and reduce performance too.

Bad Practice

Good Practice

1. ###Closing tag

It is best practice to always concern with closing starting tag even if it is self-closing tag.

1. ###Injecting external styleSheet

External styleSheet always injects in tag. Because The HTML5 specification stated a element must have a rel attribute and if the rel attribute us used, the element is restricted to the head element.

1. ###Injecting external script

External script always injects at end of the