Schema Markup: Definition, Types, How to Generate, Validate & Add Schema Markup and More.
April 17, 2024![schema markup, benefits of schema markup, why use schema markup, how to generate schema markup, and](https://www.dzinepixel.com/wp-content/uploads/2024/04/schema-markup-1024x576.jpg)
We all want to dominate the top position in Google, and capture as much traffic we could. However, to do that, we must ensure, our site is easily readable by search engines like Google, Bing, Yahoo, etc.This is where SEO practices like xml sitemaps, and schema markup comes to the play.
We have already covered about xml sitemaps, and how it help search engine bots to index your website. In this article, we will learn about Schema Markup, which is an equally important practice that helps content to rank not only in ranking order, but also in other parts of Search Engine Results Page (SERP) as featured snippets, knowledge panel, site links, local pack, rich snippets, and many more.
What is Schema Markup?
Schema Markup Example
{ "@context": "http://schema.org", "@type": "LocalBusiness", "name": "DzinePixel Webstudios", "description": "DzinePixel Webstudios is a full-service digital agency specializing in web development, design, and digital marketing.", "address": { "@type": "PostalAddress", "streetAddress": "123 Main Street", "addressLocality": "Bhubaneswar", "addressRegion": "Odisha", "postalCode": "751001", "addressCountry": "India" }, "telephone": "+91-123-456-7890", "openingHours": "Mo, Tu, We, Th, Fr 09:00-17:00", "geo": { "@type": "GeoCoordinates", "latitude": "20.2961", "longitude": "85.8245" }, "image": "http://example.com/logo.png", "url": "http://www.example.com" }In this example:
- @context: Specifies the context for interpreting the data, indicating that it follows the Schema.org vocabulary.
- @type: Defines the type of entity being described, in this case, a LocalBusiness.
- Name, description, address, telephone, openingHours, geo, image, url: Provide various properties of the LocalBusiness entity, such as its name, description, address, contact details, operating hours, geographic coordinates, logo image, and website URL.
Technical Components of Schema Markup
Schema.org Vocabulary: Schema.org is a collaborative project between Google, Microsoft, Yahoo, and Yandex aimed at creating a common vocabulary for structured data markup. It defines a wide range of schemas for different types of entities, such as articles, events, organizations, products, and more.
Microdata or JSON-LD Syntax: Schema markup can be implemented using either microdata or JSON-LD (JavaScript Object Notation for Linked Data) syntax. Microdata involves adding specific HTML attributes to your existing HTML tags, while JSON-LD is a script-based format that allows you to define structured data separately from the HTML content of your page.
Schema Types and Properties: Each type of entity defined in the schema.org vocabulary has its own set of properties that describe its attributes. For example, a schema type
“Product” might have properties like “name”, “description”, “image”, “brand”, “price”, etc. These properties are used to provide detailed information about the entity to search engines.
Implementation: To implement schema markup on a webpage, you need to identify the relevant schema types and properties that correspond to the content on your page, and then add the appropriate markup using microdata or JSON-LD syntax. This markup is typically added directly to the HTML code of the webpage within the
Is Schema Markup Important In SEO?
How Does Schema Markup Work?
Phase 1: Schemas are Developed
Phase 2: Schemas are Added for Search Engines
To add schema markup, you need to find the ideal schema for your page and the contents within. These schemas are available in code snippets, usually in JSON-LD format. These code snippets contain structured data elements.
For instance, if you want to add schema for your organization, then you have common schema types for organizations such as “Organization”, “LocalBusiness”, “Corporation”, etc.
Note: Scroll Below if you want to know how to add schema markup in html.
Phase 3: Search Engines Get the Context of Your Site
Once you add the schema, crawling and indexing will be better.
How?
Well, the next time search engines crawlers come to crawl your site, they will parse the structured data. This is help the crawler to understand the meaning and context behind the webpages. As a result, search engines can display rich snippets, or enhanced results in Search Engine Results Page (SERP).
For example, if you want to add reviews and ratings for your products or services, you can use schema type “review”, & “Aggregaterating” in your page’s html. Similarly, if you want to add prices, Schema Types “offer”, and “product” is the one you should go for.
What Is Schema Markup Used For?
![schema markup example 1](https://www.dzinepixel.com/wp-content/uploads/2024/04/markup-1.png)
![schema markup example 2](https://www.dzinepixel.com/wp-content/uploads/2024/04/markup-2.png)
![schema markup example 3](https://www.dzinepixel.com/wp-content/uploads/2024/04/markup-3.png)
Adding Schema Markup Improves Page’s Visibility
Schema Provides More Relevant Results
Schema Gets You in Featured Snippets
Schema is Best for Voice Search Optimization
To feature your page in voice search optimization, you can follow this example:
The schema type we use for voice search optimization is “VoiceAction”.
{ "@context": "http://schema.org", "@type": "VoiceAction", "agent": { "@type": "Organization", "name": "DzinePixel", "logo": "https://www.dzinepixel.com/wp-content/uploads/2022/10/logo.png" }, "query": "Web design trends 2024", "result": { "@type": "BlogPosting", "headline": "Top Web Design Trends for 2024", "description": "Explore the latest trends in web design for 2024, including examples and insights.", "image": "https://www.dzinepixel.com/wp-content/uploads/2024/02/style.jpg", "url": "https://www.dzinepixel.com/blog/web-design-trends-2024/", "author": { "@type": "Organization", "name": "DzinePixel" }, "datePublished": "2024-04-12", "interactionStatistic": { "@type": "InteractionCounter", "interactionType": { "@type": "VoiceSearchAction" }, "userInteractionCount": 128 } } }
Explanation:
@type: Specifies the type of schema, which is “VoiceAction” for voice search results.
agent: Specifies the organization responsible for the content, in this case, DzinePixel.
query: Represents the voice search query made by the user, such as “Web design trends 2024”.
result: Provides information about the result of the voice search.
@type: Specifies the type of result, which is “WebPage” in this case.
name: Title of the search result, such as “Top Web Design Trends for 2024”.
description: Brief description of the result.
image: URL of an image associated with the result.
url: URL of the page containing the result.
interactionStatistic: Tracks user interactions with the result.
interactionType: Specifies the type of interaction, which is “VoiceSearchAction” for voice searches.
userInteractionCount: Indicates the number of times the result was accessed in response to voice searches, for example, “128” times.
Note: VoiceAction is not recognized by Schema.org, so you need to validate it through JSON Schema validator.
Schema is Extremely Useful in Local SEO
For businesses with physical locations, schema markup can enhance their presence in local search results with the right Local SEO Strategies. By marking up key information such as business name, address, phone number, and operating hours, businesses can improve their visibility in local searches and attract more customers to their physical locations.
Example of Schema for Local Business
{ "@context": "http://schema.org", "@type": "LocalBusiness", "name": "DzinePixel", "address": { "@type": "PostalAddress", "streetAddress": "DCB-419, DLF Cybercity, Infocity, Patia", "addressLocality": "Bhubaneswar", "addressRegion": "Odisha", "postalCode": "751024", "addressCountry": "India" }, "telephone": "+918847853679", "email": "business@dzinepixel.com", "openingHours": "Mo-Sa 10:00-18:00", "geo": { "@type": "GeoCoordinates", "latitude": "20.3495873", "longitude": "85.807801" }, "image": "https://www.dzinepixel.com/wp-content/uploads/2022/10/logo.png", "url": "https://www.dzinepixel.com/", "description": "DzinePixel offers professional web design and development services.", "sameAs": [ "https://www.facebook.com/dzinepixel", "https://twitter.com/dzinepixel", "https://www.instagram.com/dzinepixel" ] }
Types of schema markup
- Organization: Describes a specific organization, including its name, logo, contact information, and social media profiles.
- LocalBusiness: Provides information about a local business, such as its address, phone number, opening hours, and geographic coordinates.
- WebSite: Defines a website, including its name, URL, potentialAction, and author information.
- Person: Represents an individual person and includes details such as their name, job title, and contact information.
- Product: Describes a product, including its name, description, brand, image, price, and availability.
- Event: Specifies details about an event, such as its name, start date and time, end date and time, location, and organizer.
- Article: Represents an article or blog post and includes properties such as headline, date published, author, and main content.
- Review: Provides information about a review of a product, service, or other entity, including the reviewer’s name, rating, and review text.
- BreadcrumbList: Defines a breadcrumb trail for navigation purposes, indicating the hierarchy of pages on a website.
- FAQPage: Specifies a page containing frequently asked questions (FAQs) and their corresponding answers.
- Recipe: Describes a recipe, including ingredients, instructions, cooking time, and nutrition information.
- VideoObject: Represents a video file or stream, including properties such as name, description, duration, and thumbnail URL.
How to Create Schema Markup?
- Identify Content to Markup: Determine which content on your website you want to mark up with schema markup. This could include products, articles, events, local businesses, recipes, and more.
- Choose Schema Type: Visit the Schema.org website and browse the available schema types to find the most appropriate one for your content. Each schema type has specific properties and guidelines for implementation.
- Write JSON-LD Markup: Use JSON-LD (JavaScript Object Notation for Linked Data) to define the structured data for your content. JSON-LD is a preferred format for schema markup as it’s easy to read and implement.
- Define Properties: Within the JSON-LD markup, define the properties and values for the chosen schema type. These properties will vary depending on the schema type you’ve selected. Refer to the Schema.org documentation for guidance on which properties to include for each schema type.
- Implement Markup in HTML: Once you’ve written the JSON-LD markup, insert it into the HTML code of your web pages. Place the JSON-LD markup within the
What Is Schema Markup Generator?
What Is Video Schema Markup?
- Name: The title or name of the video.
- Description: A brief description of the video content.
- Thumbnail URL: The URL of the thumbnail image associated with the video.
- Content URL: The URL of the video file or streaming service where the video can be accessed.
- Duration: The length of the video in ISO 8601 duration format (e.g., “PT1M30S” for 1 minute and 30 seconds).
- Upload Date: The date and time when the video was uploaded or published.
- Embed URL: The URL used to embed the video on other websites.
- Keywords: Keywords or tags associated with the video content.
- Interaction Count: The number of interactions (e.g., views, likes, comments) the video has received.
- Author: The entity or person responsible for creating the video.
- Publisher: The entity or organization that published or distributed the video.
When to Add Schema Markup?
- During Website Development: If you’re building a new website or redesigning an existing one, incorporate schema markup into the development process. This ensures that structured data is integrated into your website from the beginning, providing search engines with valuable information about your content right from the start.
- When Adding New Content: Whenever you create new content for your website, such as blog posts, product pages, events, or articles, make sure to include schema markup alongside the content creation process. This helps search engines understand the context and relevance of your new content more effectively.
- Before Launching a Marketing Campaign: If you’re planning to launch a new marketing campaign or promotional activity, consider adding schema markup to relevant landing pages or promotional materials. This can enhance the visibility and performance of your campaign in search results, increasing its effectiveness.
- When Updating Existing Content: Periodically review and update your existing website content to ensure that it’s optimized for search engines. As part of this process, add schema markup to any content that doesn’t already have it, or update existing markup to reflect changes or improvements in your content.
- As Soon as Possible: If you haven’t already implemented schema markup on your website, don’t delay in doing so. Adding structured data to your website can provide immediate benefits in terms of search engine visibility, user experience, and click-through rates. The sooner you add schema markup, the sooner you can start reaping the rewards.
Where to add schema markup in website?
Schema markup should be added to the HTML code of your website, specifically within thesection or directly within the content that you want to mark up.
Here are some common locations where you can add schema markup on your website:
Section of HTML: You can include schema markup directly within the section of your HTML code. This is typically done using JSON-LD (JavaScript Object Notation for Linked Data) format.
Place the JSON-LD markup within a Within Content Sections: You can also add schema markup directly within the content sections of your webpage, particularly for content types such as articles, blog posts, products, events, and reviews.
Place the JSON-LD markup within the
How to Use Schema Markup Validator to Validate Schema Code?
![schema markup validator 1](https://www.dzinepixel.com/wp-content/uploads/2024/04/markup-4-1024x453.png)
![testing structured data in schema validator](https://www.dzinepixel.com/wp-content/uploads/2024/04/markup-5-1024x543.png)
Now paste the code into the “paste your code” area. I have pasted the code that I used as an example above. After you paste your code, click on RUN TEST.
![schema markup validator 2](https://www.dzinepixel.com/wp-content/uploads/2024/04/markup-6-1024x415.png)
![checking existing structured data schema validator](https://www.dzinepixel.com/wp-content/uploads/2024/04/markup-7.png)
![checking existing structured data schema validator](https://www.dzinepixel.com/wp-content/uploads/2024/04/markup-8-1024x395.png)
FAQs about Schema Markup
- The element represents the organization (or entity) to which the address belongs, with the itemtype attribute set to “http://schema.org/Organization”.
- The organization’s name is specified using the itemprop=”name” attribute.
- The address information is contained within a nested element with the itemtype attribute set to “http://schema.org/PostalAddress”.
- Specific address components such as street address, locality (city), region (state), postal code, and country are specified using the appropriate itemprop attributes.
What is the Code for Schema Markup Aggregate Rating?
Product Name
4.5 out of 5 based on 100 ratings and 50 reviews.
- The element represents the product to which the aggregate rating belongs, with the itemtype attribute set to “http://schema.org/Product”.
- The product’s name is specified using the itemprop=”name” attribute.
- The aggregate rating information is contained within a nested element with the itemtype attribute set to “http://schema.org/AggregateRating”.
- The ratingValue property specifies the overall rating score, while the bestRating property specifies the highest possible rating score.
- The ratingCount property indicates the total number of ratings received, and the reviewCount property indicates the total number of reviews.
What is the Code for Author Name in Schema Markup?
Schema markup for authors is used to provide search engines with structured data about the author of a piece of content, such as an article, blog post, or book. It helps search engines understand the authorship information more accurately and display it in search results in a structured format, potentially enhancing the visibility and relevance of the content to users.
Here’s an example of how you can use schema markup to represent author information:
John Doe
![John Doe](author-image.jpg)
Author description or biography.
In this example:
- The element represents the author, with the itemtype attribute set to “http://schema.org/Person”.
- The author’s name is specified using the itemprop=”name” attribute.
- Optionally, the author’s image can be included using the itemprop=”image” attribute within a nested element of type “https://schema.org/ImageObject”.
- A brief description or biography of the author can be included using the itemprop=”description” attribute.
- The sameAs property is used to specify social media profiles associated with the author. Each social media profile is represented as a separate element within a nested element of type “https://schema.org/SocialMediaProfile”.
How to Add Schema Markup to Shopify?
- Access Your Shopify Admin: Log in to your Shopify account and navigate to the “Online Store” section.
- Choose Your Theme: Select the theme you want to modify by clicking on “Themes” under the “Online Store” menu.
- Edit Code: Click on the “Actions” dropdown menu for your chosen theme and select “Edit code.” This will open the theme code editor.
- Locate Theme.liquid File: In the theme code editor, locate and click on the “theme.liquid” file. This file contains the HTML structure for your entire website.
- Add Schema Markup: Within the section of the “theme.liquid” file, add the schema markup using JSON-LD format. You can add schema markup for different types of content, such as products, articles, and breadcrumbs, depending on your requirements.
- Save Changes: After adding the schema markup, save the changes to the “theme.liquid” file.
- Test Schema Markup: Use Google’s Structured Data Testing Tool or other schema markup validators to test your schema markup and ensure it’s implemented correctly.
- Repeat for Other Templates: If necessary, repeat the process for other templates in your theme, such as product pages, collection pages, or blog posts, to add specific schema markup for different types of content.
- Backup Your Theme: Before making any changes to your theme code, it’s essential to create a backup of your theme. This will allow you to revert to the original version if needed.
- Monitor Performance: After adding schema markup, monitor the performance of your structured data in search results using tools like Google Search Console. This will help you track any improvements in search visibility and ensure that search engines are correctly interpreting your structured data.
How to Add Schema Markup to WordPress without Plugin/Manually?
- Identify the Schema Markup: You can find the appropriate schema type by visiting the Schema.org website and browsing the available schema types.
- Access Your WordPress Theme Files: Log in to your WordPress dashboard and navigate to Appearance & Theme Editor. Alternatively, you can access your theme files via FTP by connecting to your hosting server.
- Edit the Theme Header File (header.php): Locate the header.php file in your theme editor and add the schema markup within thesection of your website. You can add JSON-LD structured data directly within the
How to Add Schema Markup in WordPress with a Plugin?
- Install a Schema Markup Plugin: There are several WordPress plugins available that can help you add schema markup to your website easily. Some popular options include Yoast SEO, Schema Pro, and WP SEO Structured Data Schema.
- Activate the Plugin: After installing the plugin, activate it from the Plugins page in your WordPress dashboard.
- Configure Plugin Settings: Depending on the plugin you choose, you may need to configure settings related to schema markup. Follow the plugin’s documentation or on-screen instructions to set up the plugin according to your needs.
- Add Schema Markup to Content: Once the plugin is set up, you can start adding schema markup to your content. Most plugins provide options to add schema markup to individual posts, pages, or custom post types.
- Select Schema Type: Choose the appropriate schema type for your content. This could be Article, Event, Product, Recipe, etc., depending on the nature of your content.
- Fill in Schema Fields: Enter relevant information in the schema fields provided by the plugin. This may include details such as title, description, image, date published, author, etc.
- Save Changes: After adding schema markup to your content, save the changes, and publish or update the post/page.
- Test Schema Markup: Use Google’s Structured Data Testing Tool or other schema markup validators to test your schema markup and ensure it’s implemented correctly.