Implementing schema.org is vital for improving SEO performance, especially for public-facing projects. At MarsBased, we adopted a standard approach that must be applied to every client project prioritizing SEO.
We have written about this in the past, in A cleaner implementation of Schema.org using JSON but we have a few extra considerations, five years later.
Schema, primarily referencing the resource schema.org, is the tool that crawlers use to better understand the typology of indexed content. By defining entities, you can detail attributes for an organisation - such as MarsBased - (like team size, address, and social profiles) or other content types. While not implementing schema will not break a website, doing so significantly improves your SEO performance.
Historically, schema was implemented using Microdata, which involved scattering attributes such as item scope and item prop directly within the HTML. This mixes meta attributes with the actual content and is not easily maintainable, particularly across large codebases, because changes are hard to track across scattered code, like in this example:
The solution we adopted a few years ago is JSON-LD. This approach is cleaner and more maintainable because it centralizes all schema information into a single block using a JSON format script.
See an example here:
Why did we change?
Here's the example of our presenter that generates the JSON script for job offers:
# rubocop:disable Metrics/MethodLength
def to_jsonld
{
'@context': 'https://schema.org/',
'@type': 'JobPosting',
title: full_title,
description: job_offer.summary,
identifier: {
'@type': 'PropertyValue',
name: 'MarsBased',
value: ENV.fetch('JOB_POSTING_COMPANY_IDENTIFIER', '')
},
datePosted: job_offer.published_at&.to_date,
applicantLocationRequirements: [
{ '@type': 'Country', 'name': 'Austria' },
# removed this long list of countries for readability
],
jobLocationType: 'TELECOMMUTE',
employmentType: job_offer.in_house? ? 'IN_HOUSE' : 'CONTRACTOR',
hiringOrganization: {
'@type': 'Organization',
name: 'MarsBased',
sameAs: 'https://marsbased.com',
logo: ENV.fetch('MARSBASED_LOGO_URL', '')
},
baseSalary: {
'@type': 'MonetaryAmount',
currency: 'EUR',
value: {
'@type': 'QuantitativeValue',
minValue: job_offer.salary_min,
maxValue: job_offer.salary_max,
unitText: job_offer.in_house? ? 'YEAR' : 'HOUR'
}
}
}.to_json
end
To ensure proper implementation and maximum benefit, our team adheres to the following decisions and best practices:
By implementing schema correctly, you improve how content appears in search results and when URLs are unfurled on social media or by AI tools like ChatGPT, Perplexity and the like. Make yourself and your projects more visible in the vast sea of business!
Find out how we organise in our frontend projects and the tools we use.
Read full article
Learn how we help our customers to reduce their time to market by prototyping on static pages, not on the real product.
Read full article
Schema.org has been around for some years now, but recently they introduced a cleaner implementation that doesn't mess up with your code so much as the first one, this time by using JSON.
Read full article