CODEWITHSUNDEEP
csshtml
Sha
Sha

Reputation: 1974

Why HTML5 tags are made semantic?

I am working on HTML5 and i came across various HTML5 semantic tags like <article> <section> <aside> <nav> <header> <footer> <audio> <video> <source> <track> <embed> <canvas> etc.

I would like to what exactly is the advantage of using these semantic tags. is it for fast loading or any other feature?

Please share your thoughts.

Upvotes: 2

Views: 811

Answers (2)

Nicky McCurdy
Nicky McCurdy

Reputation: 19524

Advantages of semantic tags

  • It's easier for computers to understand what content is in your document and how it is structured. For example, having article tags would make it easier for a tool like Safari Reader or Readability to find the content of a blog post.
  • Screen readers will also have more information about what is on the page. This is incredibly useful for vision impaired users, especially since they can more easily jump to navigation controls and article contents while skipping less important content.
  • It's easier for developers to logically sort out parts of HTML documents, and easier to semantically add CSS styles around your HTML.

Upvotes: 4

slugster
slugster

Reputation: 49974

It's to accurately describe the content of the tag.

For example this means when Google (or any search bot) crawls a page, it can more accurately dissect it and assign relevance scores to the various bits of content.

Wikipedia has a nice simple definition:

Semantic HTML is the use of HTML markup to reinforce the semantics, or meaning, of the information in webpages rather than merely to define its presentation or look. Semantic HTML is processed by regular web browsers as well as by many other user agents. CSS is used to suggest its presentation to human users.

So whether a browser takes special action upon tags like audio and video is purely up to the developer of the browser rendering engine, but they are there to be used.

Upvotes: 5

Related Questions