Skip to main content

Structured Data in HTML for SEO

Structured data is a standardized format for providing information about your web page content, making it easier for search engines to understand and display your data in rich snippets. Implementing structured data can improve your website's SEO and provide users with more information in search results.

What is Structured Data?​

Structured data uses a specific vocabulary to describe your content, allowing search engines to display rich results, such as reviews, ratings, or event details, directly on the search results page. The most commonly used vocabulary for structured data is Schema.org.

JSON-LD: A Format for Structured Data​

JSON-LD (JSON for Linking Data) is a lightweight format for representing structured data in HTML. It is easy to implement and recommended by Google for adding structured data to your web pages.

Example: Structured Data for a Recipe​

To add structured data for a recipe, use the following JSON-LD format:

HTML
<script type="application/ld+json">
  {
    "@context": "https://schema.org/",
    "@type": "Recipe",
    "name": "Chocolate Chip Cookies",
    "author": {
      "@type": "Person",
      "name": "Jane Doe"
    },
    "datePublished": "2021-10-01",
    "description": "A classic chocolate chip cookie recipe.",
    "image": "https://example.com/images/chocolate-chip-cookies.jpg",
    "prepTime": "PT30M",
    "cookTime": "PT15M",
    "totalTime": "PT45M",
    "recipeYield": "24 cookies",
    "recipeIngredient": [
      "2 cups all-purpose flour",
      "1/2 teaspoon baking soda",
      "1 cup unsalted butter, room temperature",
      "1/2 cup granulated sugar",
      "1 cup packed light-brown sugar",
      "1 teaspoon salt",
      "2 teaspoons pure vanilla extract",
      "2 large eggs",
      "2 cups semisweet and/or milk chocolate chips"
    ],
    "recipeInstructions": [
      {
        "@type": "HowToStep",
        "text": "Preheat oven to 350 degrees. In a small bowl, whisk together the flour and baking soda; set aside."
      },
      {
        "@type": "HowToStep",
        "text": "In the bowl of an electric mixer fitted with the paddle attachment, combine the butter with both sugars; beat on medium speed until light and fluffy."
      }
    ]
  }
</script>

Add this JSON-LD script within the <head> section of your HTML document.

Testing Structured Data​

After implementing structured data, you can use Google's Rich Results Test tool to ensure that your structured data is valid and properly formatted.

Conclusion​

By incorporating structured data into your HTML, you can enhance your website's SEO and provide users with richer search results, improving your website's visibility and user experience.