Microdata markup in HTML5 is used to add extra semantics in your HTML code to help bots and machines to understand the content on your website.
The way to add it to your HTML is by simply adding a set of new attributes to your existing HTML tags. This includes the “itemscope”, “itemtype”, “itemprop”, “itemref”, and “itemid” attributes.
Here is how to use it:
1. Use the `itemscope` attribute: This is a boolean attribute that you can apply to any HTML element. It tells the browser that the content within the element is about a particular item.
\`\`\`html1. Use the `itemtype` attribute: This specifies what kind of items are being described. The value of this attribute should be a URL that describes your data item.
\`\`\`html1. Use the `itemprop` attribute: This specifies the properties of the item that you’re describing. For a person, it can be name, url, image, etc.
\`\`\`html1. Use the `itemref` attribute: This attribute allows properties to be associated with an item even if they aren’t nested inside the itemscope.
\`\`\`html1. Use the `itemid` attribute: This specifies a unique identifier for the item.
\`\`\`html1. Group of related properties: If some properties have nested properties, you can declare a new itemscope inside an existing one.
\`\`\`htmlThese are some examples of how you could use Microdata in HTML5. Remember the itemprop should have corresponding definitions in the URL specified in itemtype (in this case — schema.org). The itemtype url is just a reference and will not be visited by the user or SEO spiders.