diff --git a/apps/blog/app/(en)/essays/[slug]/opengraph-image.tsx b/apps/blog/app/(en)/essays/[slug]/opengraph-image.tsx
new file mode 100644
index 0000000..8c64e87
--- /dev/null
+++ b/apps/blog/app/(en)/essays/[slug]/opengraph-image.tsx
@@ -0,0 +1,52 @@
+import { ImageResponse } from 'next/og';
+import { getEssayBySlug, getEssaySlugs } from '@/lib/essays';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from '@/components/seo/og-card';
+import { ogFontsFor } from '@/lib/og-fonts';
+import { TOPIC_LABELS } from '@/lib/constants';
+
+export const dynamic = 'force-static';
+
+export const alt = 'Algo Mind essay';
+export const size = { width: OG_WIDTH, height: OG_HEIGHT };
+export const contentType = 'image/png';
+
+export function generateStaticParams() {
+  return getEssaySlugs().map((slug) => ({ slug }));
+}
+
+interface RouteProps {
+  params: { slug: string };
+}
+
+export default async function OgImage({ params }: RouteProps) {
+  const fonts = ogFontsFor('en');
+  const essay = getEssayBySlug(params.slug);
+  if (!essay || essay.lang !== 'en') {
+    return new ImageResponse(
+      (
+        <OgCard
+          title="Algo Mind"
+          byline="Feitong Yang"
+          brand="Algo Mind"
+          locale="en"
+        />
+      ),
+      { ...size, fonts },
+    );
+  }
+
+  const kicker = essay.topics[0] ? TOPIC_LABELS[essay.topics[0]] : 'Essay';
+
+  return new ImageResponse(
+    (
+      <OgCard
+        title={essay.title}
+        kicker={kicker}
+        byline="Feitong Yang"
+        brand="Algo Mind"
+        locale="en"
+      />
+    ),
+    { ...size, fonts },
+  );
+}
diff --git a/apps/blog/app/(en)/essays/[slug]/page.tsx b/apps/blog/app/(en)/essays/[slug]/page.tsx
index e05b5a0..6e221cf 100644
--- a/apps/blog/app/(en)/essays/[slug]/page.tsx
+++ b/apps/blog/app/(en)/essays/[slug]/page.tsx
@@ -5,6 +5,8 @@ import { getEssayBySlug, getEssaySlugs, getTranslation } from '@/lib/essays';
 import { getMDXComponents } from '@/components/mdx/MDXComponents';
 import { mdxOptions } from '@/lib/mdx-options';
 import { EssayLayout, EssayHeader } from '@/components/essay';
+import { JsonLd } from '@/components/seo';
+import { breadcrumbSchema, essayPostingSchema } from '@/lib/jsonld';
 
 interface EssayPageProps {
   params: Promise<{ slug: string }>;
@@ -53,6 +55,13 @@ export async function generateMetadata({
     alternates.languages!['zh'] = `/zh/essays/${zhTranslation.slug}`;
   }
 
+  // If the essay declares a hand-picked image, override the autogenerated
+  // opengraph-image. Next will then use this URL for both og:image and
+  // twitter:image. Otherwise the file-convention opengraph-image takes over.
+  const ogOverride = essay.image
+    ? { openGraph: { images: [essay.image] }, twitter: { images: [essay.image] } }
+    : {};
+
   return {
     title: essay.title,
     description: essay.description,
@@ -62,6 +71,11 @@ export async function generateMetadata({
       type: 'article',
       publishedTime: essay.date,
       tags: essay.topics,
+      ...ogOverride.openGraph,
+    },
+    twitter: {
+      card: 'summary_large_image',
+      ...ogOverride.twitter,
     },
     alternates,
   };
@@ -150,22 +164,33 @@ export default async function EssayPage({ params }: EssayPageProps) {
 
   const { title, description, date, type, topics, readingTime, content, toc } =
     essay;
+  const urlPath = `/essays/${slug}`;
 
   return (
-    <EssayLayout
-      toc={toc}
-      header={
-        <EssayHeader
-          type={type}
-          topics={topics}
-          title={title}
-          description={description}
-          date={date}
-          readingTime={readingTime}
-        />
-      }
-    >
-      <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
-    </EssayLayout>
+    <>
+      <JsonLd data={essayPostingSchema(essay, urlPath)} />
+      <JsonLd
+        data={breadcrumbSchema([
+          { name: 'Home', url: '/' },
+          { name: 'Essays', url: '/essays' },
+          { name: title, url: urlPath },
+        ])}
+      />
+      <EssayLayout
+        toc={toc}
+        header={
+          <EssayHeader
+            type={type}
+            topics={topics}
+            title={title}
+            description={description}
+            date={date}
+            readingTime={readingTime}
+          />
+        }
+      >
+        <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
+      </EssayLayout>
+    </>
   );
 }
diff --git a/apps/blog/app/(en)/layout.tsx b/apps/blog/app/(en)/layout.tsx
index 08a2d6d..6c5512f 100644
--- a/apps/blog/app/(en)/layout.tsx
+++ b/apps/blog/app/(en)/layout.tsx
@@ -11,6 +11,8 @@ import {
 } from '@/components/layout';
 import { LanguageProvider } from '@/lib/i18n';
 import { SITE_AUTHOR, SITE_URL } from '@/lib/constants';
+import { JsonLd } from '@/components/seo';
+import { siteGraph } from '@/lib/jsonld';
 
 export const metadata: Metadata = {
   metadataBase: new URL(SITE_URL),
@@ -58,6 +60,13 @@ export default function EnRootLayout({ children }: EnRootLayoutProps) {
   return (
     <html lang="en" data-theme="nyt" data-mode="light" suppressHydrationWarning>
       <head>
+        <link
+          rel="alternate"
+          type="application/atom+xml"
+          title="Algo Mind — Essays"
+          href="/feed.xml"
+        />
+        <JsonLd data={siteGraph('en')} />
         <script
           dangerouslySetInnerHTML={{
             __html: `
diff --git a/apps/blog/app/(en)/opengraph-image.tsx b/apps/blog/app/(en)/opengraph-image.tsx
new file mode 100644
index 0000000..9715a66
--- /dev/null
+++ b/apps/blog/app/(en)/opengraph-image.tsx
@@ -0,0 +1,23 @@
+import { ImageResponse } from 'next/og';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from '@/components/seo/og-card';
+import { ogFontsFor } from '@/lib/og-fonts';
+
+export const dynamic = 'force-static';
+
+export const alt = 'Algo Mind — Essays on AI, Product, Engineering';
+export const size = { width: OG_WIDTH, height: OG_HEIGHT };
+export const contentType = 'image/png';
+
+export default function OgImage() {
+  return new ImageResponse(
+    (
+      <OgCard
+        title="Essays on AI, Product, Engineering"
+        byline="Feitong Yang"
+        brand="Algo Mind"
+        locale="en"
+      />
+    ),
+    { ...size, fonts: ogFontsFor('en') },
+  );
+}
diff --git a/apps/blog/app/(en)/periodics/[slug]/opengraph-image.tsx b/apps/blog/app/(en)/periodics/[slug]/opengraph-image.tsx
new file mode 100644
index 0000000..ad2ff2e
--- /dev/null
+++ b/apps/blog/app/(en)/periodics/[slug]/opengraph-image.tsx
@@ -0,0 +1,45 @@
+import { ImageResponse } from 'next/og';
+import { getPeriodicBySlug, getPeriodicSlugs } from '@/lib/periodics';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from '@/components/seo/og-card';
+import { ogFontsFor } from '@/lib/og-fonts';
+
+export const dynamic = 'force-static';
+
+export const alt = 'Algo Mind periodic';
+export const size = { width: OG_WIDTH, height: OG_HEIGHT };
+export const contentType = 'image/png';
+
+export function generateStaticParams() {
+  return getPeriodicSlugs().map((slug) => ({ slug }));
+}
+
+export default async function OgImage({ params }: { params: { slug: string } }) {
+  const fonts = ogFontsFor('en');
+  const periodic = getPeriodicBySlug(params.slug);
+  if (!periodic || periodic.lang !== 'en') {
+    return new ImageResponse(
+      (
+        <OgCard
+          title="Algo Mind"
+          byline="Feitong Yang"
+          brand="Algo Mind"
+          locale="en"
+        />
+      ),
+      { ...size, fonts },
+    );
+  }
+
+  return new ImageResponse(
+    (
+      <OgCard
+        title={periodic.title}
+        kicker={`Issue ${periodic.issue}`}
+        byline="Feitong Yang"
+        brand="Algo Mind"
+        locale="en"
+      />
+    ),
+    { ...size, fonts },
+  );
+}
diff --git a/apps/blog/app/(en)/periodics/[slug]/page.tsx b/apps/blog/app/(en)/periodics/[slug]/page.tsx
index 8f87cd3..83050f3 100644
--- a/apps/blog/app/(en)/periodics/[slug]/page.tsx
+++ b/apps/blog/app/(en)/periodics/[slug]/page.tsx
@@ -6,6 +6,8 @@ import { getMDXComponents } from '@/components/mdx/MDXComponents';
 import { mdxOptions } from '@/lib/mdx-options';
 import { EssayLayout } from '@/components/essay';
 import { PeriodicHeader } from '@/components/periodic';
+import { JsonLd } from '@/components/seo';
+import { breadcrumbSchema, periodicPostingSchema } from '@/lib/jsonld';
 
 interface PeriodicPageProps {
   params: Promise<{ slug: string }>;
@@ -152,23 +154,34 @@ export default async function PeriodicPage({ params }: PeriodicPageProps) {
 
   const { title, description, date, issue, type, topics, readingTime, content, toc } =
     periodic;
+  const urlPath = `/periodics/${slug}`;
 
   return (
-    <EssayLayout
-      toc={toc}
-      header={
-        <PeriodicHeader
-          issue={issue}
-          type={type}
-          topics={topics}
-          title={title}
-          description={description}
-          date={date}
-          readingTime={readingTime}
-        />
-      }
-    >
-      <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
-    </EssayLayout>
+    <>
+      <JsonLd data={periodicPostingSchema(periodic, urlPath)} />
+      <JsonLd
+        data={breadcrumbSchema([
+          { name: 'Home', url: '/' },
+          { name: 'Periodics', url: '/periodics' },
+          { name: title, url: urlPath },
+        ])}
+      />
+      <EssayLayout
+        toc={toc}
+        header={
+          <PeriodicHeader
+            issue={issue}
+            type={type}
+            topics={topics}
+            title={title}
+            description={description}
+            date={date}
+            readingTime={readingTime}
+          />
+        }
+      >
+        <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
+      </EssayLayout>
+    </>
   );
 }
diff --git a/apps/blog/app/(en)/series/[slug]/opengraph-image.tsx b/apps/blog/app/(en)/series/[slug]/opengraph-image.tsx
new file mode 100644
index 0000000..22336c0
--- /dev/null
+++ b/apps/blog/app/(en)/series/[slug]/opengraph-image.tsx
@@ -0,0 +1,46 @@
+import { ImageResponse } from 'next/og';
+import { getSeriesBySlug, getSeriesSlugs } from '@/lib/series';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from '@/components/seo/og-card';
+import { ogFontsFor } from '@/lib/og-fonts';
+import { SERIES_CATEGORY_LABELS } from '@/lib/constants';
+
+export const dynamic = 'force-static';
+
+export const alt = 'Algo Mind series';
+export const size = { width: OG_WIDTH, height: OG_HEIGHT };
+export const contentType = 'image/png';
+
+export function generateStaticParams() {
+  return getSeriesSlugs().map((slug) => ({ slug }));
+}
+
+export default async function OgImage({ params }: { params: { slug: string } }) {
+  const fonts = ogFontsFor('en');
+  const series = getSeriesBySlug(params.slug);
+  if (!series || series.lang !== 'en') {
+    return new ImageResponse(
+      (
+        <OgCard
+          title="Algo Mind"
+          byline="Feitong Yang"
+          brand="Algo Mind"
+          locale="en"
+        />
+      ),
+      { ...size, fonts },
+    );
+  }
+
+  return new ImageResponse(
+    (
+      <OgCard
+        title={series.title}
+        kicker={SERIES_CATEGORY_LABELS[series.category]}
+        byline="Feitong Yang"
+        brand="Algo Mind"
+        locale="en"
+      />
+    ),
+    { ...size, fonts },
+  );
+}
diff --git a/apps/blog/app/(en)/series/[slug]/page.tsx b/apps/blog/app/(en)/series/[slug]/page.tsx
index 62eb7b6..1e93889 100644
--- a/apps/blog/app/(en)/series/[slug]/page.tsx
+++ b/apps/blog/app/(en)/series/[slug]/page.tsx
@@ -6,6 +6,8 @@ import { getMDXComponents } from '@/components/mdx/MDXComponents';
 import { mdxOptions } from '@/lib/mdx-options';
 import { EssayLayout } from '@/components/essay';
 import { SeriesHeader } from '@/components/series';
+import { JsonLd } from '@/components/seo';
+import { breadcrumbSchema, seriesPageSchema } from '@/lib/jsonld';
 
 interface SeriesPageProps {
   params: Promise<{ slug: string }>;
@@ -150,24 +152,35 @@ export default async function SeriesItemPage({ params }: SeriesPageProps) {
 
   const { title, description, date, updated, category, topics, itemCount, readingTime, content, toc } =
     series;
+  const urlPath = `/series/${slug}`;
 
   return (
-    <EssayLayout
-      toc={toc}
-      header={
-        <SeriesHeader
-          category={category}
-          topics={topics}
-          title={title}
-          description={description}
-          date={date}
-          updated={updated}
-          itemCount={itemCount}
-          readingTime={readingTime}
-        />
-      }
-    >
-      <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
-    </EssayLayout>
+    <>
+      <JsonLd data={seriesPageSchema(series, urlPath)} />
+      <JsonLd
+        data={breadcrumbSchema([
+          { name: 'Home', url: '/' },
+          { name: 'Series', url: '/series' },
+          { name: title, url: urlPath },
+        ])}
+      />
+      <EssayLayout
+        toc={toc}
+        header={
+          <SeriesHeader
+            category={category}
+            topics={topics}
+            title={title}
+            description={description}
+            date={date}
+            updated={updated}
+            itemCount={itemCount}
+            readingTime={readingTime}
+          />
+        }
+      >
+        <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
+      </EssayLayout>
+    </>
   );
 }
diff --git a/apps/blog/app/(zh)/layout.tsx b/apps/blog/app/(zh)/layout.tsx
index 4f6e642..aa950b6 100644
--- a/apps/blog/app/(zh)/layout.tsx
+++ b/apps/blog/app/(zh)/layout.tsx
@@ -11,6 +11,8 @@ import {
 } from '@/components/layout';
 import { LanguageProvider } from '@/lib/i18n';
 import { SITE_AUTHOR, SITE_URL } from '@/lib/constants';
+import { JsonLd } from '@/components/seo';
+import { siteGraph } from '@/lib/jsonld';
 
 export const metadata: Metadata = {
   metadataBase: new URL(SITE_URL),
@@ -57,6 +59,13 @@ export default function ZhRootLayout({ children }: ZhRootLayoutProps) {
   return (
     <html lang="zh" data-theme="nyt" data-mode="light" data-language="zh" suppressHydrationWarning>
       <head>
+        <link
+          rel="alternate"
+          type="application/atom+xml"
+          title="思算 — 随笔"
+          href="/zh/feed.xml"
+        />
+        <JsonLd data={siteGraph('zh')} />
         <script
           dangerouslySetInnerHTML={{
             __html: `
diff --git a/apps/blog/app/(zh)/opengraph-image.tsx b/apps/blog/app/(zh)/opengraph-image.tsx
new file mode 100644
index 0000000..46f003d
--- /dev/null
+++ b/apps/blog/app/(zh)/opengraph-image.tsx
@@ -0,0 +1,23 @@
+import { ImageResponse } from 'next/og';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from '@/components/seo/og-card';
+import { ogFontsFor } from '@/lib/og-fonts';
+
+export const dynamic = 'force-static';
+
+export const alt = '思算 — 关于 AI、产品与工程的随笔';
+export const size = { width: OG_WIDTH, height: OG_HEIGHT };
+export const contentType = 'image/png';
+
+export default function OgImage() {
+  return new ImageResponse(
+    (
+      <OgCard
+        title="关于 AI、产品与工程的随笔"
+        byline="Feitong Yang"
+        brand="思算"
+        locale="zh"
+      />
+    ),
+    { ...size, fonts: ogFontsFor('zh') },
+  );
+}
diff --git a/apps/blog/app/(zh)/zh/essays/[slug]/opengraph-image.tsx b/apps/blog/app/(zh)/zh/essays/[slug]/opengraph-image.tsx
new file mode 100644
index 0000000..e043ec6
--- /dev/null
+++ b/apps/blog/app/(zh)/zh/essays/[slug]/opengraph-image.tsx
@@ -0,0 +1,52 @@
+import { ImageResponse } from 'next/og';
+import { getEssayBySlug, getEssaySlugs } from '@/lib/essays';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from '@/components/seo/og-card';
+import { ogFontsFor } from '@/lib/og-fonts';
+import { TOPIC_LABELS_ZH } from '@/lib/constants';
+
+export const dynamic = 'force-static';
+
+export const alt = '思算文章';
+export const size = { width: OG_WIDTH, height: OG_HEIGHT };
+export const contentType = 'image/png';
+
+export function generateStaticParams() {
+  return getEssaySlugs().map((slug) => ({ slug }));
+}
+
+interface RouteProps {
+  params: { slug: string };
+}
+
+export default async function OgImage({ params }: RouteProps) {
+  const fonts = ogFontsFor('zh');
+  const essay = getEssayBySlug(params.slug);
+  if (!essay || essay.lang !== 'zh') {
+    return new ImageResponse(
+      (
+        <OgCard
+          title="思算"
+          byline="Feitong Yang"
+          brand="思算"
+          locale="zh"
+        />
+      ),
+      { ...size, fonts },
+    );
+  }
+
+  const kicker = essay.topics[0] ? TOPIC_LABELS_ZH[essay.topics[0]] : '随笔';
+
+  return new ImageResponse(
+    (
+      <OgCard
+        title={essay.title}
+        kicker={kicker}
+        byline="Feitong Yang"
+        brand="思算"
+        locale="zh"
+      />
+    ),
+    { ...size, fonts },
+  );
+}
diff --git a/apps/blog/app/(zh)/zh/essays/[slug]/page.tsx b/apps/blog/app/(zh)/zh/essays/[slug]/page.tsx
index 651995d..db794f0 100644
--- a/apps/blog/app/(zh)/zh/essays/[slug]/page.tsx
+++ b/apps/blog/app/(zh)/zh/essays/[slug]/page.tsx
@@ -5,6 +5,8 @@ import { getEssayBySlug, getEssaySlugs, getTranslation } from '@/lib/essays';
 import { getMDXComponents } from '@/components/mdx/MDXComponents';
 import { mdxOptions } from '@/lib/mdx-options';
 import { EssayLayout, EssayHeader } from '@/components/essay';
+import { JsonLd } from '@/components/seo';
+import { breadcrumbSchema, essayPostingSchema } from '@/lib/jsonld';
 
 interface ZhEssayPageProps {
   params: Promise<{ slug: string }>;
@@ -53,6 +55,10 @@ export async function generateMetadata({
     alternates.languages!['x-default'] = `/zh/essays/${slug}`;
   }
 
+  const ogOverride = essay.image
+    ? { openGraph: { images: [essay.image] }, twitter: { images: [essay.image] } }
+    : {};
+
   return {
     title: essay.title,
     description: essay.description,
@@ -63,6 +69,11 @@ export async function generateMetadata({
       publishedTime: essay.date,
       tags: essay.topics,
       locale: 'zh_CN',
+      ...ogOverride.openGraph,
+    },
+    twitter: {
+      card: 'summary_large_image',
+      ...ogOverride.twitter,
     },
     alternates,
   };
@@ -151,23 +162,34 @@ export default async function ZhEssayPage({ params }: ZhEssayPageProps) {
 
   const { title, description, date, type, topics, readingTime, content, toc } =
     essay;
+  const urlPath = `/zh/essays/${slug}`;
 
   return (
-    <EssayLayout
-      toc={toc}
-      header={
-        <EssayHeader
-          type={type}
-          topics={topics}
-          title={title}
-          description={description}
-          date={date}
-          readingTime={readingTime}
-          language="zh"
-        />
-      }
-    >
-      <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
-    </EssayLayout>
+    <>
+      <JsonLd data={essayPostingSchema(essay, urlPath)} />
+      <JsonLd
+        data={breadcrumbSchema([
+          { name: '首页', url: '/zh' },
+          { name: '文章', url: '/zh/essays' },
+          { name: title, url: urlPath },
+        ])}
+      />
+      <EssayLayout
+        toc={toc}
+        header={
+          <EssayHeader
+            type={type}
+            topics={topics}
+            title={title}
+            description={description}
+            date={date}
+            readingTime={readingTime}
+            language="zh"
+          />
+        }
+      >
+        <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
+      </EssayLayout>
+    </>
   );
 }
diff --git a/apps/blog/app/(zh)/zh/feed.xml/route.ts b/apps/blog/app/(zh)/zh/feed.xml/route.ts
new file mode 100644
index 0000000..989ceb5
--- /dev/null
+++ b/apps/blog/app/(zh)/zh/feed.xml/route.ts
@@ -0,0 +1,12 @@
+import { buildAtomFeed } from '@/lib/feed';
+
+export const dynamic = 'force-static';
+
+export function GET() {
+  return new Response(buildAtomFeed('zh'), {
+    headers: {
+      'Content-Type': 'application/atom+xml; charset=utf-8',
+      'Cache-Control': 'public, max-age=3600',
+    },
+  });
+}
diff --git a/apps/blog/app/(zh)/zh/periodics/[slug]/opengraph-image.tsx b/apps/blog/app/(zh)/zh/periodics/[slug]/opengraph-image.tsx
new file mode 100644
index 0000000..5b3a257
--- /dev/null
+++ b/apps/blog/app/(zh)/zh/periodics/[slug]/opengraph-image.tsx
@@ -0,0 +1,45 @@
+import { ImageResponse } from 'next/og';
+import { getPeriodicBySlug, getPeriodicSlugs } from '@/lib/periodics';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from '@/components/seo/og-card';
+import { ogFontsFor } from '@/lib/og-fonts';
+
+export const dynamic = 'force-static';
+
+export const alt = '思算文摘';
+export const size = { width: OG_WIDTH, height: OG_HEIGHT };
+export const contentType = 'image/png';
+
+export function generateStaticParams() {
+  return getPeriodicSlugs().map((slug) => ({ slug }));
+}
+
+export default async function OgImage({ params }: { params: { slug: string } }) {
+  const fonts = ogFontsFor('zh');
+  const periodic = getPeriodicBySlug(params.slug);
+  if (!periodic || periodic.lang !== 'zh') {
+    return new ImageResponse(
+      (
+        <OgCard
+          title="思算"
+          byline="Feitong Yang"
+          brand="思算"
+          locale="zh"
+        />
+      ),
+      { ...size, fonts },
+    );
+  }
+
+  return new ImageResponse(
+    (
+      <OgCard
+        title={periodic.title}
+        kicker={`第 ${periodic.issue} 期`}
+        byline="Feitong Yang"
+        brand="思算"
+        locale="zh"
+      />
+    ),
+    { ...size, fonts },
+  );
+}
diff --git a/apps/blog/app/(zh)/zh/periodics/[slug]/page.tsx b/apps/blog/app/(zh)/zh/periodics/[slug]/page.tsx
index 0914f5b..130dd24 100644
--- a/apps/blog/app/(zh)/zh/periodics/[slug]/page.tsx
+++ b/apps/blog/app/(zh)/zh/periodics/[slug]/page.tsx
@@ -6,6 +6,8 @@ import { getMDXComponents } from '@/components/mdx/MDXComponents';
 import { mdxOptions } from '@/lib/mdx-options';
 import { EssayLayout } from '@/components/essay';
 import { PeriodicHeader } from '@/components/periodic';
+import { JsonLd } from '@/components/seo';
+import { breadcrumbSchema, periodicPostingSchema } from '@/lib/jsonld';
 
 interface PeriodicPageProps {
   params: Promise<{ slug: string }>;
@@ -155,24 +157,35 @@ export default async function ZhPeriodicPage({ params }: PeriodicPageProps) {
 
   const { title, description, date, issue, type, topics, readingTime, content, toc } =
     periodic;
+  const urlPath = `/zh/periodics/${slug}`;
 
   return (
-    <EssayLayout
-      toc={toc}
-      header={
-        <PeriodicHeader
-          issue={issue}
-          type={type}
-          topics={topics}
-          title={title}
-          description={description}
-          date={date}
-          readingTime={readingTime}
-          language="zh"
-        />
-      }
-    >
-      <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
-    </EssayLayout>
+    <>
+      <JsonLd data={periodicPostingSchema(periodic, urlPath)} />
+      <JsonLd
+        data={breadcrumbSchema([
+          { name: '首页', url: '/zh' },
+          { name: '文摘', url: '/zh/periodics' },
+          { name: title, url: urlPath },
+        ])}
+      />
+      <EssayLayout
+        toc={toc}
+        header={
+          <PeriodicHeader
+            issue={issue}
+            type={type}
+            topics={topics}
+            title={title}
+            description={description}
+            date={date}
+            readingTime={readingTime}
+            language="zh"
+          />
+        }
+      >
+        <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
+      </EssayLayout>
+    </>
   );
 }
diff --git a/apps/blog/app/(zh)/zh/series/[slug]/opengraph-image.tsx b/apps/blog/app/(zh)/zh/series/[slug]/opengraph-image.tsx
new file mode 100644
index 0000000..559e9c4
--- /dev/null
+++ b/apps/blog/app/(zh)/zh/series/[slug]/opengraph-image.tsx
@@ -0,0 +1,46 @@
+import { ImageResponse } from 'next/og';
+import { getSeriesBySlug, getSeriesSlugs } from '@/lib/series';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from '@/components/seo/og-card';
+import { ogFontsFor } from '@/lib/og-fonts';
+import { SERIES_CATEGORY_LABELS_ZH } from '@/lib/constants';
+
+export const dynamic = 'force-static';
+
+export const alt = '思算系列';
+export const size = { width: OG_WIDTH, height: OG_HEIGHT };
+export const contentType = 'image/png';
+
+export function generateStaticParams() {
+  return getSeriesSlugs().map((slug) => ({ slug }));
+}
+
+export default async function OgImage({ params }: { params: { slug: string } }) {
+  const fonts = ogFontsFor('zh');
+  const series = getSeriesBySlug(params.slug);
+  if (!series || series.lang !== 'zh') {
+    return new ImageResponse(
+      (
+        <OgCard
+          title="思算"
+          byline="Feitong Yang"
+          brand="思算"
+          locale="zh"
+        />
+      ),
+      { ...size, fonts },
+    );
+  }
+
+  return new ImageResponse(
+    (
+      <OgCard
+        title={series.title}
+        kicker={SERIES_CATEGORY_LABELS_ZH[series.category]}
+        byline="Feitong Yang"
+        brand="思算"
+        locale="zh"
+      />
+    ),
+    { ...size, fonts },
+  );
+}
diff --git a/apps/blog/app/(zh)/zh/series/[slug]/page.tsx b/apps/blog/app/(zh)/zh/series/[slug]/page.tsx
index 7442c3a..6d885d1 100644
--- a/apps/blog/app/(zh)/zh/series/[slug]/page.tsx
+++ b/apps/blog/app/(zh)/zh/series/[slug]/page.tsx
@@ -6,6 +6,8 @@ import { getMDXComponents } from '@/components/mdx/MDXComponents';
 import { mdxOptions } from '@/lib/mdx-options';
 import { EssayLayout } from '@/components/essay';
 import { SeriesHeader } from '@/components/series';
+import { JsonLd } from '@/components/seo';
+import { breadcrumbSchema, seriesPageSchema } from '@/lib/jsonld';
 
 interface SeriesPageProps {
   params: Promise<{ slug: string }>;
@@ -153,25 +155,36 @@ export default async function ZhSeriesItemPage({ params }: SeriesPageProps) {
 
   const { title, description, date, updated, category, topics, itemCount, readingTime, content, toc } =
     series;
+  const urlPath = `/zh/series/${slug}`;
 
   return (
-    <EssayLayout
-      toc={toc}
-      header={
-        <SeriesHeader
-          category={category}
-          topics={topics}
-          title={title}
-          description={description}
-          date={date}
-          updated={updated}
-          itemCount={itemCount}
-          readingTime={readingTime}
-          language="zh"
-        />
-      }
-    >
-      <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
-    </EssayLayout>
+    <>
+      <JsonLd data={seriesPageSchema(series, urlPath)} />
+      <JsonLd
+        data={breadcrumbSchema([
+          { name: '首页', url: '/zh' },
+          { name: '系列', url: '/zh/series' },
+          { name: title, url: urlPath },
+        ])}
+      />
+      <EssayLayout
+        toc={toc}
+        header={
+          <SeriesHeader
+            category={category}
+            topics={topics}
+            title={title}
+            description={description}
+            date={date}
+            updated={updated}
+            itemCount={itemCount}
+            readingTime={readingTime}
+            language="zh"
+          />
+        }
+      >
+        <MDXRemote source={content} components={getMDXComponents()} options={{ mdxOptions }} />
+      </EssayLayout>
+    </>
   );
 }
diff --git a/apps/blog/app/feed.xml/route.ts b/apps/blog/app/feed.xml/route.ts
new file mode 100644
index 0000000..fe48f40
--- /dev/null
+++ b/apps/blog/app/feed.xml/route.ts
@@ -0,0 +1,12 @@
+import { buildAtomFeed } from '@/lib/feed';
+
+export const dynamic = 'force-static';
+
+export function GET() {
+  return new Response(buildAtomFeed('en'), {
+    headers: {
+      'Content-Type': 'application/atom+xml; charset=utf-8',
+      'Cache-Control': 'public, max-age=3600',
+    },
+  });
+}
diff --git a/apps/blog/components/seo/JsonLd.tsx b/apps/blog/components/seo/JsonLd.tsx
new file mode 100644
index 0000000..bfdaaad
--- /dev/null
+++ b/apps/blog/components/seo/JsonLd.tsx
@@ -0,0 +1,23 @@
+import { serializeJsonLd } from '@/lib/jsonld';
+
+interface JsonLdProps {
+  data: unknown;
+}
+
+/**
+ * Server-rendered <script type="application/ld+json"> tag.
+ *
+ * Use one component per schema graph. Embedding multiple top-level
+ * schemas inside a single script is also valid, but separating them
+ * keeps individual schemas debuggable in tools like the Rich Results
+ * Test.
+ */
+export function JsonLd({ data }: JsonLdProps) {
+  return (
+    <script
+      type="application/ld+json"
+      // eslint-disable-next-line react/no-danger
+      dangerouslySetInnerHTML={{ __html: serializeJsonLd(data) }}
+    />
+  );
+}
diff --git a/apps/blog/components/seo/OgCard.stories.tsx b/apps/blog/components/seo/OgCard.stories.tsx
new file mode 100644
index 0000000..527274f
--- /dev/null
+++ b/apps/blog/components/seo/OgCard.stories.tsx
@@ -0,0 +1,202 @@
+import type { Meta, StoryObj } from '@storybook/react';
+// Loads @font-face declarations into the Storybook iframe so the OG card
+// renders with the same typefaces Satori uses at build time. The browser
+// rendering is not pixel-identical to Satori, but it's close enough for
+// composition and typography iteration.
+import '@fontsource/source-serif-pro/400.css';
+import '@fontsource/source-serif-pro/400-italic.css';
+import '@fontsource/source-serif-pro/700.css';
+import '@fontsource/noto-serif-sc/400.css';
+import '@fontsource/noto-serif-sc/700.css';
+import { OgCard, OG_WIDTH, OG_HEIGHT } from './og-card';
+
+/**
+ * Wraps the 1200×630 card in a scaled, scrollable frame so it fits the
+ * Storybook viewport while preserving the true pixel dimensions of the
+ * render.
+ */
+function ScaledFrame({ children, scale }: { children: React.ReactNode; scale: number }) {
+  return (
+    <div
+      style={{
+        width: OG_WIDTH * scale,
+        height: OG_HEIGHT * scale,
+        overflow: 'hidden',
+        border: '1px dashed #cccccc',
+        background: '#ffffff',
+      }}
+    >
+      <div
+        style={{
+          width: OG_WIDTH,
+          height: OG_HEIGHT,
+          transform: `scale(${scale})`,
+          transformOrigin: 'top left',
+        }}
+      >
+        {children}
+      </div>
+    </div>
+  );
+}
+
+const meta = {
+  title: 'SEO/OgCard',
+  component: OgCard,
+  parameters: {
+    layout: 'padded',
+    docs: {
+      description: {
+        component:
+          'Open Graph social-share card. Editorial composition inspired by The New Yorker, palette pulled from the NYT light theme tokens — `bg.primary` (white) surface, `text.primary` (gray-900) ink, `border.default` (gray-200) hairlines, `accent.primary` (nyt-blue `#326891`) brand mark. Source Serif Pro (EN) or Noto Serif SC (ZH). Rendered at 1200×630 by Satori at build time. This story shows the JSX in the browser at scaled sizes; the live PNG output may differ slightly in font rendering.',
+      },
+    },
+  },
+  argTypes: {
+    title: { control: 'text' },
+    kicker: { control: 'text' },
+    byline: { control: 'text' },
+    brand: { control: 'text' },
+    locale: { control: { type: 'radio' }, options: ['en', 'zh'] },
+  },
+  render: (args) => (
+    <ScaledFrame scale={0.6}>
+      <OgCard {...args} />
+    </ScaledFrame>
+  ),
+} satisfies Meta<typeof OgCard>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+// ─── EN ─────────────────────────────────────────────────────────────────────
+
+export const EnglishEssay: Story = {
+  args: {
+    title: 'The Era of Decision Games',
+    kicker: 'Technical',
+    byline: 'Feitong Yang',
+    brand: 'Algo Mind',
+    locale: 'en',
+  },
+};
+
+export const EnglishEssayLongTitle: Story = {
+  args: {
+    title: 'How AI Will Take Your Tasks But Not Your Job — and What Comes After',
+    kicker: 'AI',
+    byline: 'Feitong Yang',
+    brand: 'Algo Mind',
+    locale: 'en',
+  },
+};
+
+export const EnglishPeriodic: Story = {
+  args: {
+    title: 'Reading Digest, Mid-May 2026',
+    kicker: 'Issue 14',
+    byline: 'Feitong Yang',
+    brand: 'Algo Mind',
+    locale: 'en',
+  },
+};
+
+export const EnglishSeries: Story = {
+  args: {
+    title: 'One Hundred Economics Papers',
+    kicker: 'Reading List',
+    byline: 'Feitong Yang',
+    brand: 'Algo Mind',
+    locale: 'en',
+  },
+};
+
+export const EnglishHome: Story = {
+  args: {
+    title: 'Essays on AI, Product, Engineering',
+    byline: 'Feitong Yang',
+    brand: 'Algo Mind',
+    locale: 'en',
+  },
+};
+
+// ─── ZH ─────────────────────────────────────────────────────────────────────
+
+export const ChineseEssay: Story = {
+  args: {
+    title: '决策博弈的时代',
+    kicker: '技术',
+    byline: 'Feitong Yang',
+    brand: '思算',
+    locale: 'zh',
+  },
+};
+
+export const ChineseEssayLongTitle: Story = {
+  args: {
+    title: '从零基础到写完 10,000 行 C++ 代码',
+    kicker: '技术',
+    byline: 'Feitong Yang',
+    brand: '思算',
+    locale: 'zh',
+  },
+};
+
+export const ChinesePeriodic: Story = {
+  args: {
+    title: '5月文摘',
+    kicker: '第 14 期',
+    byline: 'Feitong Yang',
+    brand: '思算',
+    locale: 'zh',
+  },
+};
+
+export const ChineseHome: Story = {
+  args: {
+    title: '关于 AI、产品与工程的随笔',
+    byline: 'Feitong Yang',
+    brand: '思算',
+    locale: 'zh',
+  },
+};
+
+// ─── Side-by-side ───────────────────────────────────────────────────────────
+
+export const SideBySide: Story = {
+  args: EnglishEssay.args,
+  render: () => (
+    <div style={{ display: 'flex', flexDirection: 'column', gap: 24 }}>
+      <ScaledFrame scale={0.5}>
+        <OgCard
+          title="The Era of Decision Games"
+          kicker="Technical"
+          byline="Feitong Yang"
+          brand="Algo Mind"
+          locale="en"
+        />
+      </ScaledFrame>
+      <ScaledFrame scale={0.5}>
+        <OgCard
+          title="决策博弈的时代"
+          kicker="技术"
+          byline="Feitong Yang"
+          brand="思算"
+          locale="zh"
+        />
+      </ScaledFrame>
+    </div>
+  ),
+};
+
+// ─── Pixel-accurate ─────────────────────────────────────────────────────────
+// The PNG that Satori generates is what social platforms render. This
+// variant renders the card at true 1200×630 px — what scrapers see.
+export const PixelAccurate: Story = {
+  args: EnglishEssay.args,
+  render: (args) => (
+    <ScaledFrame scale={1}>
+      <OgCard {...args} />
+    </ScaledFrame>
+  ),
+};
diff --git a/apps/blog/components/seo/index.ts b/apps/blog/components/seo/index.ts
new file mode 100644
index 0000000..3c9256a
--- /dev/null
+++ b/apps/blog/components/seo/index.ts
@@ -0,0 +1 @@
+export { JsonLd } from './JsonLd';
diff --git a/apps/blog/components/seo/og-card.tsx b/apps/blog/components/seo/og-card.tsx
new file mode 100644
index 0000000..3744694
--- /dev/null
+++ b/apps/blog/components/seo/og-card.tsx
@@ -0,0 +1,173 @@
+/**
+ * Open Graph card — editorial composition.
+ *
+ * Visual lineage: The New Yorker social cards adapted to Algo Mind's
+ * brand tokens. Every color in COLORS below maps to a real token in
+ * packages/tokens/src/themes/nyt/light.json — no eyeballed values.
+ * Composition is restrained, with a dominant serif title and hairline
+ * rules in the site's neutral border color.
+ *
+ * Rendered by Satori (via next/og ImageResponse) into a 1200×630 PNG
+ * at build time. Satori supports a subset of CSS: flexbox, basic
+ * typography, solid colors, gradients, borders. All styles are inline.
+ */
+
+export const OG_WIDTH = 1200;
+export const OG_HEIGHT = 630;
+
+export interface OgCardProps {
+  title: string;
+  /** Eyebrow text — topic, issue, category. Rendered small-caps. */
+  kicker?: string;
+  /** Byline rendered below the title. Italic in EN, regular in ZH. */
+  byline: string;
+  /** Brand wordmark rendered top-left. */
+  brand: string;
+  /** Locale tunes typography: italic in EN, no italics in ZH. */
+  locale: 'en' | 'zh';
+}
+
+/**
+ * Palette sampled from packages/tokens/src/themes/nyt/light.json.
+ * Each value here maps to a real token, not an eyeballed color.
+ */
+const COLORS = {
+  /** color.bg.primary → primitive.color.white */
+  surface: '#ffffff',
+  /** color.text.primary → primitive.color.gray.900 */
+  ink: '#18181b',
+  /** color.text.muted → primitive.color.gray.500 */
+  muted: '#71717a',
+  /** color.accent.primary → primitive.color.nyt-blue.DEFAULT */
+  accent: '#326891',
+  /** color.border.default → primitive.color.gray.200 */
+  rule: '#e4e4e7',
+} as const;
+
+const SERIF_LATIN = '"Source Serif Pro", serif';
+const SERIF_CJK = '"Noto Serif SC", "Source Serif Pro", serif';
+
+const PAD_X = 88;
+const INNER_WIDTH = OG_WIDTH - PAD_X * 2;
+
+export function OgCard({ title, kicker, byline, brand, locale }: OgCardProps) {
+  const fontFamily = locale === 'zh' ? SERIF_CJK : SERIF_LATIN;
+
+  // Title scales by length so it always fits ~3 visual lines.
+  const len = title.length;
+  const titleSize = len > 80 ? 64 : len > 50 ? 76 : 92;
+
+  return (
+    <div
+      style={{
+        width: OG_WIDTH,
+        height: OG_HEIGHT,
+        display: 'flex',
+        flexDirection: 'column',
+        background: COLORS.surface,
+        color: COLORS.ink,
+        padding: `72px ${PAD_X}px`,
+        fontFamily,
+      }}
+    >
+      {/* Top: masthead + kicker. Bottom border of this row is the hairline. */}
+      <div
+        style={{
+          display: 'flex',
+          width: INNER_WIDTH,
+          alignItems: 'center',
+          gap: 18,
+          paddingBottom: 22,
+          borderBottom: `1px solid ${COLORS.rule}`,
+        }}
+      >
+        <span
+          style={{
+            fontFamily,
+            fontWeight: 700,
+            fontSize: 22,
+            letterSpacing: locale === 'zh' ? 4 : 6,
+            textTransform: locale === 'zh' ? 'none' : 'uppercase',
+            color: COLORS.accent,
+          }}
+        >
+          {brand}
+        </span>
+        {kicker ? (
+          <span
+            style={{
+              fontFamily,
+              fontSize: 20,
+              letterSpacing: locale === 'zh' ? 3 : 4,
+              textTransform: locale === 'zh' ? 'none' : 'uppercase',
+              color: COLORS.muted,
+              borderLeft: `1px solid ${COLORS.rule}`,
+              paddingLeft: 18,
+            }}
+          >
+            {kicker}
+          </span>
+        ) : null}
+      </div>
+
+      {/* Middle: dominant serif title, centered vertically. */}
+      <div
+        style={{
+          flex: 1,
+          display: 'flex',
+          alignItems: 'center',
+          width: INNER_WIDTH,
+        }}
+      >
+        <div
+          style={{
+            display: 'flex',
+            fontFamily,
+            fontWeight: 700,
+            fontSize: titleSize,
+            lineHeight: 1.08,
+            letterSpacing: locale === 'zh' ? 0 : -1,
+            color: COLORS.ink,
+            maxWidth: INNER_WIDTH,
+          }}
+        >
+          {title}
+        </div>
+      </div>
+
+      {/* Bottom: italic byline, domain footer. Top border is the hairline. */}
+      <div
+        style={{
+          display: 'flex',
+          width: INNER_WIDTH,
+          alignItems: 'center',
+          justifyContent: 'space-between',
+          paddingTop: 22,
+          borderTop: `1px solid ${COLORS.rule}`,
+        }}
+      >
+        <span
+          style={{
+            fontFamily,
+            fontStyle: locale === 'zh' ? 'normal' : 'italic',
+            fontSize: 28,
+            color: COLORS.ink,
+          }}
+        >
+          {locale === 'zh' ? byline : `by ${byline}`}
+        </span>
+        <span
+          style={{
+            fontFamily,
+            fontSize: 18,
+            letterSpacing: 3,
+            textTransform: 'uppercase',
+            color: COLORS.muted,
+          }}
+        >
+          www.feitong.phd
+        </span>
+      </div>
+    </div>
+  );
+}
diff --git a/apps/blog/lib/feed.ts b/apps/blog/lib/feed.ts
new file mode 100644
index 0000000..55bae01
--- /dev/null
+++ b/apps/blog/lib/feed.ts
@@ -0,0 +1,102 @@
+/**
+ * Atom feed builder.
+ *
+ * Atom is preferred over RSS 2.0 here for its stricter schema, native
+ * `updated` semantics, and explicit `<author>` and `<id>` requirements
+ * — all useful for AI engines that consume feeds.
+ */
+
+import { SITE_URL, SITE_AUTHOR } from './constants';
+import { getAllEssays } from './essays';
+import { getAllPeriodics } from './periodics';
+import type { Language } from '@/types/content';
+
+interface FeedEntry {
+  title: string;
+  description?: string;
+  url: string;
+  date: string;
+  updated?: string;
+}
+
+function escapeXml(value: string): string {
+  return value
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&apos;');
+}
+
+function isoDate(value: string): string {
+  return new Date(value).toISOString();
+}
+
+function entriesFor(locale: Language): FeedEntry[] {
+  const essays = getAllEssays({ language: locale }).map((essay) => ({
+    title: essay.title,
+    description: essay.description,
+    url: locale === 'zh' ? `/zh/essays/${essay.slug}` : `/essays/${essay.slug}`,
+    date: essay.date,
+  }));
+  const periodics = getAllPeriodics({ language: locale }).map((periodic) => ({
+    title: periodic.title,
+    description: periodic.description,
+    url:
+      locale === 'zh'
+        ? `/zh/periodics/${periodic.slug}`
+        : `/periodics/${periodic.slug}`,
+    date: periodic.date,
+  }));
+  return [...essays, ...periodics]
+    .sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime())
+    .slice(0, 20);
+}
+
+export function buildAtomFeed(locale: Language): string {
+  const feedPath = locale === 'zh' ? '/zh/feed.xml' : '/feed.xml';
+  const homePath = locale === 'zh' ? '/zh' : '/';
+  const feedUrl = `${SITE_URL}${feedPath}`;
+  const homeUrl = `${SITE_URL}${homePath}`;
+  const title = locale === 'zh' ? '思算 — 随笔' : 'Algo Mind — Essays';
+  const subtitle =
+    locale === 'zh'
+      ? '思算 — Feitong Yang 关于 AI、软件工程、产品思考与职业的随笔。'
+      : 'Essays by Feitong Yang on AI, software engineering, product thinking, and career.';
+
+  const entries = entriesFor(locale);
+  const updated = entries[0]?.date
+    ? isoDate(entries[0].date)
+    : new Date().toISOString();
+
+  const entryXml = entries
+    .map((entry) => {
+      const entryUrl = `${SITE_URL}${entry.url}`;
+      return `  <entry>
+    <id>${entryUrl}</id>
+    <title>${escapeXml(entry.title)}</title>
+    <link rel="alternate" href="${entryUrl}"/>
+    <published>${isoDate(entry.date)}</published>
+    <updated>${isoDate(entry.updated ?? entry.date)}</updated>${
+      entry.description
+        ? `\n    <summary>${escapeXml(entry.description)}</summary>`
+        : ''
+    }
+    <author><name>${escapeXml(SITE_AUTHOR.name)}</name></author>
+  </entry>`;
+    })
+    .join('\n');
+
+  return `<?xml version="1.0" encoding="UTF-8"?>
+<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="${locale === 'zh' ? 'zh-CN' : 'en-US'}">
+  <id>${feedUrl}</id>
+  <title>${escapeXml(title)}</title>
+  <subtitle>${escapeXml(subtitle)}</subtitle>
+  <link rel="self" href="${feedUrl}"/>
+  <link rel="alternate" href="${homeUrl}"/>
+  <updated>${updated}</updated>
+  <author><name>${escapeXml(SITE_AUTHOR.name)}</name></author>
+${entryXml}
+</feed>
+`;
+}
diff --git a/apps/blog/lib/jsonld.ts b/apps/blog/lib/jsonld.ts
new file mode 100644
index 0000000..f56ddbc
--- /dev/null
+++ b/apps/blog/lib/jsonld.ts
@@ -0,0 +1,179 @@
+/**
+ * Schema.org JSON-LD helpers.
+ *
+ * Output is consumed by Google's Rich Results Test, AI answer engines
+ * (Perplexity, AI Overviews, ChatGPT Search), and search-engine knowledge
+ * graphs. The shapes here intentionally stay close to schema.org defaults
+ * so future fields can be added without rewriting consumers.
+ */
+
+import { SITE_URL, SITE_AUTHOR } from './constants';
+import type { EssayMeta, PeriodicMeta, SeriesMeta, Language } from '@/types/content';
+
+type Locale = Language;
+
+const PERSON_ID = `${SITE_URL}/#person`;
+const PUBLISHER_ID = `${SITE_URL}/#publisher`;
+const WEBSITE_ID_EN = `${SITE_URL}/#website`;
+const WEBSITE_ID_ZH = `${SITE_URL}/zh/#website`;
+
+const SAME_AS = [
+  'https://www.linkedin.com/in/feitong-yang-88088a55/',
+  'http://scholar.google.com/citations?user=94Xx9u0AAAAJ',
+  'http://neurotree.org/neurotree/tree.php?pid=65050',
+];
+
+function abs(path: string): string {
+  if (path.startsWith('http')) return path;
+  return `${SITE_URL}${path.startsWith('/') ? path : `/${path}`}`;
+}
+
+export function personSchema() {
+  return {
+    '@type': 'Person',
+    '@id': PERSON_ID,
+    name: SITE_AUTHOR.name,
+    url: SITE_AUTHOR.url,
+    jobTitle: 'Founding Engineer',
+    worksFor: {
+      '@type': 'Organization',
+      name: 'Fundamental Research Labs',
+      url: 'https://fairies.ai/',
+    },
+    alumniOf: [
+      { '@type': 'CollegeOrUniversity', name: 'Johns Hopkins University' },
+    ],
+    sameAs: SAME_AS,
+  };
+}
+
+export function publisherSchema(locale: Locale) {
+  return {
+    '@type': 'Organization',
+    '@id': PUBLISHER_ID,
+    name: locale === 'zh' ? '思算' : 'Algo Mind',
+    url: SITE_URL,
+    founder: { '@id': PERSON_ID },
+  };
+}
+
+export function websiteSchema(locale: Locale) {
+  const id = locale === 'zh' ? WEBSITE_ID_ZH : WEBSITE_ID_EN;
+  const url = locale === 'zh' ? `${SITE_URL}/zh` : SITE_URL;
+  return {
+    '@type': 'WebSite',
+    '@id': id,
+    url,
+    name: locale === 'zh' ? '思算' : 'Algo Mind',
+    inLanguage: locale === 'zh' ? 'zh-CN' : 'en-US',
+    publisher: { '@id': PUBLISHER_ID },
+    author: { '@id': PERSON_ID },
+  };
+}
+
+/**
+ * `@graph` envelope. Lets us emit several connected nodes in one script
+ * block with `@id` references between them — the schema.org idiom for
+ * "these things are the same entity across multiple types".
+ */
+export function siteGraph(locale: Locale) {
+  return {
+    '@context': 'https://schema.org',
+    '@graph': [personSchema(), publisherSchema(locale), websiteSchema(locale)],
+  };
+}
+
+interface BlogPostingArgs {
+  title: string;
+  description?: string;
+  url: string;
+  datePublished: string;
+  dateModified?: string;
+  topics?: string[];
+  image?: string;
+  locale: Locale;
+}
+
+export function blogPostingSchema(args: BlogPostingArgs) {
+  return {
+    '@context': 'https://schema.org',
+    '@type': 'BlogPosting',
+    headline: args.title,
+    description: args.description || undefined,
+    url: abs(args.url),
+    datePublished: args.datePublished,
+    dateModified: args.dateModified || args.datePublished,
+    inLanguage: args.locale === 'zh' ? 'zh-CN' : 'en-US',
+    author: { '@id': PERSON_ID },
+    publisher: { '@id': PUBLISHER_ID },
+    mainEntityOfPage: { '@type': 'WebPage', '@id': abs(args.url) },
+    image: args.image ? abs(args.image) : undefined,
+    keywords: args.topics?.join(', ') || undefined,
+  };
+}
+
+export function essayPostingSchema(essay: EssayMeta, urlPath: string) {
+  return blogPostingSchema({
+    title: essay.title,
+    description: essay.description,
+    url: urlPath,
+    datePublished: essay.date,
+    topics: essay.topics as string[],
+    locale: essay.lang,
+  });
+}
+
+export function periodicPostingSchema(periodic: PeriodicMeta, urlPath: string) {
+  return blogPostingSchema({
+    title: periodic.title,
+    description:
+      periodic.description ||
+      (periodic.lang === 'zh'
+        ? `${periodic.title} - 第${periodic.issue}期`
+        : `${periodic.title} - Issue #${periodic.issue}`),
+    url: urlPath,
+    datePublished: periodic.date,
+    topics: periodic.topics as string[],
+    locale: periodic.lang,
+  });
+}
+
+export function seriesPageSchema(series: SeriesMeta, urlPath: string) {
+  return {
+    '@context': 'https://schema.org',
+    '@type': 'CollectionPage',
+    name: series.title,
+    description: series.description || undefined,
+    url: abs(urlPath),
+    datePublished: series.date,
+    dateModified: series.updated || series.date,
+    inLanguage: series.lang === 'zh' ? 'zh-CN' : 'en-US',
+    author: { '@id': PERSON_ID },
+    publisher: { '@id': PUBLISHER_ID },
+    mainEntityOfPage: { '@type': 'WebPage', '@id': abs(urlPath) },
+    keywords: series.topics.join(', ') || undefined,
+  };
+}
+
+export interface BreadcrumbItem {
+  name: string;
+  url: string;
+}
+
+export function breadcrumbSchema(items: BreadcrumbItem[]) {
+  return {
+    '@context': 'https://schema.org',
+    '@type': 'BreadcrumbList',
+    itemListElement: items.map((item, i) => ({
+      '@type': 'ListItem',
+      position: i + 1,
+      name: item.name,
+      item: abs(item.url),
+    })),
+  };
+}
+
+/** Serialize for embedding inside a `<script type="application/ld+json">`. */
+export function serializeJsonLd(value: unknown): string {
+  return JSON.stringify(value).replace(/</g, '\\u003c');
+}
diff --git a/apps/blog/lib/og-fonts.ts b/apps/blog/lib/og-fonts.ts
new file mode 100644
index 0000000..9e1121e
--- /dev/null
+++ b/apps/blog/lib/og-fonts.ts
@@ -0,0 +1,74 @@
+/**
+ * Font loading for next/og's ImageResponse.
+ *
+ * Reads font binaries from node_modules at build time and returns the
+ * shape Satori expects. Only invoked during static export's render of
+ * the opengraph-image routes — these files never ship to the browser.
+ */
+
+import fs from 'node:fs';
+import path from 'node:path';
+
+const FONT_ROOT = path.join(
+  process.cwd(),
+  'node_modules/@fontsource',
+);
+
+type OgFont = {
+  name: string;
+  data: Buffer;
+  weight: 400 | 700;
+  style: 'normal' | 'italic';
+};
+
+function load(filePath: string): Buffer {
+  return fs.readFileSync(filePath);
+}
+
+/** Latin serif: Source Serif Pro 400 / 400-italic / 700. */
+export function latinFonts(): OgFont[] {
+  const dir = path.join(FONT_ROOT, 'source-serif-pro/files');
+  return [
+    {
+      name: 'Source Serif Pro',
+      data: load(path.join(dir, 'source-serif-pro-latin-400-normal.woff')),
+      weight: 400,
+      style: 'normal',
+    },
+    {
+      name: 'Source Serif Pro',
+      data: load(path.join(dir, 'source-serif-pro-latin-400-italic.woff')),
+      weight: 400,
+      style: 'italic',
+    },
+    {
+      name: 'Source Serif Pro',
+      data: load(path.join(dir, 'source-serif-pro-latin-700-normal.woff')),
+      weight: 700,
+      style: 'normal',
+    },
+  ];
+}
+
+/** Simplified Chinese serif: Noto Serif SC 400 / 700. ~4 MB build-time. */
+export function cjkFonts(): OgFont[] {
+  const dir = path.join(FONT_ROOT, 'noto-serif-sc/files');
+  return [
+    {
+      name: 'Noto Serif SC',
+      data: load(path.join(dir, 'noto-serif-sc-chinese-simplified-400-normal.woff')),
+      weight: 400,
+      style: 'normal',
+    },
+    {
+      name: 'Noto Serif SC',
+      data: load(path.join(dir, 'noto-serif-sc-chinese-simplified-700-normal.woff')),
+      weight: 700,
+      style: 'normal',
+    },
+  ];
+}
+
+export function ogFontsFor(locale: 'en' | 'zh'): OgFont[] {
+  return locale === 'zh' ? [...latinFonts(), ...cjkFonts()] : latinFonts();
+}
diff --git a/apps/blog/package.json b/apps/blog/package.json
index 4559296..c3f5a56 100644
--- a/apps/blog/package.json
+++ b/apps/blog/package.json
@@ -4,7 +4,8 @@
   "private": true,
   "scripts": {
     "dev": "next dev",
-    "build": "next build",
+    "build": "next build && node scripts/postbuild-og.mjs",
+    "build:next": "next build",
     "start": "next start",
     "lint": "next lint",
     "test": "vitest",
@@ -31,6 +32,8 @@
   },
   "devDependencies": {
     "@blog/config": "workspace:*",
+    "@fontsource/noto-serif-sc": "^5.2.9",
+    "@fontsource/source-serif-pro": "^5.2.5",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^14.0.0",
     "@types/node": "^20.0.0",
diff --git a/apps/blog/scripts/postbuild-og.mjs b/apps/blog/scripts/postbuild-og.mjs
new file mode 100644
index 0000000..de8a644
--- /dev/null
+++ b/apps/blog/scripts/postbuild-og.mjs
@@ -0,0 +1,95 @@
+#!/usr/bin/env node
+/**
+ * Post-build: append `.png` to Next.js opengraph-image files.
+ *
+ * Next 14's `opengraph-image.tsx` file convention emits PNGs without a
+ * `.png` extension. The Next dev/preview server adds the right
+ * Content-Type from a route manifest, but with `output: 'export'` we
+ * ship raw files to a generic static host (GitHub Pages). Those hosts
+ * type files by extension and serve unknown ones as
+ * `application/octet-stream`, which Facebook/Twitter/LinkedIn scrapers
+ * reject.
+ *
+ * This script renames each `opengraph-image-<hash>` to
+ * `opengraph-image-<hash>.png` and rewrites the references in the
+ * sibling HTML files so meta tags still point at the right URL.
+ */
+
+import fs from 'node:fs/promises';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const OUT_DIR = path.resolve(__dirname, '..', 'out');
+
+const FILENAME_RE = /^opengraph-image-[A-Za-z0-9]+$/;
+
+async function* walk(dir) {
+  const entries = await fs.readdir(dir, { withFileTypes: true });
+  for (const entry of entries) {
+    const full = path.join(dir, entry.name);
+    if (entry.isDirectory()) {
+      yield* walk(full);
+    } else if (entry.isFile()) {
+      yield full;
+    }
+  }
+}
+
+async function main() {
+  const renames = new Map(); // oldBasename → newBasename
+  const renamedPaths = [];
+
+  for await (const file of walk(OUT_DIR)) {
+    const base = path.basename(file);
+    if (FILENAME_RE.test(base)) {
+      const next = `${base}.png`;
+      const target = path.join(path.dirname(file), next);
+      await fs.rename(file, target);
+      renames.set(base, next);
+      renamedPaths.push(target);
+    }
+  }
+
+  if (renames.size === 0) {
+    console.log('postbuild-og: no opengraph-image files found, skipping');
+    return;
+  }
+
+  console.log(`postbuild-og: renamed ${renames.size} OG images, rewriting refs`);
+
+  // Rewrite references in HTML and text-based files. We don't touch
+  // binary files (PNG, JPG, etc.) and we cap rewrites to extensions
+  // where references could plausibly live.
+  const REWRITABLE_EXT = new Set(['.html', '.txt', '.xml', '.json']);
+
+  for await (const file of walk(OUT_DIR)) {
+    const ext = path.extname(file).toLowerCase();
+    if (!REWRITABLE_EXT.has(ext)) continue;
+
+    let content = await fs.readFile(file, 'utf-8');
+    let changed = false;
+    for (const [oldName, newName] of renames) {
+      if (content.includes(oldName)) {
+        // Replace bare references — but not ones already followed by ".png"
+        // (which would create a double extension on re-runs).
+        const re = new RegExp(`${oldName}(?!\\.png)`, 'g');
+        const updated = content.replace(re, newName);
+        if (updated !== content) {
+          content = updated;
+          changed = true;
+        }
+      }
+    }
+    if (changed) {
+      await fs.writeFile(file, content, 'utf-8');
+    }
+  }
+
+  console.log('postbuild-og: done');
+}
+
+main().catch((err) => {
+  console.error('postbuild-og failed:', err);
+  process.exit(1);
+});
diff --git a/apps/blog/types/content.ts b/apps/blog/types/content.ts
index f46599e..e2fee35 100644
--- a/apps/blog/types/content.ts
+++ b/apps/blog/types/content.ts
@@ -81,6 +81,8 @@ export interface EssayMeta {
   readingTime?: number;
   /** Slug of the translation (links to translated version) */
   translationOf?: string;
+  /** Optional path or URL to an image to use as the social/OG card */
+  image?: string;
 }
 
 /**
@@ -135,6 +137,8 @@ export interface PeriodicMeta {
   readingTime?: number;
   /** Slug of the translation (links to translated version) */
   translationOf?: string;
+  /** Optional path or URL to an image to use as the social/OG card */
+  image?: string;
 }
 
 /**
@@ -168,6 +172,7 @@ export interface PeriodicFrontmatter {
   lang: Language;
   draft?: boolean;
   translationOf?: string;
+  image?: string;
 }
 
 // ============================================================================
@@ -202,6 +207,8 @@ export interface SeriesMeta {
   readingTime?: number;
   /** Slug of the translation (links to translated version) */
   translationOf?: string;
+  /** Optional path or URL to an image to use as the social/OG card */
+  image?: string;
 }
 
 /**
@@ -236,6 +243,7 @@ export interface SeriesFrontmatter {
   draft?: boolean;
   itemCount?: number;
   translationOf?: string;
+  image?: string;
 }
 
 /**
@@ -267,6 +275,7 @@ export interface Frontmatter {
   lang: Language;
   draft?: boolean;
   translationOf?: string;
+  image?: string;
 }
 
 /**
@@ -337,6 +346,9 @@ export function validateFrontmatter(data: Record<string, unknown>): Frontmatter
   if (data.translationOf !== undefined && typeof data.translationOf !== 'string') {
     errors.push('translationOf must be a string');
   }
+  if (data.image !== undefined && typeof data.image !== 'string') {
+    errors.push('image must be a string');
+  }
 
   if (errors.length > 0) {
     throw new Error(`Invalid frontmatter:\n${errors.join('\n')}`);
@@ -351,6 +363,7 @@ export function validateFrontmatter(data: Record<string, unknown>): Frontmatter
     lang: (data.lang as Language) ?? 'en',
     draft: data.draft as boolean | undefined,
     translationOf: data.translationOf as string | undefined,
+    image: data.image as string | undefined,
   };
 }
 
@@ -390,6 +403,9 @@ export function validatePeriodicFrontmatter(data: Record<string, unknown>): Peri
   if (data.translationOf !== undefined && typeof data.translationOf !== 'string') {
     errors.push('translationOf must be a string');
   }
+  if (data.image !== undefined && typeof data.image !== 'string') {
+    errors.push('image must be a string');
+  }
 
   if (errors.length > 0) {
     throw new Error(`Invalid periodic frontmatter:\n${errors.join('\n')}`);
@@ -405,6 +421,7 @@ export function validatePeriodicFrontmatter(data: Record<string, unknown>): Peri
     lang: (data.lang as Language) ?? 'zh',
     draft: data.draft as boolean | undefined,
     translationOf: data.translationOf as string | undefined,
+    image: data.image as string | undefined,
   };
 }
 
@@ -447,6 +464,9 @@ export function validateSeriesFrontmatter(data: Record<string, unknown>): Series
   if (data.translationOf !== undefined && typeof data.translationOf !== 'string') {
     errors.push('translationOf must be a string');
   }
+  if (data.image !== undefined && typeof data.image !== 'string') {
+    errors.push('image must be a string');
+  }
 
   if (errors.length > 0) {
     throw new Error(`Invalid series frontmatter:\n${errors.join('\n')}`);
@@ -463,5 +483,6 @@ export function validateSeriesFrontmatter(data: Record<string, unknown>): Series
     draft: data.draft as boolean | undefined,
     itemCount: data.itemCount as number | undefined,
     translationOf: data.translationOf as string | undefined,
+    image: data.image as string | undefined,
   };
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ba4d744..b7859c0 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -90,6 +90,12 @@ importers:
       '@blog/config':
         specifier: workspace:*
         version: link:../../packages/config
+      '@fontsource/noto-serif-sc':
+        specifier: ^5.2.9
+        version: 5.2.9
+      '@fontsource/source-serif-pro':
+        specifier: ^5.2.5
+        version: 5.2.5
       '@testing-library/jest-dom':
         specifier: ^6.0.0
         version: 6.9.1
@@ -711,6 +717,12 @@ packages:
     resolution: {integrity: sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
 
+  '@fontsource/noto-serif-sc@5.2.9':
+    resolution: {integrity: sha512-+wosdNmyrtRjnqJ/4A6i99jApm6ye34n8Nh7jUO3P/+6Hd1ZBY1gB9yGaI5jVxb56RS1lM2kTc0DzX1ifRO2MA==}
+
+  '@fontsource/source-serif-pro@5.2.5':
+    resolution: {integrity: sha512-MTsjMrl2+81dar37wV1taDYzU+o9ArcuBVBkXRNb6JuNCBmrKOIAAmI1wC3cE+Q0eAlgXlfNrvZ7swP3l2M8tQ==}
+
   '@humanwhocodes/config-array@0.13.0':
     resolution: {integrity: sha512-DZLEEqFWQFiyK6h5YIeynKx7JlvCYWL0cImfSRXZ9l4Sg2efkFGTuFf6vzXjK1cq6IYkU+Eg/JizXw+TD2vRNw==}
     engines: {node: '>=10.10.0'}
@@ -2533,15 +2545,17 @@ packages:
   glob@10.3.10:
     resolution: {integrity: sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==}
     engines: {node: '>=16 || 14 >=14.17'}
+    deprecated: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me
     hasBin: true
 
   glob@10.5.0:
     resolution: {integrity: sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==}
+    deprecated: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me
     hasBin: true
 
   glob@7.2.3:
     resolution: {integrity: sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==}
-    deprecated: Glob versions prior to v9 are no longer supported
+    deprecated: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me
 
   globals@13.24.0:
     resolution: {integrity: sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==}
@@ -4268,6 +4282,7 @@ packages:
 
   uuid@9.0.1:
     resolution: {integrity: sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==}
+    deprecated: uuid@10 and below is no longer supported.  For ESM codebases, update to uuid@latest.  For CommonJS codebases, use uuid@11 (but be aware this version will likely be deprecated in 2028).
     hasBin: true
 
   uvu@0.5.6:
@@ -4851,6 +4866,10 @@ snapshots:
 
   '@eslint/js@8.57.1': {}
 
+  '@fontsource/noto-serif-sc@5.2.9': {}
+
+  '@fontsource/source-serif-pro@5.2.5': {}
+
   '@humanwhocodes/config-array@0.13.0':
     dependencies:
       '@humanwhocodes/object-schema': 2.0.3