Schema Markup for SEO: A Guide

Eveline Roberts

With schema markup search engines like Google can display additional, relevant information in search results. This leads to enhanced listings, called rich snippets, which can help attract more clicks and engagement from search users.

Below, we’ll explain what schema markup is, how it benefits your site, and how to implement it effectively.

What is Schema Markup?

Schema markup is a form of code that helps search engines understand the content on your site more clearly. Think of it as a “label” for your information. It identifies specific pieces of data, such as product reviews, events, or contact information, allowing search engines to highlight these details in search results.

By adding schema markup, your site can offer rich snippets, extra elements like ratings, prices, or dates. For example, a recipe might display cooking time and calories directly in the search results.

Benefits of Schema Markup

Schema markup is essential for improving the visibility and appeal of your site in search engines. Here’s why it matters:

  • Enhanced Search Appearance: Rich snippets make your search result more attractive by including extra information.
  • Increased Click-Through Rates (CTR): When users see extra details like star ratings or product prices, they’re more likely to click.
  • Improved Rankings: Although schema alone doesn’t directly boost rankings, a better CTR from rich snippets can positively affect SEO performance.
  • Better User Experience: Visitors get quick answers and relevant info directly from the search results, which can encourage them to choose your site.

Types of Schema Markup to Use

Different types of schema markup suit various purposes. Some popular options include:

  • Article Schema: For blogs or news articles.
  • Product Schema: Ideal for e-commerce, showing price, availability, and reviews.
  • Event Schema: Highlights event dates, locations, and ticket availability.
  • Recipe Schema: Displays ingredients, cooking time, and calorie count.
  • Local Business Schema: Essential for businesses with physical locations, showing addresses, hours, and contact info.

When to Use Schema: Schema markup is most useful when your content includes structured data like reviews, prices, or event dates. For example, a restaurant could use schema to show opening hours and menu details.

When Schema May Not Be Beneficial: If your content is simple or purely informational, such as a personal blog without structured data, schema markup may not add significant SEO value. Static pages like “About Us” or “Privacy Policy” generally do not benefit from schema.

How to Implement Schema Markup

Choosing the Right Schema for Your Content

Visit Schema.org to explore various schema types. Use their search feature to find schema types that best fit your content. For instance, if you’re marking up a product, use “Product” schema, or if it’s a recipe, use “Recipe” schema.

Using Tools to Add Schema

Google offers a free Structured Data Markup Helper tool. You can enter your page’s URL or HTML, select the type of schema, and tag your data. The tool generates the code, which you can paste into your site.

Schema Plugins for WordPress

For WordPress users, plugins make it easy to add schema without coding. Some popular options are:

  • Yoast SEO: Adds structured data to your pages and is especially good for basic schema like Article and WebPage.
  • Schema Pro: A premium plugin offering a wide range of schema types.
  • All in One Schema Rich Snippets: A free option for adding product, review, and event schema.
Yoast schema settings screenshot
Yoast Schema settings for posts and pages

Coding Schema with JSON-LD

JSON-LD (JavaScript Object Notation for Linked Data) is a Google-recommended format for schema. JSON-LD is easy to add and doesn’t interfere with your HTML.

Example JSON-LD code for a Product schema:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Hoka Running Shoes",
  "image": "https://example.com/hoka-running-shoes.jpg",
  "description": "High-quality running shoes for all terrains.",
  "sku": "HOKA123",
  "offers": {
    "@type": "Offer",
    "priceCurrency": "EUR",
    "price": "79.99",
    "itemCondition": "https://schema.org/NewCondition",
    "availability": "https://schema.org/InStock"
  }
}
</script>

Embedding HTML Schema Directly

Embedding schema directly within HTML, known as “microdata,” is an older but still valid method for adding structured data to your site. In this approach, you place schema properties directly inside HTML tags. However, it is less commonly recommended because it can be more error-prone and harder to maintain, especially as your site grows or changes.

Why Direct HTML Schema Embedding is Prone to Error

  1. Complexity with Nested Tags: Embedding schema in HTML can clutter the code, making it harder to read and debug. This is especially challenging with nested tags, where properties and item types can easily be misplaced.
  2. Harder to Maintain: Adding or editing content with schema requires updating the HTML structure itself, which can increase the chance of breaking the markup.
  3. More Manual Work: Unlike JSON-LD, which is kept separate in a <script> block, HTML-embedded schema requires every item property to be coded individually. This can be time-consuming and is more likely to lead to syntax errors.

Example of HTML Schema (microdata)

Here’s an example of how schema markup for a product might look when embedded directly into HTML:

<div itemscope itemtype="https://schema.org/Product">
  <h2 itemprop="name">Hoka Running Shoes</h2>
  <img itemprop="image" src="https://example.com/hoka-running-shoes.jpg" alt="Hoka Running Shoes">
  <p itemprop="description">High-quality running shoes for all terrains.</p>
  <span itemprop="sku">HOKA123</span>
  
  <div itemprop="offers" itemscope itemtype="https://schema.org/Offer">
    <span itemprop="priceCurrency" content="EUR">€</span>
    <span itemprop="price">79.99</span>
    <link itemprop="availability" href="https://schema.org/InStock">In Stock</link>
  </div>
</div>

In this HTML microdata example:

  • Each attribute, such as itemprop="name" or itemprop="description", must be directly added to the relevant HTML tag.
  • The itemscope and itemtype attributes define the type of structured data (in this case, a Product and its Offer).
  • Each property, like the name, image, description, and price, must be individually set.

Limitations of Direct HTML Schema

Embedding schema directly in HTML like this can quickly become unwieldy, particularly for pages with complex or numerous structured elements. JSON-LD (using a single <script> tag) is generally preferred as it separates the data from the HTML structure, making it easier to manage and edit without risk of altering the visible content.

Testing and Validating Schema Markup

Before you publish schema markup, it’s crucial to validate it to ensure it’s correctly implemented:

  • Google’s Rich Results Test: Use Rich Results Test to check your structured data. This tool will flag errors and suggest corrections.
  • Schema Markup Validator: Another reliable tool for testing is the Schema Markup Validator on Schema.org. Testing ensures that search engines will interpret and display your schema correctly.

Errors in schema can prevent rich snippets from appearing, so always test your code.

Updating and Submitting Schema with a Sitemap

Updating schema markup requires submitting the updated pages to Google. While you don’t need a new sitemap every time, it’s helpful to maintain one.

Why Sitemaps Are Important

Sitemaps provide search engines with a list of all your site’s URLs, helping them understand what content to crawl and index. A sitemap is especially useful for larger sites or those with frequently updated content.

How to Create a Sitemap

  • Using Plugins for WordPress: WordPress plugins like Yoast SEO automatically generate a sitemap and update automatically whenever you add new content.
  • Manually Creating a Sitemap: If you prefer, you can create an XML sitemap manually using online tools like XML-Sitemaps.com.
  • Submitting to Google: Go to Google Search Console and add your sitemap in the Sitemaps section. This submission ensures that Google has the latest structure of your site and its updated schema.

Updating your sitemap regularly helps Google re-crawl and refresh the content on your site.

Best Practices for Schema Markup

To make the most of schema markup, follow these best practices:

  • Mark Up Relevant Content: Use schema wherever it enhances user experience, like marking up products, events, or reviews.
  • Regularly Update Your Schema: Schema.org frequently updates, and new types may become available that better suit your content.
  • Avoid Common Mistakes: Don’t mark up irrelevant content or include broken code. Validate each change to avoid errors that may prevent rich snippets.

Conclusion

Schema markup is a valuable asset in your SEO toolkit. By adding structured data, you improve your site’s visibility and user experience, helping it stand out in search results. While it requires effort and testing, schema markup can significantly boost your online presence.