10 Rules I Follow When Writing HTML To Make It Concise and Readable🚀💡

Here are 10 rules that can be followed when writing HTML to make it more concise and readable:

1. Use semantic elements:
Use semantic elements such as <header>, <nav>, <main>, <article>, <section>, <footer> and more to clearly communicate the purpose of the content.

2. Use descriptive class and id names:
Use descriptive class and id names that clearly communicate the purpose of the element.

3. Use the alt attribute for images:
Use the alt attribute for images, to provide a text description of the image in case the image can't be loaded.

4. Use the title attribute for links:
Use the title attribute for links, to provide additional information about the link.

5. Keep nesting to a minimum:
Keep nesting to a minimum to avoid complex structure, which makes it harder to understand the relationships between elements.

6. Use comments:
Use comments to explain the purpose of different sections of your HTML, and to help other developers understand your code.

7. Use a template engine:
Use a template engine such as Handlebars or Mustache, which allows you to separate the presentation logic from the data and make your HTML more readable and maintainable.

8. Use the correct header levels:
Use the correct header levels H1, H2, H3, etc. to create a logical structure of the content.

9. Use lists correctly:
Use lists correctly, either as an ordered list <ol> or unordered list <ul> to structure the content.

10. Keep it simple:
Keep your HTML simple and avoid over-engineering solutions. The simpler your HTML is, the easier it will be to maintain and understand.

By following these rules, your HTML will be more concise, readable and semantic, which makes it easier to maintain and collaborate on projects.

Hope you like it.

That’s it — thanks.

To read my other articles click here.

---

👋Hey there, Let’s connect on:

Linkdin: Margish Patel
Twitter: @margish96patel
Email: [e-mail]

Comments

[Nermin Karapandzic]

Bunch of generic advices that anyone could guess.
I would say always try to follow some well-established guidelines that already exist, it's likely companies will be adhering to them as well, for example:
google.github.io/styleguide/htmlcs...

[margishpatel]

Thanks for information

[Mustafa_A]

Good top ten list for absolute beginners.
Keep up the work.

[Abdulsalaam Noibi]

Thanks for sharing this explanatory article

[margishpatel]

Thanks for your valuable feedback. 💯