Section 4: Schema.org Structured Data & Accessibility Audit
Your website looks great, loads fast, and works on every screen size. But there is still a layer that most people skip — and it is the layer that directly affects how Google ranks your site and whether it qualifies for special search features. This section covers two things: Schema.org structured data and a final accessibility audit.
By the end of this section, your website will be eligible for rich results in Google Search, fully audited for accessibility, and production-ready for real clients.
Schema.org Structured Data
When Google crawls your website, it reads your HTML. But HTML tells Google what your content looks like, that is, headings, paragraphs, images. It does not tell Google what your content means.
What Is Structured Data?
Structured data solves this. It is a block of code you add to your pages that tells Google exactly what kind of business you are, what services you offer, where you are located, what your FAQs are, and how to display your link in search results.
The format we use is called JSON-LD. It sits inside a single script tag in your HTML code. It does not change anything visible on the page, and it does not affect your styles or layout.
JSON-LD stands for JavaScript Object Notation for Linked Data. Despite the name, it has nothing to do with JavaScript running on your page. It is simply a structured text block Google reads silently.
The Three Schema Types We Will Add
We will add three schema types across our website, one per page where it is most relevant. They are:
- LocalBusiness: Add in the index.html page. It tells Google your business name, address, phone, hours, and website.
- FAQPage: Add in the index.html page to connect to the FAQ section we built in Part 2. This will enable FAQ dropdowns in Google search.
- Service: Add in the services.html page. It describes each service you offer so Google can display them as rich cards in SERP.
Schema 1: LocalBusiness (index.html)
Open index.html. Find the closing </head> tag, then copy and paste the following code block directly above it.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "LocalBusiness",
"name": "Kmacims Web Solutions",
"url": " https://kckamac.github.io/Business-site-native/",
"logo": "https:// https://kckamac.github.io/Business-site-native/ /images/og-image.png",
"image": " https:// https://kckamac.github.io/Business-site-native/ /images/og-image.png ",
"description": " We build fast, modern, and professional business websites using clean HTML and CSS.",
"telephone": "+234-803-732-1869",
"email": "contact@kmacims.com.ng",
"address": {
"@type": "PostalAddress",
"streetAddress": " Old Umuahia,",
"addressLocality": "Umuahia",
"addressRegion": "Abia State",
"postalCode": "440002",
"addressCountry": "NG"
},
"openingHoursSpecification": [
{
"@type": "OpeningHoursSpecification",
"dayOfWeek": ["Monday","Tuesday","Wednesday","Thursday","Friday"],
"opens": "09:00",
"closes": "16:00"
}
],
"sameAs": [
“https://www.linkedin.com/in/kmacims",
"https://twitter.com/kmacims"
]
}
</script>
After pasting the above code, replace every placeholder value with your real business details before going live. A quick explanation of the key fields:
- “@type”: “LocalBusiness”: Tells Google this is a physical or service-area business. If your business does not have a physical location, do not use this; instead, use any of organization, corporation, OnlineBusiness or professionalService.
- “telephone“: Enables a tap-to-call button on mobile search results.
- “openingHoursSpecification“: Displays your business hours directly in the Google search card.
- “sameAs“: Links your website to your social profiles, reinforcing brand identity in search.
- “logo“: Google may display this logo in knowledge panels and search cards.
Schema 2: FAQPage (index.html)
In Part 2, we built a native HTML FAQ accordion using the <details> and <summary> elements. We said at the time that this structure is a strong candidate for FAQ rich results in Google Search. Now we make that happen.
The FAQPage schema connects your FAQ content to Google’s rich result system. When configured correctly, Google can display your FAQ questions and answers as expandable dropdowns directly inside the search result, no click required.
Still in the <head> of index.html, copy and paste a second script block, below the LocalBusiness one. Update the question-and-answer text to match your actual FAQ content exactly.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{
"@type": "Question",
"name": "What services do you offer?",
"acceptedAnswer": {
"@type": "Answer",
"text": "We offer web design, development, and digital consulting for businesses of all sizes."
}
},
{
"@type": "Question",
"name": "How long does a take to build a website?",
"acceptedAnswer": {
"@type": "Answer",
"text": " Most projects are completed within 3–4 weeks from the point of receiving your content and sign-off on the design direction. Larger enterprise projects may take 6–8 weeks. We provide a clear project timeline at the start of every engagement."
}
},
{
"@type": "Question",
"name": "Do you work with clients outside Nigeria?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Yes. We work with clients remotely across Africa, Europe, and North America."
}
},
{
"@type": "Question",
"name": "What do you need from me to get started?",
"acceptedAnswer": {
"@type": "Answer",
"text": " To begin, we need a completed brief (we provide a simple questionnaire), your brand assets (logo files, colours, preferred fonts if you have them), and a 50% deposit. From there, we handle everything — sitemap, wireframes, design, build, and launch."
}
}
]
}
</script>
Schema 3: Service (services.html)
Each service you offer can be described with a Service schema type. This gives Google the structured signal it needs to understand and categorise your offerings, and in some cases, display them as rich service cards.
Copy and paste the following code block above the </head> closing tag in services.html. Update the name, description, and offers fields to match your actual services.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "ItemList",
"name": "Our Services",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"item": {
"@type": "Service",
"name": "Web Design",
"description": "Custom, responsive website designs built for speed and conversions.",
"provider": {
"@type": "LocalBusiness",
"name": "Kmacims Web Solutions"
},
"offers": {
"@type": "Offer",
"priceCurrency": "USD",
"price": "399",
"availability": "https://schema.org/InStock"
}
}
},
{
"@type": "ListItem",
"position": 2,
"item": {
"@type": "Service",
"name": "Web Development",
"description": "High-performance websites built with clean, framework-free code.",
"provider": {
"@type": "LocalBusiness",
"name": "Kmacims Web Solutions"
},
"offers": {
"@type": "Offer",
"priceCurrency": "USD",
"price": "799",
"availability": "https://schema.org/InStock"
}
}
},
{
"@type": "ListItem",
"position": 3,
"item": {
"@type": "Service",
"name": "Digital Consulting",
"description": "Strategic guidance on digital presence, SEO, and online growth.",
"provider": {
"@type": "LocalBusiness",
"name": "Your Business Name"
},
"offers": {
"@type": "Offer",
"priceCurrency": "USD",
"price": "150",
"availability": "https://schema.org/InStock"
}
}
}
]
}
</script>
Testing Your Structured Data
Structured data cannot be tested locally. You need a live URL. However, Google provides a free tool called the Rich Results Test that checks your schema even before it is indexed.
Once your site is deployed, test each page using the Google Rich Results Test tool: search.google.com/test/rich-results following these steps.
- Paste your live page URL into the tool
- Click TEST URL
- Scroll down — you will see which rich result types your page qualifies for
- Any errors or warnings will be listed with the specific field causing the problem
- Fix the error in your HTML, redeploy, and test again
Accessibility Audit
Accessibility is often treated as a nice-to-have, but it is not. An inaccessible website excludes real users, that is, people who navigate with a keyboard instead of a mouse, people who use screen readers, and people with low vision or colour blindness.
Beyond ethics, accessibility is also a legal requirement in many countries. And it directly improves your SEO because Google’s crawlers behave very similarly to screen readers. A site that is easy to navigate with a screen reader is also easy for Google to index.
We will audit most relevant accessibility areas for our website. You can include other options on your own later.
1. Skip Navigation Link
A skip navigation link is a hidden link at the very top of every page. When a keyboard user presses Tab as their first action on the page, this link becomes visible. Clicking it jumps them directly to the main content, bypassing the navigation bar they have already heard on every previous page.
Without this, a keyboard user must Tab through every single navigation link on every page load before reaching the content. On a site with eight nav links, that is eight Tab presses on every page visit.
Open all four HTML files and add the following line as the very first element inside <body>, before the <header> tag.
<!-- Skip Navigation Link — add this as the FIRST element inside <body> -->
<a href="#main-content" class="skip-link">Skip to main content</a>
Now add a matching id to the <main> element on every page. Find the opening <main> tag and update it:
<!-- BEFORE -->
<main>
<!-- AFTER -->
<main id="main-content">
Now add the CSS. Open css/styles.css and paste these rules at the top of the file, just below the base reset:
/* ── Skip Navigation ─────────────────────────────── */
.skip-link {
position: absolute;
top: -100%;
left: 1rem;
background: var(--primary-color);
color: #fff;
padding: 0.75rem 1.25rem;
border-radius: 0 0 6px 6px;
font-weight: 600;
text-decoration: none;
z-index: 9999;
transition: top 0.2s;
}
.skip-link:focus {
top: 0;
}
2. robots.txt and sitemap.xml
These two files are not accessibility features but they are non-negotiable for any production website. We include them in this audit section because they are the final checklist items before a site can be called truly production-ready.
robots.txt
The robots.txt file tells search engine crawlers which pages they are allowed to index and which they should ignore. Without it, crawlers will still index your site, but having the file in place is a signal of a well-maintained, professional website.
Create a new file named robots.txt in the root of your business-site folder, The same folder as index.html, and paste the following:
# robots.txt — business-site
User-agent: *
Allow: /
Sitemap: https://www.kmacims.com.ng/sitemap.xml
In the robots.txt file, User-agent: * means this rule applies to all crawlers. Allow: / means they can access everything. The Sitemap line tells them where to find the map of your pages.
sitemap.xml
A sitemap is a file that lists every page on your website. You submit it to Google Search Console so Google knows exactly what to crawl and index. Without a sitemap, Google will still find your page, but a sitemap makes the process faster and more reliable.
Create a new file named sitemap.xml in the root of your business-site folder. Paste the following, replacing the domain with your own:
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://www.kmacims.com.ng/</loc>
<changefreq>weekly</changefreq>
<priority>1.0</priority>
</url>
<url>
<loc>https://www.kmacims.com.ng/about.html</loc>
<changefreq>monthly</changefreq>
<priority>0.8</priority>
</url>
<url>
<loc>https://www.kmacims.com.ng/services.html</loc>
<changefreq>monthly</changefreq>
<priority>0.9</priority>
</url>
<url>
<loc>https://www.kmacims.com.ng /contact.html</loc>
<changefreq>monthly</changefreq>
<priority>0.7</priority>
</url>
</urlset>
Priority does not affect ranking; it is a hint to the crawler about which pages matter most. 1.0 is the highest priority (homepage), and 0.7 is lower (contact).
After deploying your site, submit the sitemap to Google Search Console by following these steps:
| 1. Go to search.google.com/search-console and sign in with a Google account. 2. Add your domain as a new property and verify ownership (Netlify makes this easy). 3. In the left sidebar, click Sitemaps 4. Enter sitemap.xml in the input field and click Submit. 5. Google will confirm receipt and begin crawling your pages within a few days. |
