0
0
SeoHow-ToBeginner ยท 4 min read

How to Use Schema Markup for Better SEO and Rich Results

To use schema markup, add structured data in JSON-LD format within your webpage's <script type="application/ld+json"> tag. This helps search engines understand your content and can improve your site's appearance in search results with rich snippets.
๐Ÿ“

Syntax

Schema markup is added using JSON-LD inside a <script> tag in your HTML. The main parts include @context which defines the schema vocabulary, @type which specifies the type of content, and properties describing your content.

html
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Person",
  "name": "John Doe",
  "jobTitle": "Software Developer",
  "telephone": "(123) 456-7890",
  "url": "http://www.johndoe.com"
}
</script>
๐Ÿ’ป

Example

This example shows how to add schema markup for a local business. It helps search engines display important info like address, phone, and opening hours in search results.

html
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "LocalBusiness",
  "name": "Joe's Coffee Shop",
  "image": "http://example.com/logo.jpg",
  "address": {
    "@type": "PostalAddress",
    "streetAddress": "123 Main St",
    "addressLocality": "Anytown",
    "addressRegion": "CA",
    "postalCode": "12345",
    "addressCountry": "US"
  },
  "telephone": "+1-123-456-7890",
  "openingHours": "Mo-Fr 08:00-18:00"
}
</script>
โš ๏ธ

Common Pitfalls

Common mistakes include placing schema markup outside the <head> or <body> tags, using incorrect @type values, or missing required properties. Also, avoid mixing schema formats like Microdata and JSON-LD on the same page.

Always validate your markup with tools like Google's Rich Results Test to catch errors.

html
<!-- Wrong: Missing @context and wrong placement -->
<script>
{
  "@type": "Person",
  "name": "Jane"
}
</script>

<!-- Right: Proper JSON-LD with @context -->
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Person",
  "name": "Jane"
}
</script>
๐Ÿ“Š

Quick Reference

  • Use JSON-LD format inside a <script type="application/ld+json"> tag.
  • Set @context to https://schema.org.
  • Choose the correct @type for your content (e.g., Article, Product, LocalBusiness).
  • Include required properties for the chosen type.
  • Validate your markup with Google's Rich Results Test.
โœ…

Key Takeaways

Add schema markup using JSON-LD inside a