What is schema markup and how do I add it to my website?

June 17, 2020
0 minute read

Schema markup can be one of the most confusing components of the SEO world due to its inherently technical nature. It’s not something that can be seen on a webpage by visitors, nor is there an easy way to know if it’s working correctly once in place. Let’s try and demystify some of that today. 


Here is a tl;dr summary of what schema markup is and how you can add it to your website:


  • Schema markup is microdata that makes it easier for search engines, crawlers and browsers to understand what is on a webpage 
  • There are 1000s of types of schema markup designed to represent different kinds of ‘things’ (including individual nouns and verbs) that may be searched for online
  • Implementing schema effectively requires 4 steps: 
  • Understanding of the type of data you can represent on a webpage 
  • Using a tool to generate the schema markup 
  • Embedding the schema markup on a specific page
  • Testing it with Google or Bing structured data testing tool


Now, let's dive in...


What is schema markup?


Schema markup, as it’s used today on the web, enables robots that crawl your website to more easily understand the content on the page in a language that makes sense to them. Schema does this by giving a structured way for robots/crawlers to define the types of information and data present on the page.


When a robot (like Google) crawls your website, they have a hard time understanding the content within the webpage. This is because of the way websites are designed and built today. This may come as a surprise to some, but HTML and CSS actually make for a very unstructured system. However, this makes sense if you think about it — designed websites are built for humans and not for robots. 


Schema is an open-source initiative by the web community to help define commonly represented things with a structured, predictable system. You can read the many types of schema at schema.org. Now, I would not recommend you spend time on schema.org. The website is confusing and you’ll quickly get lost in the minutia of it, or just get bored and leave.


What schema markup should you use?



There are 1000s of different types of schema that exist on the schema.org website. One common misconception about schema is that it’s intended to represent everything that could be searched for on the web — but this is not true. Schema.org only attempts to find a structured way of representing the most common things that are used or searched for on the web. 


One point of clarification: when people use the term ‘things’ in relation to schema, they are referring to types of information that schema looks to represent. These can be nouns (people, places, or things) or verbs (actions). As an example, schema can represent a hospital or a travel agency. Or It can represent an action, like listening to a podcast. It’s confusing, and honestly, I think most people should ignore all that complexity and different types of schema that exist. 


Additionally, I strongly recommend that any web agency or developer only use schema where it has an impact. Today, that only means influencing search engines like Google and Bing. Both Google and Bing understand & read schema. They use it to be sure they understand the content on the page and then they use that certainty to display special features on the search results page. 


An example of this is events. You can use schema to inform Google and Bing of upcoming events. Once they have certainty about the information, they can present those events directly in the search results page. Here’s an example from Google:


You’d likely have the same data on a webpage, but this allows you to surface it quicker to the searcher. 


The best way to figure out what types of schema you should use is on the search gallery pages of Google and Bing. The most common ones are:


  • LocalBusiness/Organization: This tells Search Engines facts about the business, such as hours they’re open, address, phone numbers and more
  • FAQs: A list of questions and answers about the website or content on the page
  • Product: This is great for eCommerce websites, where products are marked up with the price, quantity in stock, reviews and other important details
  • Breadcrumbs: Breadcrumbs give search engines a better way to understand how a specific page fits into the overall structure of the website


How to implement schema markup on a website


You should follow these steps to understand how to implement schema markup:


  1. Understand the type of data you can represent on a webpage with schema
  2. Use a tool to generate the schema markup
  3. Embed the schema markup on that specific page
  4. Test it with Google or Bing structured data testing tool 


So that’s the overview; here are the details...


The first thing to understand is the type of data you can represent with schema. I recommend you browse through Google’s gallery of supported types to find one that matches. Note that schema should only be implemented on a single page and any schema you implement should represent something that is displayed on the same page


After you know what type of schema you want to implement, we recommend using a tool to generate the schema markup. 


Note about schema flavors or vocabulary: There are different ways to represent schema like RDFa, Microdata and LD+JSON. We recommend you focus only on LD+JSON because it’s the easiest to read and update. It’s also the most modern.*


Here’s a run down of different tools to use: 


  • Google’s Structured Markup Helper. This tool allows you to choose the type of schema you want to create and then helps you visually select the data from the webpage you want to grab it from. This is great if the website is already live and you want to simply select the data on the website. That being said, it is a bit clunky to use. 
  • Merkle’s Technical SEO Schema Generator: This is one of the best tools to use. You can quickly select the type of schema you want to generate and then it’s easy to use text fields to fill in that data. 
  • Rank Ranger’s Schema Generator: This is another simple tool to generate schema quickly by entering a range of text input boxes. 


After you’ve selected the type of schema you want to use and filled in the correct data, they give you an option to copy the code. This code embed will need to be placed directly into your website CMS. Here’s an example of filled-in ‘Local Business’ data and the generated schema code:



After you’ve copied the code, you’ll want to embed this within a web-page of your website. You can do this by logging into your CMS and including it in the markup of the page, usually in the header or footer HTML section. 


It should be noted that each CMS is different here. It does not matter where in the page (such as header or footer) you place the code.



After you’ve installed the schema markup, you should publish or deploy the changes and test. You can test with Google’s Structured Data testing tool by entering the exact page URL and having Google find the schema they see.



SEO is a big, complicated subject that's only getting more complex. I hope you've found these tips useful for preparing your customers' sites for the increasingly structured-data world.



Headshot of Russ Jeffery

Director of Platform Strategy, Duda.


Did you find this article interesting?


Thanks for the feedback!
By Shawn Davis April 1, 2026
Core Web Vitals aren't new, Google introduced them in 2020 and made them a ranking factor in 2021. But the questions keep coming, because the metrics keep changing and the stakes keep rising. Reddit's SEO communities were still debating their impact as recently as January 2026, and for good reason: most agencies still don't have a clear, repeatable way to measure, diagnose, and fix them for clients. This guide cuts through the noise. Here's what Core Web Vitals actually measure, what good scores look like today, and how to improve them—without needing a dedicated performance engineer on every project. What Core Web Vitals measure Google evaluates three user experience signals to determine whether a page feels fast, stable, and responsive: Largest Contentful Paint (LCP) measures how long it takes for the biggest visible element on a page — usually a hero image or headline — to load. Google considers anything under 2.5 seconds good. Above 4 seconds is poor. Interaction to Next Paint (INP) replaced First Input Delay (FID) in March 2024. Where FID measures the delay before a user's first click is registered, INP tracks the full responsiveness of every interaction across the page session. A good INP score is under 200 milliseconds. Cumulative Layout Shift (CLS) measures visual stability — how much page elements unexpectedly move while content loads. A score below 0.1 is good. Higher scores signal that images, ads, or embeds are pushing content around after load, which frustrates users and tanks conversions. These three metrics are a subset of Google's broader Page Experience signals, which also include HTTPS, safe browsing, and mobile usability. Core Web Vitals are the ones you can most directly control and improve. Why your clients' scores may still be poor Core Web Vitals scores vary dramatically by platform, hosting, and how a site was built. Some of the most common culprits agencies encounter: Heavy above-the-fold content . A homepage with an autoplay video, a full-width image slider, and a chat widget loading simultaneously will fail LCP every time. The browser has to resolve all of those resources before it can paint the largest element. Unstable image dimensions . When an image loads without defined width and height attributes, the browser doesn't reserve space for it. It renders the surrounding text, then jumps it down when the image appears. That jump is CLS. Third-party scripts blocking the main thread . Analytics pixels, ad tags, and live chat tools run on the browser's main thread. When they stack up, every click and tap has to wait in line — driving INP scores up. A single slow third-party script can push an otherwise clean site into "needs improvement" territory. Too many web fonts . Each font family and weight is a separate network request. A page loading four font files before rendering any text will fail LCP, especially on mobile connections. Unoptimized images . JPEGs and PNGs served at full resolution, without compression or modern formats like WebP or AVIF, add unnecessary weight to every page load. How to measure them accurately There are two types of Core Web Vitals data you should be looking at for every client: Lab data comes from tools like Google PageSpeed Insights, Lighthouse, and WebPageTest. It simulates page loads in controlled conditions. Lab data is useful for diagnosing specific issues and testing fixes before you deploy them. Field data (also called Real User Monitoring, or RUM) comes from actual users visiting the site. Google collects this through the Chrome User Experience Report (CrUX) and surfaces it in Search Console and PageSpeed Insights. Field data is what Google actually uses as a ranking signal — and it often looks worse than lab data because it reflects real-world device and connection variability. If your client's site has enough traffic, you'll see field data in Search Console under Core Web Vitals. This is your baseline. Lab data helps you understand why the scores are what they are. For clients with low traffic who don't have enough field data to appear in CrUX, you'll be working primarily with lab scores. Set that expectation early so clients understand that improvements may not immediately show up in Search Console. Practical fixes that move the needle Fix LCP: get the hero image loading first The single most effective LCP improvement is adding fetchpriority="high" to the hero image tag. This tells the browser to prioritize that resource over everything else. If you're using a background CSS image for the hero, switch it to anelement — background images aren't discoverable by the browser's preload scanner. Also check whether your hosting serves images through a CDN with caching. Edge delivery dramatically reduces the time-to-first-byte, which feeds directly into LCP. Fix CLS: define dimensions for every media element Every image, video, and ad slot on the page needs explicit width and height attributes in the HTML. If you're using responsive CSS, you can still define the aspect ratio with aspect-ratio in CSS while leaving the actual size fluid. The key is giving the browser enough information to reserve space before the asset loads. Avoid inserting content above existing content after page load. This is common with cookie banners, sticky headers that change height, and dynamically loaded ad units. If you need to show these, anchor them to fixed positions so they don't push content around. Fix INP: reduce what's competing for the main thread Audit third-party scripts and defer or remove anything that isn't essential. Tools like WebPageTest's waterfall view or Chrome DevTools Performance panel show you exactly which scripts are blocking the main thread and for how long. Load chat widgets, analytics, and ad tags asynchronously and after the page's critical path has resolved. For most clients, moving non-essential scripts to load after the DOMContentLoaded event is a meaningful INP improvement with no visible impact on the user experience. For websites with heavy JavaScript — particularly those built on frameworks with large client-side bundles — consider breaking up long tasks into smaller chunks using the browser's Scheduler API or simply splitting components so the main thread isn't locked for more than 50 milliseconds at a stretch. What platforms handle automatically One of the practical advantages of building on a platform optimized for performance is that many of these fixes are applied by default. Duda, for example, automatically serves WebP images, lazy loads below-the-fold content, minifies CSS, and uses efficient cache policies for static assets. As of May 2025, 82% of sites built on Duda pass all three Core Web Vitals metrics — the highest recorded pass rate among major website platforms. That baseline matters when you're managing dozens or hundreds of client sites. It means you're starting each project close to or at a passing score, rather than diagnosing and patching a broken foundation. How much do Core Web Vitals actually affect rankings? Honestly, they're a tiebreaker — not a primary signal. Google has been clear that content quality and relevance still dominate ranking decisions. A well-optimized site with thin, irrelevant content won't outrank a content-rich competitor just because its CLS is 0.05. What Core Web Vitals do affect is the user experience that supports those rankings. Pages with poor LCP scores have measurably higher bounce rates. Sites with high CLS lose users mid-session. Those behavioral signals — time on page, return visits, conversions — are things search engines can observe and incorporate. The practical argument for fixing Core Web Vitals isn't just "because Google said so." It's that faster, more stable pages convert better. Every second of LCP improvement can reduce bounce rates by 15–20% depending on the industry and device mix. For client sites that monetize through leads or eCommerce, that's a revenue argument, not just an SEO argument. A repeatable process for agencies Audit every new site before launch. Run PageSpeed Insights and record LCP, INP, and CLS scores for both mobile and desktop. Flag anything in the "needs improvement" or "poor" range before the client sees the live site. Check Search Console monthly for existing clients. The Core Web Vitals report surfaces issues as they appear in field data. Catching a regression early — before it compounds — is significantly easier than explaining a traffic drop after the fact. Document what you've improved. Clients rarely see Core Web Vitals scores on their own. A monthly one-page performance summary showing before/after scores builds credibility and makes your technical work visible. Prioritize mobile. Google uses mobile-first indexing, and field data shows that mobile CWV scores are almost always worse than desktop. If you only have time to optimize one version, do mobile first. Core Web Vitals aren't a one-time fix. Platforms change, new scripts get added, campaigns bring in new widgets. Build the audit into your workflow and treat it like any other ongoing deliverable, and you'll stay ahead of the issues before they affect your clients' rankings. Duda's platform is built with Core Web Vitals performance in mind. Explore how it handles image optimization, script management, and site speed automatically — so your team spends less time debugging and more time building.
By Ilana Brudo March 31, 2026
Vertical SaaS must transition from tools to an AI-powered Vertical Operating System (vOS). Learn to leverage context, end tech sprawl, and maximize retention.
By Shawn Davis March 27, 2026
Automate client management, instant site generation, and data synchronization with an API-driven website builder to create a scalable growth engine for your SaaS platform.
Show More

Latest posts