Add more comprehensive structured data

sgcarstrends · Aug 25, 2024 · 0bff1de · 0bff1de
1 parent 5bcfc3e
commit 0bff1de
Show file tree

Hide file tree

Showing 3 changed files with 139 additions and 19 deletions.
diff --git a/app/cars/[type]/page.tsx b/app/cars/[type]/page.tsx
@@ -22,7 +22,7 @@ import { capitaliseWords } from "@/utils/capitaliseWords";
 import { fetchApi } from "@/utils/fetchApi";
 import { formatDateToMonthYear } from "@/utils/formatDateToMonthYear";
 import type { Metadata } from "next";
-import type { WebPage, WithContext } from "schema-dts";
+import type { Dataset, WebPage, WithContext } from "schema-dts";
 
 interface Props {
   params: { type: string };
@@ -45,7 +45,7 @@ export const generateMetadata = async ({
 
   return {
     title: capitaliseWords(type),
-    description: `${capitaliseWords(type)} car registrations for the month of ${formatDateToMonthYear(month)}`,
+    description: `Car registration trends for ${type} fuel type`,
     openGraph: {
       images,
       url: pageUrl,
@@ -102,11 +102,41 @@ const CarsByFuelTypePage = async ({ params, searchParams }: Props) => {
     ({ make, number }) => !EXCLUSION_LIST.includes(make) && number > 0,
   );
 
-  const structuredData: WithContext<WebPage> = {
+  const structuredData: WithContext<Dataset> = {
     "@context": "https://schema.org",
-    "@type": "WebPage",
-    name: capitaliseWords(type),
+    "@type": "Dataset",
+    name: `${capitaliseWords(type)} Car Registrations in Singapore`,
+    description: `Overview and registration statistics for ${type} cars in Singapore by make`,
     url: `${SITE_URL}/cars/${type}`,
+    creator: {
+      "@type": "Organization",
+      name: SITE_TITLE,
+    },
+    variableMeasured: [
+      {
+        "@type": "PropertyValue",
+        name: "Make",
+        description: "Car manufacturer",
+      },
+      {
+        "@type": "PropertyValue",
+        name: "Count",
+        description: `Number of ${type} car registrations`,
+      },
+      {
+        "@type": "PropertyValue",
+        name: "Market Share by Type",
+        description: `Percentage market share of ${type} car registrations by type`,
+      },
+    ],
+    // TODO: For future use
+    // distribution: [
+    //   {
+    //     "@type": "DataDownload",
+    //     encodingFormat: "image/png",
+    //     contentUrl: `${SITE_URL}/images/${type}-car-stats.png`,
+    //   },
+    // ],
   };
 
   return (

diff --git a/app/cars/page.tsx b/app/cars/page.tsx
@@ -21,13 +21,19 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card";
-import { API_URL, FUEL_TYPE, HYBRID_REGEX, SITE_URL } from "@/config";
+import {
+  API_URL,
+  FUEL_TYPE,
+  HYBRID_REGEX,
+  SITE_TITLE,
+  SITE_URL,
+} from "@/config";
 import { type Car, type LatestMonth, RevalidateTags } from "@/types";
 import { fetchApi } from "@/utils/fetchApi";
 import { formatDateToMonthYear } from "@/utils/formatDateToMonthYear";
 import { formatPercent } from "@/utils/formatPercent";
-import type { Metadata, ResolvingMetadata } from "next";
-import type { WebPage, WithContext } from "schema-dts";
+import type { Metadata } from "next";
+import type { Dataset, Report, WithContext } from "schema-dts";
 
 interface Props {
   searchParams: { [key: string]: string };
@@ -123,18 +129,69 @@ const CarsPage = async ({ searchParams }: Props) => {
   const [topVehicleType, topVehicleTypeValue] =
     findTopEntry(numberByVehicleType);
 
-  const formattedDate = formatDateToMonthYear(month);
-  const structuredData: WithContext<WebPage> = {
+  const formattedMonth = formatDateToMonthYear(month);
+  const datasetJsonLd: WithContext<Dataset> = {
     "@context": "https://schema.org",
-    "@type": "WebPage",
-    name: "Car Registrations",
+    "@type": "Dataset",
+    name: `Singapore Car Registrations ${formattedMonth}`,
+    description: `Comprehensive overview of car registrations in Singapore for ${formattedMonth}, including total registrations, fuel types, vehicle types, and top manufacturers.`,
     url: `${SITE_URL}/cars`,
-    description: `Breakdown of the cars registered in ${formattedDate} by fuel type and vehicle type`,
+    creator: {
+      "@type": "Organization",
+      name: SITE_TITLE,
+    },
+    variableMeasured: [
+      {
+        "@type": "PropertyValue",
+        name: "Total Registrations",
+        value: total,
+      },
+      {
+        "@type": "PropertyValue",
+        name: "Top Fuel Type",
+        value: `${topFuelType} (${topFuelTypeValue})`,
+      },
+      {
+        "@type": "PropertyValue",
+        name: "Top Vehicle Type",
+        value: `${topVehicleType} (${topVehicleTypeValue})`,
+      },
+    ],
+  };
+  const reportJsonLd: WithContext<Report> = {
+    "@context": "https://schema.org",
+    "@type": "Report",
+    name: `Singapore Car Registrations Report - ${formattedMonth}`,
+    description: `Breakdown of the cars registered in ${formattedMonth} by fuel type and vehicle type`,
+    url: `${SITE_URL}/cars`,
+    author: {
+      "@type": "Organization",
+      name: "SGCarsTrends",
+    },
+    genre: "Statistical Report",
+    mentions: [
+      {
+        "@type": "Thing",
+        name: "Toyota",
+        description: "Top overall manufacturer with 652 registrations",
+      },
+      {
+        "@type": "Thing",
+        name: `${topFuelType}`,
+        description: `Most popular fuel type with ${topFuelTypeValue} registrations`,
+      },
+      {
+        "@type": "Thing",
+        name: `${topVehicleType}`,
+        description: `Most popular vehicle type with ${topVehicleTypeValue} registrations`,
+      },
+    ],
   };
 
   return (
     <>
-      <StructuredData data={structuredData} />
+      <StructuredData data={datasetJsonLd} />
+      <StructuredData data={reportJsonLd} />
       <div className="flex flex-col gap-8">
         <UnreleasedFeature>
           <Breadcrumb>

diff --git a/app/make/[make]/page.tsx b/app/make/[make]/page.tsx
@@ -16,7 +16,7 @@ import { type Car, type Make, RevalidateTags } from "@/types";
 import { fetchApi } from "@/utils/fetchApi";
 import { formatDateToMonthYear } from "@/utils/formatDateToMonthYear";
 import type { Metadata } from "next";
-import type { WebPage, WithContext } from "schema-dts";
+import type { Dataset, WebPage, WithContext } from "schema-dts";
 
 interface Props {
   params: { make: string };
@@ -74,12 +74,45 @@ const CarMakePage = async ({ params }: Props) => {
 
   const filteredCars = mergeCarData(cars);
 
-  const structuredData: WithContext<WebPage> = {
+  const formattedMake = decodeURIComponent(make);
+  const structuredData: WithContext<Dataset> = {
     "@context": "https://schema.org",
-    "@type": "WebPage",
-    name: make,
-    description: `${make} historical trends`,
+    "@type": "Dataset",
+    name: `${formattedMake} Car Registrations in Singapore`,
+    description: `Historical trend and monthly breakdown of ${formattedMake} car registrations by fuel type and vehicle type in Singapore`,
     url: `${SITE_URL}/make/${make}`,
+    // TODO: Suggested by Google
+    // temporalCoverage: "2016-06/2024-07",
+    variableMeasured: [
+      {
+        "@type": "PropertyValue",
+        name: "Month",
+        description: "Month of registration",
+      },
+      {
+        "@type": "PropertyValue",
+        name: "Fuel Type",
+        description: "Type of fuel used by the vehicle",
+      },
+      {
+        "@type": "PropertyValue",
+        name: "Vehicle Type",
+        description: `Type of ${formattedMake} vehicle`,
+      },
+      {
+        "@type": "PropertyValue",
+        name: "Count",
+        description: "Number of registrations",
+      },
+    ],
+    // TODO: For future use
+    // distribution: [
+    //   {
+    //     "@type": "DataDownload",
+    //     encodingFormat: "text/html",
+    //     contentUrl: `https://sgcarstrends.com/cars/${make}-trends.png`,
+    //   },
+    // ],
   };
 
   return (