3 ways to include structured data in your website

Before we begin, if you are not clear on what structured data is, we recommend you read our Rich snippets and structured data input. And for those of you who already know what they are and how they can benefit us, we are going to explain how they are formed and 3 ways to include them in your website.
When you finish the guide it will be easier for you to detect why structured data generates errors in your Search Console or Google Ads campaigns.

What types of structured data can you use on your website?

To make it easy to understand, let's think of structured data as a language. When it comes to communicating, we need to at least know vocabulary or lexicon and how to combine this vocabulary, ie, the syntaxright? Something similar happens in the case of structured data.

The lexicon of structured data

In order for all search engines to understand our information, we must arrive at a terminology standardization. This is achieved through the use of libraries, which function as "dictionaries" and enable us to know which words to use so that Google can easily understand the structure of our website. Of all the libraries out there, we are going to mention the most widespread and used ones:

• Open GraphUsed for Facebook data tagging.
• Schema.orgSearch engine oriented: Mainly oriented to search engines. It is the most widespread and used library, so we will use it in our examples.
• Data-vocabulary We can still find websites with this type of structured data libraries, although it is becoming obsolete.
• Microformats.org

The syntax of structured data

Once we know the lexicon, we must insert it into our website. following any of the 4 syntax types that Google understands:

1. MicroformatsThis syntax is already obsoletebecause its structure is based on the classes (attributes class) of the HTML document in which they are included. HTML documents are disappearing in favor of HTML5, so this type of syntax is also obsolete.
2. Microdata: This type of structured data format uses the syntax of the HTML5 document in which it is included. Later on we will show you the attributes of this type of format.
3. RDFa: This is perhaps the most complicated and least used syntax of all. It is a format based on a set of XHTML extensions that takes advantage of HTML5 attributes.
4. JSON-LD: The JSON-LD format is the one preferred by Google, which strongly recommends it, and also the simplest to understand. Its syntax consists of an unordered array of elements name:value.

3 combinations of structured data and schema.org

Now that we know what lexicon and syntax options we have, let's see how we can combine them with each other. We will use in all the examples the Schema.org library, since it is the most used and well documented.

1.     Microdata with schema.org

As we mentioned before, this is a syntax based on HTML5 that has certain unique attributes:

• ItemscopeIndicates that information is to be provided on an as yet undefined element.
• ItemtypeIndicates the type of element being defined: it can be a product, a website, a physical person, etc.
• ItempropIndicates the characteristics or properties of the item in question: the brand name of the product, an associated image, the price, etc.

These attributes are best viewed in the HTML5 document itself. Below we can see a example of microdata in which we can see two elements (), each with its own type definition () and their characteristics ().

 2.     RDFa with schema.org

In this case, also own attributes are used. Among the most commonly used are the following:

As this is the most abstract case of the three, let's illustrate it with an example, to make it easier to understand. If we take a look at the example of structured natural person data, we see the following simple attributes:
In this case, it is the attribute vocab the one that marks the library, and the attribute typeof which marks the type of element. The rest of the characteristics are marked by the attribute property. In addition to the example for individuals, in this page we can find a number of examples of structured RDFa markup.

3.     JSON-LD with schema.org

This is the type of syntax recommended by Google. To implement it, we must add a javascript tag in our HTML5 document that contains the data in a name/value pair formataccording to this model:

{ "Product": "product type of my website" }

We would have to replace the data between braces with the data and properties of the element we are going to define, following the documentation of our library. This would be an example of how Pccomponents has implemented its structured data through the JSON-LD format:
Finally, we leave you here a tool to automatically generate the JSON-LD snippet you need on your website, in case you are not sure what lexicon and values are needed for each type of element.
And now that you know all the ways to insert structured data...
[totalpoll id="21694″]