One of the best ways to learn how schema works is to write out schema code yourself. There are plugins and tools you can use that will build out the schema code for you, and those plugins and tools are great. I highly recommend you use them, especially in a production environment. But if you really want to understand what’s going on with the schema code, what the different pieces and parts of schema are, and what the intricacies of how schema comes together are, you need to be able to put the code together yourself. This will also help you debug what those tools and plugins are doing as you look at them and try to figure out if they are working on your website or not.
With that in mind, in this video, let’s write out schema code together.
Three Ways to Write Schema Code
The first thing you need to know about schema code is that you can write it in three different ways. There are three different methods you can use: RDFa, Microdata, and JSON-LD. RDFa and Microdata are embedded within the HTML code, while JSON-LD is separate from the rest of the code. That typically makes JSON-LD a bit easier to add.
For this example, we’re going to use JSON-LD, which is the method recommended by Google. Even though JSON-LD is recommended, Google will work with and show markup from RDFa and Microdata in search results.
Organization Schema Example
There are many different types of schema that you can use. In this video, I’m going to use Organization schema as an example. This schema type provides details about an organization. It is commonly placed on the website’s home page and can be used by Google to add data to knowledge panels.
Within a type of schema, there are different properties. Each property contains a piece of information. For Organization schema, Google currently requires two properties: the website URL and the company logo. Along with those required properties, it’s common to provide other pieces of information, like the organization’s name, its address, or information about the people who work with the organization. You can view all the available properties for any schema type on Schema.org.
Writing the JSON-LD Code
To begin writing Organization schema in JSON-LD, the first step is to open the script tag that will contain the JSON-LD code. If that seems odd, remember that the “JS” in JSON-LD stands for JavaScript. JSON-LD, then, is a type of script being added to the page. We want to add a type attribute of application/ld+json to the script tag to make it clear what the script tag will contain.
Now we’re ready to start writing our JSON-LD code, and we’re going to start by creating an object. We do this by typing an opening brace.
The first line of code we’re going to put in declares the context with @context. Note that @context is enclosed within quotes. Then we type a colon, which is essentially saying that our @context will equal whatever we type next. In this case, our @context is http://schema.org. We enclose that in quotes as well. At the end of the line, you want to provide a comma to separate this line from the next.
On the next line, we want to specify the schema type, in this case Organization. Note that @type and Organization are both enclosed in quotes and separated by a colon. Here again, we end the line with a comma.
Once the type has been declared, we can add more information about this organization to the schema code. We’ll start with the name property and set that equal to this organization’s name. In this example, that’s Elementive. We can add other information in other properties: the legal name in the legalName property, the website URL for this organization in the url property, the organization’s logo in the logo property, and the organization’s email address in the email property.
The next piece of information we want to provide is the organization’s address. The address property isn’t just text like what we’ve seen before. Instead, the address is an object containing other information. So after typing in our property name and the colon, we want to start a new object with an opening brace.
Since this is a new object, we need to state the type. In this case, the type is PostalAddress. After declaring the @type of PostalAddress for this particular object, we can provide the city in the addressLocality property, the state in the addressRegion property, the ZIP code in the postalCode property, and the street address in the streetAddress property. Note that the last line here does not end in a comma, and that’s because we finished with this object. After all the properties are specified, we can close the object with a closing brace, and then we’ll put a comma at the end of the brace so we can move on to the next property.
The final piece of information, the final property we’re going to add in this example, will be the names of the people involved in the organization. Like the address, this is a more complex data type. In this case, the names will be presented in the founder property. There are two founders of this organization, and we need to specify each founder as a different object, but we want to present both of these objects for the one property. To do this, we’ll use an array that contains two Person schema objects.
To start, let’s state that this is the founder property. Then, after the colon, we open the array with a bracket. Then we open the first founder object with an opening brace. The @type of Person is declared, because the founder is a person. Once that’s declared, we can specify the properties about this person, in this case name and jobTitle. After completing the first founder’s object, we can close the object with a closing brace. Then we put a comma to separate the first and second founder objects.
After the comma, we’ll start the object for the next founder with an opening brace. Here again, we provide the @type of Person and the properties of name and jobTitle for this founder. Once we’re finished, we can close the object and close the array. Lastly, the schema is finished with a closing brace that corresponds to the opening brace on the very first line of code. Then we close the script tag.
Testing Your Schema Code
All right, we’ve written out our schema code. Now we need to confirm that we wrote it correctly, and there are two things we need to do to test it.
First, we can test our JSON-LD code in JSONLint. JSONLint will catch things like missing commas, unclosed objects, unclosed arrays, or mismatched quotes. Basically, it catches typos in your code. Once we know we’ve fixed any typos, we can run our code through the Schema.org validator. This will confirm that the information shared in the schema code has been provided correctly. Taking a look at this example, our Organization schema has been marked up correctly. If you run into problems with your own markup, common schema problems are a good place to start troubleshooting.
If you have any questions about working with schema, you can email me at [email protected].
If you would like to learn more about technical SEO, you might want to check out my book, Tech SEO Guide. Tech SEO Guide has been fully updated as of 2022 and provides a reference for developers, marketers, and anybody else working on the technical side of SEO. It walks through how schema works and all the other factors you need to consider when it comes to optimizing your website’s technical performance. To learn more about Tech SEO Guide or order your copy, visit techseoguide.com. You can also find more help in my technical SEO and AI search resources.
Please subscribe to the Elementive channel for more videos. Thank you so much for watching.