How does a search engine like Google understand the content of your page? Here’s a hint: it doesn’t use the same context clues as humans. After all, web crawlers, not humans, are the ones who categorize content and your website. And like a human, it’s hard to control the exact interpretation.
But with search engines, you can give them a few context clues.
This is thanks to structured data, a type of code in a specific format written in such a way that search engines understand it. Google Search supports structured data in the following formats: JSON-LD, Microdata, and RDFa.
JSON-LD
JSON-LD stands for JavaScript Object Notation for Linked Data, which consists of multi-dimensional arrays.
This notation separates the body from the HTML itself.
Why Use It?
You should use JSON-LD for one simple reason: it’s the recommended schema markup. Google itself names JSON-LD as the recommended schema markup format, and it works on all public forms of data.
It’s also considered simpler to implement than Microdata or RFDa, since you can simply paste the markup within the HTML document rather than having to wrap the markup around HTML elements as you would with Microdata.
How to Mark Up Your Content Using JSON-LD
To mark up your content using JSON-LD, you don’t need any new coding skills. That’s part of what makes JSON-LD the preferred markup. And as previously noted, you don’t need to wrap the markup around HTML elements.
To annotate using JSON-LD, all you have to do is paste the <head> or <body> tags directly into a web document and use the notations @context or @type to specify vocabulary. @context basically tells the browser, “Hey browser, this is the vocabulary I’m referencing, and here’s where you can find it.” @type specifies the type of item being marked up, using types defined at schema.org.
Walkthrough
The easiest way to do JSON-LD markups is to reverse engineer your markups from examples provided by Google. This isn’t to detract from learning JSON-LD vocabulary, but rather for the sake of efficiency.
If you want to learn to navigate yourself, make sure to keep open the Schema.org item type page as a guide, and always copy and paste immutable elements like @context or @type.
Here’s how the process would work:
- Ask yourself what you want to markup
- Ask yourself why you want to mark it up
- Open the specific documentation page and any relevant examples (reverse-engineering is your friend)
- Open the Schema.org item type page
- Copy and paste immutable elements
- Add the desired type you want to mark up as the value of @type
- List item properties and values
- Add JSON-LD syntax, nesting where appropriate
- Test your markup
- Determine your strategy for adding it to the webpage.
Microdata
Microdata is a specification tool used in HTML documents. Google describes it as, “An open-community HTML specification used to nest structured data within HTML content. Like RDFa, it uses HTML tag attributes to name the properties you want to expose as structured data. It is typically used in the page body, but can be used in the head.”
Why Use It?
Microdata is handy because it essentially adds tags to your web content that tell a search engine, “Hey, search engine, this is what this content means!” This makes it easier for search engines to understand the content and index it in a relevant way.
How to Mark Up Your Content Using Microdata
Microdata markup uses three elements:
- itemscope
- itemtype
- itemprops
Itemscope encloses information about the item. Itemtype identifies the type of content and is used immediately after itemscope. Itemprops provide specific information. For example, if your page was about an event, you could use itemprops to identify the location of the event by adding itemprop=”location” to the element enclosing the location name.
Walkthrough
Microdata is trickier to use because unlike JSON-LD, you have to navigate your HTML code in order to use it. Specifically, Microdata markup would start at HTML5.
Because of this, the easiest way to understand Microdata is to see examples in code. Schema.org offers examples of code lines using each element.
RDFa
RDFa (Resource Description Frameworks in Attributions) is a set of tags that function as an extension of HTML5, allowing you to introduce HTML tag attributes corresponding to user-visible content that you want to describe to search engines. It’s commonly used in head and body sections.
Why Use It?
RDFa allows you direct control of your site files, and it is used widely among sites. That said, you do have to know how to read HTML in order to use RDFa and you have to be able to access your site’s HTML files, since you need to implement RDFa directly into the code.
How to Mark Up Your Content Using RDFa
RDFa includes the following attributes:
- about (specifying what the metadata is about)
- rel and rev (specifying a relationship and reverse relationship with another resource)
- src, href and resource (specifying a partner resource)
- content (overriding the content of the element when using the property attribute)
- datatype (specifying the datatype of text specified for use with the property attribute)
- typeof (specifying the RDF type of the subject or partner resource)
Walkthrough
Since your markup using RDFa has to occur in the code itself, the easiest way to understand RDFa is by looking at code examples and reverse-engineering your own. RDFa’s official site is a good place to start navigating.
How to Add Structured Data to Your Site
The easiest way to add structured data to your site is use a plugin to help skip over code. You can use Google’s Structured Data Markup Helper, or you can use our Structured Data Schema Builder plugin. It makes the whole process fast and easy, and you don’t need to fight through lines of code to make sure search engines understand your pages.
Conclusion
Structured data is a great way to show search engines what you’re really made of. And the best news? You don’t need to be an expert coder to do it. Check out our plugin to see how fast and easy it is to create schema markup and see real results.