What is semantic tags and non semantic tags in html?

A semantic element clearly describes its meaning to both the browser and the developer. Examples of non-semantic elements: <div> and <span> — Tells nothing about its content. Examples of semantic elements: <form> , <table> , and <article> — Clearly defines its content.

• Semantic tags are HTML tags that have a specific meaning. For example, the <h1> tag is a semantic tag that represents a heading. The <p> tag is another semantic tag that represents a paragraph. Semantic tags are important because they help to make your HTML code more readable and understandable for both humans and machines.
• <h1>: Heading
• <p>: Paragraph
• <img>: Image
• <a>: Link
• <table>: Table
• <ul>: Unordered list
• <ol>: Ordered lis
• Non-semantic tags are HTML tags that do not have a specific meaning. For example, the <div> tag is a non-semantic tag that can be used to group elements together. The <span> tag is another non-semantic tag that can be used to style text. Non-semantic tags are often used for layout purposes, but they can also be used to add structure to your HTML code.
• <div>: Container
• <span>: Styled text
• <br>: Line break
• <hr>: Horizontal rule
• <input>: Form input
• <select>: Form select
• <textarea>: Form textarea

It is generally recommended to use semantic tags whenever possible. This will make your HTML code more readable and understandable for both humans and machines. However, there are times when you may need to use non-semantic tags, such as when you are using them for layout purposes.

use semantic tags:

• They make your HTML code more readable and understandable for humans and machines. This is because semantic tags have a specific meaning, which makes it easier for people and machines to understand what your code is doing.
• They can help to improve the SEO of your website. Search engines can use semantic tags to understand the content of your web pages, which can help to improve your ranking in search results.
• They can help to make your web pages more accessible to people with disabilities. Screen readers and other assistive technologies can use semantic tags to understand the structure of your web pages, which can make them easier to navigate.

use non-semantic tags:

• You may need to use non-semantic tags for layout purposes. For example, you might need to use the <div> tag to create a container for a group of elements.
• You may need to use non-semantic tags to add style to text. For example, you might need to use the <span> tag to apply a font style to a specific piece of text.

For further exploration, follow this link : What is semantic tags and non semantic tags in html