Fix SEO: unique descriptions, OG dimensions, structured data, 404 status

- Add unique meta descriptions to all pages (index, about, cv, posts, tags, archives, search)
- Pass description from AboutLayout frontmatter to Layout head
- Add OG image dimensions (1200x630), og:site_name, og:locale
- Add Twitter image dimensions and twitter:creator
- Improve structured data: Person schema with sameAs social links, description on WebSite
- Set HTTP 404 status code on 404 page

Author: ArghaRay00

src/layouts/AboutLayout.astro

@@ -6,12 +6,12 @@ import Breadcrumb from "@/components/Breadcrumb.astro";
 import Layout from "./Layout.astro";
 import { SITE } from "@/config";
 
-type Props = MarkdownLayoutProps<{ title: string }>;
+type Props = MarkdownLayoutProps<{ title: string; description?: string }>;
 
 const { frontmatter } = Astro.props;
 ---
 
-<Layout title={`${frontmatter.title} | ${SITE.title}`}>
+<Layout title={`${frontmatter.title} | ${SITE.title}`} description={frontmatter.description}>
   <Header />
   <Breadcrumb />
   <main id="main-content" class="app-layout">

src/layouts/Layout.astro

@@ -31,6 +31,13 @@ const {
 
 const socialImageURL = new URL(ogImage, Astro.url);
 
+const personSchema = {
+  "@type": "Person",
+  name: `${author}`,
+  url: "https://argha.dev",
+  ...(profile && { sameAs: [profile, "https://www.linkedin.com/in/argha94", "https://x.com/argharay94"] }),
+};
+
 const structuredData = pubDatetime
   ? {
       "@context": "https://schema.org",
@@ -39,24 +46,15 @@ const structuredData = pubDatetime
       image: `${socialImageURL}`,
       datePublished: pubDatetime.toISOString(),
       ...(modDatetime && { dateModified: modDatetime.toISOString() }),
-      author: [
-        {
-          "@type": "Person",
-          name: `${author}`,
-          ...(profile && { url: profile }),
-        },
-      ],
+      author: [personSchema],
     }
   : {
       "@context": "https://schema.org",
       "@type": "WebSite",
       name: `${title}`,
       url: `${canonicalURL}`,
-      author: {
-        "@type": "Person",
-        name: `${author}`,
-        ...(profile && { url: profile }),
-      },
+      description: `${description}`,
+      author: personSchema,
     };
 ---
 
@@ -100,6 +98,11 @@ const structuredData = pubDatetime
     <meta property="og:description" content={description} />
     <meta property="og:url" content={canonicalURL} />
     <meta property="og:image" content={socialImageURL} />
+    <meta property="og:image:width" content="1200" />
+    <meta property="og:image:height" content="630" />
+    <meta property="og:image:type" content="image/png" />
+    <meta property="og:site_name" content={SITE.title} />
+    <meta property="og:locale" content="en_US" />
 
     <!-- Article Published/Modified time -->
     {
@@ -125,6 +128,9 @@ const structuredData = pubDatetime
     <meta property="twitter:title" content={title} />
     <meta property="twitter:description" content={description} />
     <meta property="twitter:image" content={socialImageURL} />
+    <meta property="twitter:image:width" content="1200" />
+    <meta property="twitter:image:height" content="630" />
+    <meta name="twitter:creator" content="@argharay94" />
 
     <!-- Google JSON-LD Structured data -->
     <script

src/pages/404.astro

@@ -4,6 +4,8 @@ import Header from "@/components/Header.astro";
 import Footer from "@/components/Footer.astro";
 import LinkButton from "@/components/LinkButton.astro";
 import { SITE } from "@/config";
+
+Astro.response.status = 404;
 ---
 
 <Layout title={`404 Not Found | ${SITE.title}`}>

src/pages/about.md

@@ -1,6 +1,7 @@
 ---
 layout: ../layouts/AboutLayout.astro
 title: "About"
+description: "Argha Ray — software engineer with nine years in production backend systems at Motorola Solutions. Building agent infrastructure, tool orchestration, and knowledge systems. Based in Bangalore, open to remote roles in Europe."
 ---
 
 I'm Argha — a software engineer in Bangalore with nine years of building things that run in production.

src/pages/archives/index.astro

@@ -31,7 +31,7 @@ const months = [
 ];
 ---
 
-<Layout title={`Archives | ${SITE.title}`}>
+<Layout title={`Archives | ${SITE.title}`} description="All articles by Argha Ray, organized by date.">
   <Header />
   <Main pageTitle="Archives" pageDesc="All the articles I've archived.">
     {

src/pages/cv.md

@@ -1,6 +1,7 @@
 ---
 layout: ../layouts/AboutLayout.astro
 title: "CV"
+description: "CV of Argha Ray — Senior Software Engineer at Motorola Solutions. Nine years in Java, C#, TypeScript, Python. RBAC engines, HA PostgreSQL, deployment tooling, agent engineering. Open to remote roles."
 ---
 
 # Argha Ray

src/pages/index.astro

@@ -19,7 +19,7 @@ const recentPosts = sortedPosts.filter(({ data }) => !data.featured);
 const allPosts = [...featuredPosts, ...recentPosts];
 ---
 
-<Layout>
+<Layout description="Argha Ray — software engineer at Motorola Solutions. Nine years in production backend systems. Building agent infrastructure and writing about what works.">
   <Header />
   <main id="main-content" data-layout="index" class="app-layout">
     <!-- Intro -->

src/pages/posts/[...page].astro

@@ -18,7 +18,7 @@ export const getStaticPaths = (async ({ paginate }) => {
 const { page } = Astro.props;
 ---
 
-<Layout title={`Posts | ${SITE.title}`}>
+<Layout title={`Posts | ${SITE.title}`} description="Articles on backend systems, agent engineering, streaming architecture, and building real things.">
   <Header />
   <Main pageTitle="Posts" pageDesc="All the articles I've posted.">
     <ul>

src/pages/search.astro

@@ -9,7 +9,7 @@ import { SITE } from "@/config";
 const backUrl = SITE.showBackButton ? `${Astro.url.pathname}` : "/";
 ---
 
-<Layout title={`Search | ${SITE.title}`}>
+<Layout title={`Search | ${SITE.title}`} description="Search articles on argha.dev.">
   <Header />
   <Main pageTitle="Search" pageDesc="Search any article ...">
     <div id="pagefind-search" transition:persist data-backurl={backUrl}></div>

src/pages/tags/[tag]/[...page].astro

@@ -31,7 +31,7 @@ const { tag } = params;
 const { page, tagName } = Astro.props;
 ---
 
-<Layout title={`Tag: ${tagName} | ${SITE.title}`}>
+<Layout title={`Tag: ${tagName} | ${SITE.title}`} description={`Articles tagged "${tagName}" by Argha Ray.`}>
   <Header />
   <Main
     pageTitle={[`Tag:`, `${tagName}`]}