"use strict"; const {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0]; const {useMDXComponents: _provideComponents} = arguments[0]; function _createMdxContent(props) { const _components = { br: "br", code: "code", h2: "h2", hr: "hr", li: "li", p: "p", pre: "pre", strong: "strong", ul: "ul", ..._provideComponents(), ...props.components }; return _jsxs(_Fragment, { children: [_jsx(_components.p, { children: "今日は、自作ブログにおける構造化データの対応とSEO強化をテーマに、Next.js + MDX を使った実装作業を行いました。この記事では、その内容をまとめておきます。" }), "\n", _jsx(_components.h2, { children: "1. はじめに：なぜ構造化データ対応をしたのか？" }), "\n", _jsxs(_components.p, { children: ["最近のGoogle検索では、リッチリザルト（画像付き、パンくず付きなど）が非常に目立ちます。検索結果で目立たせるには、構造化データの埋め込みが不可欠。", _jsx(_components.br, {}), "\n", "特に、ブログ記事の場合は「BlogPosting」や「BreadcrumbList」を正しく設定することで、検索結果での表示が改善され、アクセス増加が期待できます。"] }), "\n", _jsx(_components.h2, { children: "2. 使用技術スタック" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsx(_components.li, { children: _jsx(_components.strong, { children: "Next.js 15.2.3（App Router）" }) }), "\n", _jsx(_components.li, { children: _jsx(_components.strong, { children: "TypeScript" }) }), "\n", _jsx(_components.li, { children: _jsx(_components.strong, { children: "MDX（next-mdx-remote）" }) }), "\n", _jsx(_components.li, { children: _jsx(_components.strong, { children: "Tailwind CSS" }) }), "\n", _jsx(_components.li, { children: _jsx(_components.strong, { children: "Vercel ホスティング" }) }), "\n", _jsx(_components.li, { children: _jsx(_components.strong, { children: "構造化データ（JSON-LD）" }) }), "\n"] }), "\n", _jsx(_components.h2, { children: "3. 実装した主な内容" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsx(_components.li, { children: "ブログ記事のメタ情報（title、description、ogImage、authorなど）を frontmatter に統一" }), "\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "generateMetadata()" }), " でOGPとTwitterカード対応"] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "

Next.js + MDX ブログ構築記録：構造化データとSEO強化