Thursday, 2 November 2017

Microdata Features of HTML 5

Microdata is one of the new features of HTML5 that is used to embed semantic markup into HTML
documents. Semantic markup is the machine-readable code that includes logic, information, outline data or message content and is used with HTML tags to categorize the HTML page content by search engine. Microdata allows you to annotate content with specific machine-readable. Microdata is the data that is created in the form of customized properties with name-value pairs to define a vocabulary describing a business listing. It consists of groups of name-value pair where each name-value pair is a property and the groups of such name-value pair are called as items. These items and properties are represented by regular HTML elements. Each item can have an item type a global identifier supported by its item type and a list of name-value pairs. A property is a name-value pair that consists of a property name and one or more property values.
The Microdata feature has introduced the following global attribute for HTML elements.

  • itemscope Attribute:-Specifies a boolean attribute to create a new item or group og name-value pairs.
For Example:
<DIV itemscope>
..........
........
</DIV>
  • itemprop Attribute:- Specifies a property to one or more items.
For Example:
<DIV itemscope>
<P>Name of Customer is<SPAN itemprop="custname">akumar</SPAN></P>
<P>country is<SPAN itemprop="cuscountry">India</SPAN></P>
<p>Customer Phone is<SPAN itemprop="custph">9876534353</SPAN></p>
</DIV>
  • itemref:-Specifies a list of additional elements to find the name-value pairs of an item
For Example:
<DIV itemscope id="akumar" itemref="a b"></DIV>
<p id="a">Name:<SPAN itemprop="name">Akumar</SPAN></p>
<p id="b" itemprop="team" itemscope itemref="c"></DIV>
<DIV id="c">
<p>Team:<SPAN itemprop="name">Cricket</SPAN></p>
<p>Players:<SPAN itemprop="size">12</SPAN>Players</p>
</DIV>
  • itemtype:- Specifies the type of an item
For Example:
<SELECTION itemscope itemtype="http://careersoft-tech.blogspot.com#HTML5 tutorial">
<h1 itemprop="name">CO CO cola</h1>
<p itemprop="desc">co co cola is the cool drink</p> 
<img itemprop="img" src="cococola.jpg" alt="" title="cococola, age 7 months">
</SELECTION>
  • itemid:- Specifies a global identifier for an item
For Example:
<DL itemscope itemtype="http://vocab.example.com/book" itemid="urn:isbn:0-111-11111-1">
<DT>Title
<DD itemprop="title">An Inalienable Right to life

<DT>Author  
<DD itemprop="author">Kumar lamba
</DL>

No comments:

Post a Comment