What is semantic HTML? What are their advantages? [Resolved]

Posted by Amatya under HTML 5 on 4/7/2016 | Points: 10 | Views : 400 | Status : [Member] | Replies : 4
What is semantic HTML? What are their advantages?

Feel free to share informations 9731764134
Thanks



Responses

Posted by: Professionaluser on: 4/7/2016 [Member] [MVP] Bronze | Points: 50

Up
0
Down

Resolved
A semantic element clearly describes its meaning to both the browser and the developer.Semantic HTML or semantic markup is HTML that introduces meaning to the web page rather than just presentation. For example, a <p> tag indicates that the enclosed text is a paragraph. This is both semantic and presentational, because people know what a “paragraph” is and browsers know how to display them. In HTML4* tags like <b> and <i> are not semantic, because they define only how the text should look (bold or italic) and do not provide any meaning to the text.

Examples of non-semantic elements: <div> and <span> - Tells nothing about its content.

Examples of semantic elements: <form>, <table>, and <img> - Clearly defines its content.
Tag 	        Description  
<article> Defines an article
<aside> Defines content aside from the page content
<details> Defines additional details that the user can view or hide
<figcaption> Defines a caption for a <figure> element
<figure> Specifies self-contained content, like illustrations, diagrams, photos, code listings, etc.
<footer> Defines a footer for a document or section
<header> Specifies a header for a document or section
<main> Specifies the main content of a document
<mark> Defines marked/highlighted text
<nav> Defines navigation links
<section> Defines a section in a document
<summary> Defines a visible heading for a <details> element
<time> Defines a date/time

Use of Semantic HTML:
With HTML4, developers used their own favorite attribute names to style page elements: header, top, bottom, footer, menu, navigation, main, container, content, article, sidebar, topnav, ------> This made it impossible for search engines to identify the correct web page content.

With HTML5 elements like: <header> <footer> <nav> <section> <article>, this will become easier.

Semantic HTML "Allows data to be shared and reused across applications, enterprises, and communities ."


Amatya, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Manideepgoud on: 4/7/2016 [Member] Starter | Points: 25

Up
0
Down
Semantic elements
Semantic elements defines about parts of webpage by using <header>, <footer>, <section>, <article>,<aside>, <main>, <summary>, <mark> etc

Amatya, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Debendra256 on: 4/11/2016 [Member] Starter | Points: 25

Up
0
Down
Html is a tag based languages.For every action we are using tag.In these some tag name itself describe the use of this inside the web page like.
<form>
<table>
<img>
some of HTML5 tage are-
<article>
<aside>
<details>
<figcaption>
<figure>
<footer>
<header>
<main>
<mark>
<nav>
<section>
<summary>
<time>
Thus these tags which describe its role by its name is called scemantic tags or Semantic elements.

Debendra Dash

Amatya, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Karthikaqpt on: 4/21/2016 [Member] Starter | Points: 25

Up
0
Down
Semantic markup isn't about performance, it's about meaning. semantic HTML makes more sense to humans. Well structured HTML will have semantic meaning for a wide range of users and user agents.More predictable outcome over the different devices used to display HTML in. Learn about html from http://learnwebdevelopment.info/

Software testing|SeoTools

Amatya, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response