HTML and Microdata

Microdata is a standardized way to provide additional semantics in your web pages. Microdata consists of a group of name-value pairs. The groups are called items, and each name-value pair is a property.

images/articles/html/html-microdata.webp

To create an item, the itemscope attribute is used. To add a property to an item, the itemprop attribute is used.

Global Attributes

Micro data has five global attributes which can be added to any element.

  1. itemscope: This is used to create an item. It tells that there is Microdata on this page, and this is where it starts.
  2. itemtype: This attribute is a valid URL. It defines the item and provides the context for the properties.
  3. itemid: This attribute is global identifier for the item.
  4. itemprop: This attribute defines a property of the item.
  5. itemref: This attribute gives a list of additional elements to crawl to find the name-value pairs of the item.

For example, to create a web page about movie "Star Wars", with information about the movie director, and so on.

<div itemscope itemtype="http://schema.org/Movie">
  <h1 itemprop="name">Star Wars</h1>
  <p>Director: <span itemprop="director">George Lucas</span></p>
  <p>Genre: <span itemprop="genre">Science fiction</span></p>
  <a href="/../movies/star-wars-trailer">Watch Trailer</a>
</div>