暫定日本語訳：Svelte SEO

暫定日本語案: TL;DR — 大半の 重要 thing へ know について Svelte SEO is その Svelte 暫定日本語案: と SvelteKit are ない 同じ thing. Plain Svelte 構築 ページ in 暫定日本語案: 訪問者’s ブラウザー, so 検索エンジン 最初 see blank shell. SvelteKit — 暫定日本語案: Svelte’s 公式 framework — 構築 ページ on サーバー と 送信 finished 暫定日本語案: HTML. 使用 SvelteKit 向けに anything あなた want へ 順位.

Svelte vs. SvelteKit

暫定日本語案: Svelte is ツール 向けに 構築 ユーザー interfaces. It’s clever: instead of shipping 暫定日本語案: big JavaScript library へ ブラウザー, it compiles あなた components down へ small, 暫定日本語案: plain JavaScript at 構築 time. その 作る Svelte ページ fast.

暫定日本語案: ただし “fast” と “search-friendly” aren’t 同じ thing. plain Svelte app is 暫定日本語案: クライアント-side rendered — サーバー 送信 nearly empty ページ, と JavaScript 暫定日本語案: fills in コンテンツ once it loads in ブラウザー. If crawler looks at raw 暫定日本語案: HTML, there’s almost nothing there.

暫定日本語案: SvelteKit is 公式 framework built on top of Svelte. It does thing 暫定日本語案: その matters 大半の 向けに SEO: it renders あなた ページ on サーバー 最初, so 暫定日本語案: HTML その arrives already has あなた コンテンツ, あなた headings, と あなた links in it. 暫定日本語案: この is デフォルト behavior. If あなた’re 構築 サイト その needs へ 表示 up in 暫定日本語案: Google, あなた want SvelteKit, ない bare Svelte.

なぜ この matters 向けに 検索

• 暫定日本語案: Google できる run JavaScript, so it する eventually see クライアント-rendered 暫定日本語案: Svelte ページ — ただし there’s delay, と delay hurts fresh コンテンツ.
• 暫定日本語案: Bing と other 検索エンジン are less reliable at running JavaScript.
• 暫定日本語案: AI crawlers (GPTBot, ClaudeBot, PerplexityBot, と similar) generally fetch 暫定日本語案: static HTML, と rendering behavior varies by provider と changes 超えて time — 暫定日本語案: 現在の provider ドキュメント doesn’t establish one shared render 手順 あなた できる 暫定日本語案: count on filling in blank shell.

暫定日本語案: SvelteKit’s サーバー-side rendering sidesteps all of この. コンテンツ is in HTML 暫定日本語案: から start, so すべての kind of crawler できる read it なしで depending on 暫定日本語案: render 手順 it 可能性がある または 可能性がある ない perform.

simple 確認

• 暫定日本語案: 構築 とともに SvelteKit, ない plain Svelte, 向けに コンテンツ その needs へ 順位.
• 暫定日本語案: Give すべての ページ unique <title> と <meta name="description"> using 暫定日本語案: SvelteKit’s <svelte:head> element.
• 暫定日本語案: Don’t turn off サーバー-side rendering (don’t 使用 “SPA mode”) 向けに ページ あなた want 暫定日本語案: found.
• 暫定日本語案: 作成 sitemap と robots.txt (SvelteKit doesn’t 作る これらの 向けに あなた).
• 暫定日本語案: Don’t block あなた JavaScript または CSS files in robots.txt.

暫定日本語案: Want deeper version — four rendering modes, adapter trade-offs, 暫定日本語案: ssr: false trap, と load-function pattern 向けに metadata? Switch へ 暫定日本語案: Advanced tab.

暫定日本語案: TL;DR — Svelte SEO is really SvelteKit conversation. Bare Svelte is 暫定日本語案: CSR-だけ — コンテンツ isn’t in raw HTML. SvelteKit defaults へ SSR, 暫定日本語案: supports prerendering (SSG) per route, と lets あなた mix modes. Manage metadata 暫定日本語案: とともに <svelte:head> と フィード it から +page.server.js load functions so it lands 暫定日本語案: in initial HTML. sharpest trap: adapter-static とともに ssr: false does 暫定日本語案: ない prerender — it produces empty shells; SSR 必要がある stay on during 構築. 暫定日本語案: SvelteKit’s own docs warn SPA fallback has “large negative performance and SEO impacts.” 使用 History API routing ( デフォルト), 設定 trailingSlash, と 暫定日本語案: pick adapter へ match — static 向けに コンテンツ, node/vercel/cloudflare 向けに SSR.

Svelte is ない SvelteKit — と 向けに SEO その’s everything

暫定日本語案: Svelte is compiler. It turns あなた .svelte components へ lean vanilla 暫定日本語案: JavaScript とともに no virtual DOM と no runtime library shipped へ ブラウザー. その 暫定日本語案: gives Svelte real パフォーマンス edge — ただし it’s bundle-size optimization, ない 暫定日本語案: rendering one. plain Svelte app (Vite-bundled, no meta-framework) is still 暫定日本語案: クライアント-side-rendered SPA: サーバー returns blank HTML shell と ブラウザー 暫定日本語案: constructs ページ. View ソース on one と あなた コンテンツ isn’t there.

暫定日本語案: この is #1 ソース of confusion いつ 人々 検索 “Svelte SEO.” compile 暫定日本語案: 手順 doesn’t put コンテンツ in HTML. SvelteKit does. SvelteKit is Svelte’s 暫定日本語案: 公式 meta-framework — equivalent of Next.js 向けに React または Nuxt 向けに Vue — と 暫定日本語案: it renders ページ on サーバー by デフォルト, shipping fully populated HTML 前に 暫定日本語案: any JavaScript runs. It adds SSR, static prerendering, file-based routing, load 暫定日本語案: functions, と deployment adapters. headline: bare Svelte = CSR-だけ; 暫定日本語案: SvelteKit = SSR-最初. Everything else in この guide assumes SvelteKit.

暫定日本語案: Two scoping notes worth stating precisely, because それら’re どこ generic “Svelte SEO” advice goes 誤った: SvelteKit’s rendering options (ssr, csr, prerender, 暫定日本語案: trailingSlash) are 設定 per route と inherit hierarchically — +layout.js 暫定日本語案: または +layout.server.js できる 設定 デフォルト 向けに everything beneath it, と child 暫定日本語案: route できる override it. So “is this SvelteKit site SEO-friendly” isn’t 暫定日本語案: project-level question; 確認 specific route. と of SvelteKit’s rendering 暫定日本語案: options, it’s specifically ssr: false — ない SSR being merely absent, と ない 暫定日本語案: “using SvelteKit” in general — その docs tie へ empty output: “If you set ssr to false, it renders an empty ‘shell’ page instead.” この guide is 現在の 暫定日本語案: 向けに Svelte 5.x と SvelteKit 2.x ( 現在の majors as of この update); Svelte 5 暫定日本語案: made runes デフォルト reactivity model, ただし runes are component-authoring 暫定日本語案: concern, ない rendering mode — それら don’t change any of SEO guidance below.

暫定日本語案: なぜ rendering mode matters comes straight から どのように 検索エンジン 機能. Google 暫定日本語案: processes JavaScript in three phases — クロール, rendering, と インデックス登録 — と 暫定日本語案: “all pages with a 200 HTTP status code are sent to the rendering queue, no matter whether JavaScript is present on the page.” render queue adds delay, と as 暫定日本語案: Google’s own guidance puts it, “server-side or pre-rendering is still a great idea because it makes your website faster for users and crawlers, and not all bots can run JavaScript.” その 最後 clause is doing lot of 機能 in 2026 — see 暫定日本語案: AI-crawler section.

four rendering modes in SvelteKit

暫定日本語案: SvelteKit’s strength is その rendering is per-route decision via ページ options. 暫定日本語案: これらの options are hierarchical: 設定 デフォルト in +layout.js/+layout.server.js 暫定日本語案: と すべての nested route inherits it, unless child route エクスポート its own value へ 暫定日本語案: override it. 確認 option その actually applies へ specific route あなた care 暫定日本語案: について — ない just value 設定 at top of project.

• 暫定日本語案: SSR ( デフォルト). ページ are rendered サーバー-side と full HTML is in 暫定日本語案: initial レスポンス. Best 向けに dynamic, personalized, または frequently changing コンテンツ. 暫定日本語案: この is on unless あなた turn it off.
• 暫定日本語案: Prerender (export const prerender = true). ページ are generated as static 暫定日本語案: HTML at 構築 time. Maximum speed と maximum crawlability — ideal 向けに blog posts, 暫定日本語案: docs, と marketing ページ. Crucially, prerendering is SSR run at 構築 time, so 暫定日本語案: SSR 必要がある remain enabled 向けに it へ 機能.
• 暫定日本語案: SPA fallback (ssr: false). single-ページ-app shell とともに no サーバー rendering. 暫定日本語案: SvelteKit docs are blunt その この mode “has large negative performance and SEO impacts” と is really meant 向けに things like wrapping in mobile app — ない 暫定日本語案: 向けに コンテンツ あなた want インデックス登録.
• 暫定日本語案: Hybrid. Mix modes per route: prerender あなた marketing ページ, SSR あなた 商品 暫定日本語案: ページ, run SPA-style admin behind login. この is SvelteKit’s killer feature — 暫定日本語案: あなた don’t pick one rendering mode 向けに whole サイト.

ssr: false trap ( mistake へ 避ける)

暫定日本語案: この is 大半の expensive misunderstanding in SvelteKit SEO, so it gets its own 暫定日本語案: section. 人々 reach 向けに adapter-static へ “make a static site,” と then 設定 暫定日本語案: ssr: false thinking それら’re getting prerendered HTML. それら aren’t.

暫定日本語案: Prerendering is サーバー-side rendering executed at 構築 time. If あなた disable SSR, 暫定日本語案: there is nothing へ render — docs are explicit その ssr: false “renders an empty ‘shell’ page instead,” と その’s exactly 何 adapter-static then ships as 暫定日本語案: あなた prerendered output. コンテンツ だけ 表示される once クライアント-side JavaScript runs, 暫定日本語案: which puts あなた right back in CSR territory (とともに all its crawler 問題) despite 暫定日本語案: having “static” 構築. rule: とともに adapter-static, leave ssr on (its 暫定日本語案: デフォルト) so prerendering outputs real HTML. 使用 ssr: false だけ いつ あなた 暫定日本語案: genuinely want SPA shell と accept SEO cost.

Managing metadata とともに <svelte:head>

暫定日本語案: SvelteKit has special element, <svelte:head>, その injects コンテンツ へ 暫定日本語案: document <head> — と あなた don’t need third-party library へ manage あなた タイトル 暫定日本語案: と meta tags. すべての ページ すべき have unique <title> と 暫定日本語案: <meta name="description">, plus canonical, Open Graph, Twitter Card, hreflang, 暫定日本語案: robots directives, と JSON-LD as needed.

暫定日本語案: pattern 公式 docs recommend 向けに dynamic metadata:

1. 暫定日本語案: Return SEO metadata から +page.server.js load() function.
2. 暫定日本語案: Access it via page.data in あなた layout.
3. 暫定日本語案: Render it in <svelte:head> in root +layout.svelte.

<!-- +layout.svelte -->
<script>
  import { page } from '$app/state';
</script>

<svelte:head>
  <title>{page.data.title}</title>
  <meta name="description" content={page.data.description} />
  <link rel="canonical" href={page.data.canonical} />
</svelte:head>

暫定日本語案: If あなた’d rather 使用 component wrapper, third-party 暫定日本語案: svelte-seo package wraps <svelte:head> 暫定日本語案: とともに props 向けに 一般的な tags — ただし it’s convenience, ない requirement.

暫定日本語案: <svelte:head> gets あなた tags へ head; it doesn’t verify あなた got them right. 暫定日本語案: その’s still あなた job: confirm すべての route renders unique タイトル と 暫定日本語案: 説明 (ない one inherited から layout by accident), その canonical 暫定日本語案: あなた emit is consistent 間に direct-リクエスト HTML と 何 クライアント-side 暫定日本語案: navigation renders, と その robots directives と JSON-LD are present in raw 暫定日本語案: レスポンス — ない だけ visible 後に hydration.

Load functions: どこ あなた fetch SEO データ matters

暫定日本語案: この is metadata bug その bites 人々. +page.server.js load() runs on 暫定日本語案: サーバー, so its データ is in initial HTML レスポンス. +page.js load() runs on 暫定日本語案: サーバー 向けに 最初 render と on クライアント during クライアント-side navigation. 暫定日本語案: mistake is fetching あなた タイトル/説明/canonical in <script> block とともに 暫定日本語案: onMount() — その runs クライアント-side だけ, so initial HTML ships とともに no 暫定日本語案: metadata と crawler sees nothing on 最初 fetch. Fetch SEO-critical データ in 暫定日本語案: load function (サーバー load 向けに anything その 必要がある be in 最初 レスポンス), ない 暫定日本語案: in onMount.

暫定日本語案: Don’t assume file name alone proves boundary, though — +page.js load() 暫定日本語案: また runs on サーバー 向けに 最初 リクエスト, then re-runs クライアント-side on 暫定日本語案: navigation, と its return value has へ survive serialization へ be reused safely 暫定日本語案: on クライアント. If SEO-critical データ ever depends on value その isn’t safely 暫定日本語案: serializable, verify both direct-リクエスト HTML と クライアント-navigated view of 暫定日本語案: 同じ route, ない just one または other.

Routing と URL structure

• 暫定日本語案: File-based routing とともに [param] 向けに dynamic segments gives あなた clean, 暫定日本語案: predictable URLs.
• 暫定日本語案: History API routing is デフォルト — SvelteKit doesn’t 使用 hash/fragment 暫定日本語案: routing, と その’s exactly 何 あなた want. Google できる’t reliably resolve 暫定日本語案: hash-based (#/page) URLs, so History API routing is SEO-safe choice と 暫定日本語案: SvelteKit 作る it デフォルト.
• 暫定日本語案: trailingSlash in svelte.config.js accepts 'always', 'never', または 暫定日本語案: 'ignore'. SvelteKit handles canonical リダイレクト 向けに あなた, ただし leaving it 暫定日本語案: misconfigured (especially 'ignore') できる 作成 duplicate-コンテンツ variants. Pick 暫定日本語案: one と be consistent.
• 暫定日本語案: Dynamic routes あなた want prerendered need entries function へ enumerate 暫定日本語案: paths at 構築 time, または SvelteKit won’t know which URLs へ generate.

Choosing adapter 向けに SEO

暫定日本語案: adapter decides どのように と どこ あなた SvelteKit app is deployed, と その has SEO 暫定日本語案: consequences (mostly via TTFB, which フィード LCP):

暫定日本語案: 向けに blog または docs サイト, adapter-static とともに prerendering gives あなた maximum speed 暫定日本語案: と crawlability. 向けに dynamic サイト, adapter-cloudflare または adapter-vercel put SSR 暫定日本語案: at edge, which できる shrink TTFB と 役立つ Largest Contentful Paint — ただし 暫定日本語案: adapter だけ picks deployment shape. Actual TTFB depends on あなた データ fetching, 暫定日本語案: caching, と runtime’s cold-start behavior, so 測定 deployed ページ rather 暫定日本語案: than assuming adapter alone delivers win.

暫定日本語案: adapter is boundary, ない just deploy target: streaming, filesystem, 暫定日本語案: caching, edge/runtime APIs, リダイレクト, と error handling できる all behave differently 暫定日本語案: 間に adapters. route その looks 正しい とともに ローカル dev サーバー または 暫定日本語案: adapter-node isn’t guaranteed へ behave identically once deployed 通じて 暫定日本語案: adapter-cloudflare または adapter-vercel — テスト production 構築 on actual 暫定日本語案: target, ない just npm run preview.

Sitemaps と robots.txt

暫定日本語案: SvelteKit has no built-in sitemap または robots.txt — like headless setup, あなた 暫定日本語案: 構築 them explicitly.

• 暫定日本語案: Sitemap, 手動: 作成 src/routes/sitemap.xml/+server.js その returns 暫定日本語案: XML. 追加 export const prerender = true if あなた’re on adapter-static.
• 暫定日本語案: Sitemap, dynamic: サーバー-rendered endpoint その クエリ あなた CMS/database と 暫定日本語案: returns fresh XML on 各 リクエスト — best 向けに large または fast-changing サイト.
• 暫定日本語案: Sitemap, packages: svelte-sitemap 暫定日本語案: scans routes post-構築 (向けに SSG), と 暫定日本語案: sveltekit-static-sitemap 暫定日本語案: generates から prerendered routes.
• 暫定日本語案: robots.txt: drop static file in static/ (served at /robots.txt 暫定日本語案: 自動) または generate it から src/routes/robots.txt/+server.js endpoint. 暫定日本語案: Whichever あなた choose, don’t block あなた .js/.css — Google won’t render から 暫定日本語案: blocked files.

パフォーマンス と Core Web Vitals

暫定日本語案: SvelteKit’s compiler と framework mechanics give あなた structural head start on 暫定日本語案: パフォーマンス, と Core Web Vitals are ランキング input — ただし mechanics themselves 暫定日本語案: don’t guarantee score. compiler outputs vanilla JS とともに no virtual DOM と no 暫定日本語案: runtime library, so typical SvelteKit ページ ships less JavaScript than 暫定日本語案: equivalent React-based app; 自動 per-route code splitting, built-in asset と 暫定日本語案: link preloading, file-hashing 向けに long-lived caching, と edge deployment via 暫定日本語案: several adapters are all 利用可能. 何 あなた 構築 とともに それらの mechanics — ページ 暫定日本語案: weight, 画像 handling, third-party scripts, hydration cost, と deployment 暫定日本語案: target あなた actually choose — still decides あなた 測定 CWV と あなた rankings. 暫定日本語案: Treat framework as removing obstacles, ない as delivering result. 暫定日本語案: SvelteKit docs point あなた at right 測定 ツール: 暫定日本語案: “Google’s PageSpeed Insights and WebPageTest are excellent ways to understand the performance characteristics of a site.” 画像 optimization is 利用可能 via 暫定日本語案: @sveltejs/enhanced-img.

AI crawlers と SSR imperative

暫定日本語案: Here’s 2026 wrinkle older SvelteKit SEO guides miss. Rendering behavior 向けに 暫定日本語案: GPTBot (OpenAI), ClaudeBot (Anthropic), PerplexityBot, と Bingbot fetch behind 暫定日本語案: Copilot is provider- と version-specific, と 現在の provider ドキュメント 暫定日本語案: doesn’t establish one shared render 手順 あなた できる rely on. Treat “generally fetches static HTML without executing JavaScript” as safe planning assumption, ない 暫定日本語案: guarantee について すべての provider forever. CSR route (bare Svelte, または SvelteKit とともに 暫定日本語案: ssr: false) ships すべての one of これらの crawlers 同じ empty shell 最初-fetch 暫定日本語案: Googlebot リクエスト sees; SvelteKit’s デフォルト SSR puts あなた コンテンツ in raw HTML 暫定日本語案: so no crawler has へ depend on render 手順 at all. その’s argument 向けに 保持 暫定日本語案: SSR on 向けに anything あなた want AI systems へ see — ない promise その SSR guarantees 暫定日本語案: inclusion in AI answer, which depends on factors well beyond rendering.

一般的な SvelteKit SEO mistakes

• 暫定日本語案: Fetching SEO データ in onMount() instead of サーバー load function — metadata 暫定日本語案: isn’t in initial HTML.
• 暫定日本語案: Shipping SPA fallback mode (ssr: false) 向けに コンテンツ あなた want ranked.
• 暫定日本語案: adapter-static とともに ssr: false — empty shells, ない prerendered ページ.
• 暫定日本語案: Blocking JS/CSS in robots.txt — breaks rendering.
• 暫定日本語案: Skipping trailingSlash configuration — duplicate-コンテンツ variants.
• 暫定日本語案: Using hash/fragment routing — Googlebot できる’t resolve それらの URLs (SvelteKit’s 暫定日本語案: History API デフォルト already protects あなた here).

暫定日本語案: If あなた’re coming at この から broader framework angle, Svelte/SvelteKit is one of 暫定日本語案: decoupled frontends headless CMS pairs とともに, と rendering-mode logic here 暫定日本語案: is 同じ logic その governs JavaScript SEO generally — それらの topics live alongside 暫定日本語案: この one in cluster.

AI要約

暫定日本語案: condensed take on Advanced version:

• 暫定日本語案: Svelte ≠ SvelteKit. Bare Svelte compiles へ lean vanilla JS ただし is CSR-だけ 暫定日本語案: — コンテンツ isn’t in raw HTML. SvelteKit renders SSR by デフォルト と ships 暫定日本語案: full HTML. 使用 SvelteKit 向けに anything その 必要がある 順位.
• 暫定日本語案: なぜ rendering mode matters: Google queues all 200 ページ 向けに rendering (delay); 暫定日本語案: Bing is less reliable at JS; AI-crawler rendering (GPTBot, ClaudeBot, 暫定日本語案: PerplexityBot) is provider-specific と generally treated as fetch-だけ. 暫定日本語案: SSR/prerender puts コンテンツ in 最初 レスポンス so no crawler depends on 暫定日本語案: render 手順.
• 暫定日本語案: Four modes: SSR (デフォルト), prerender/SSG (prerender = true, 構築-time 暫定日本語案: HTML), SPA fallback (ssr: false, docs warn “large negative performance and SEO impacts”), と hybrid (mix per route — SvelteKit’s killer feature).
• 暫定日本語案: ** trap:** adapter-static + ssr: false produces empty shells, ない 暫定日本語案: prerendered HTML. Prerendering is SSR at 構築 time — 保つ SSR on.
• 暫定日本語案: Metadata: manage <title>/meta とともに <svelte:head> (no library needed). 暫定日本語案: フィード it から +page.server.js load function, ない onMount() (クライアント-だけ).
• 暫定日本語案: Routing: History API by デフォルト (good — hash routing is bad 向けに SEO); 暫定日本語案: 設定 trailingSlash; prerendered dynamic routes need entries function.
• 暫定日本語案: Adapters: adapter-static (SSG, コンテンツ サイト) vs. adapter-node/vercel/ 暫定日本語案: cloudflare (SSR; edge adapters できる cut TTFB, which 役立つ LCP — ただし 測定 暫定日本語案: deployed route, since adapters differ in streaming, caching, と runtime behavior).
• 暫定日本語案: No built-in sitemap/robots.txt — 構築 them (手動 +server.js route, dynamic 暫定日本語案: endpoint, または package). 決して block .js/.css.
• 暫定日本語案: CWV head start: compiler output ships less JS than React; code splitting, 暫定日本語案: preloading, caching, edge deployment are all 利用可能 — ただし ページ weight, 画像, 暫定日本語案: third-party scripts, と あなた deployment choice still decide 測定 score.

公式ドキュメント

暫定日本語案: 主要-ソース ドキュメント から SvelteKit と 検索エンジン.

暫定日本語案: SvelteKit

• 暫定日本語案: SEO • SvelteKit Docs — SSR-by-デフォルト, <svelte:head> 向けに metadata, trailing-slash normalization, パフォーマンス, と sitemap endpoint pattern.
• 暫定日本語案: ページ options (prerender, ssr, csr) • SvelteKit Docs — どのように へ 設定 rendering mode per route, と SPA-mode warning.
• 暫定日本語案: Static サイト generation (adapter-static) • SvelteKit Docs — prerendering へ static files と ssr requirement.
• 暫定日本語案: Loading データ • SvelteKit Docs — サーバー vs. universal load functions (どこ あなた SEO データ すべき be fetched).
• 暫定日本語案: パフォーマンス • SvelteKit Docs — code splitting, preloading, caching, と 測定 ツール.

暫定日本語案: Google

• 暫定日本語案: Understand JavaScript SEO Basics — three-phase プロセス, render queue, History API routing, と “not all bots can run JavaScript” guidance.
• 暫定日本語案: 新しい evergreen Googlebot — Googlebot’s move へ evergreen Chromium と 何 it still doesn’t support.
• 暫定日本語案: SEO Guide 向けに Web Developers — SSR/prerendering recommendation 向けに indexable コンテンツ.

出典からの引用

暫定日本語案: On—record statements から SvelteKit docs と Google. 各 link is deep link 暫定日本語案: その jumps へ quoted passage on ソース ページ.

暫定日本語案: SvelteKit docs — rendering & SEO

• 暫定日本語案: “This option has large negative performance and SEO impacts” — on running app 暫定日本語案: as クライアント-side-rendered SPA (ssr: false fallback). 暫定日本語案: Jump へ quote
• 暫定日本語案: “Google’s PageSpeed Insights and WebPageTest are excellent ways to understand the performance characteristics of a site.” 暫定日本語案: Jump へ quote

暫定日本語案: Google — JavaScript & rendering

• 暫定日本語案: “All pages with a 200 HTTP status code are sent to the rendering queue, no matter whether JavaScript is present on the page.” 暫定日本語案: Jump へ quote
• 暫定日本語案: “Server-side or pre-rendering is still a great idea because it makes your website faster for users and crawlers, and not all bots can run JavaScript.” 暫定日本語案: Jump へ quote
• 暫定日本語案: “Google Search won’t render JavaScript from blocked files or on blocked pages.” 暫定日本語案: Jump へ quote

暫定日本語案: Patrick Stox (my own 機能 — JavaScript SEO: Definitive Guide)

• 暫定日本語案: “JavaScript is not bad for SEO, and it’s not evil. It’s just different from what many SEOs are used to, and there’s a bit of a learning curve.”
• 暫定日本語案: On rendering modes: “Any kind of SSR, static rendering, and prerendering setup is going to be fine for search engines.”
• 暫定日本語案: On CSR: “The most problematic one is going to be full client-side rendering where all of the rendering happens in the browser. While Google will probably be OK client-side rendering, it’s best to choose a different rendering option to support other search engines.”

暫定日本語案: Note: SvelteKit docs と Google’s JavaScript SEO docs are themselves 暫定日本語案: JavaScript-rendered と できる resist automated text-fragment 確認; これらの quotes were 暫定日本語案: verified against brief’s 2026-06-26 research, ただし confirm them against live 暫定日本語案: ページ 前に treating any deep link as final.

SvelteKit SEO 確認

暫定日本語案: quick pass へ confirm 検索エンジン と AI crawlers できる see あなた SvelteKit コンテンツ:

• 暫定日本語案: [ ] あなた’re using SvelteKit, ない bare Svelte, 向けに anything その needs へ 順位.
• 暫定日本語案: [ ] SSR is on ( デフォルト) 向けに indexable routes — no accidental ssr: false.
• 暫定日本語案: [ ] コンテンツ-heavy ページ 使用 prerender (export const prerender = true) どこ 暫定日本語案: それら できる.
• 暫定日本語案: [ ] とともに adapter-static, ssr is left on so prerendering outputs real 暫定日本語案: HTML (ない empty shells).
• 暫定日本語案: [ ] すべての ページ has unique <title> と <meta name="description"> via 暫定日本語案: <svelte:head>.
• 暫定日本語案: [ ] SEO metadata is fetched in +page.server.js load function, ない in 暫定日本語案: onMount().
• 暫定日本語案: [ ] Canonical, Open Graph, と JSON-LD are rendered サーバー-side, ない injected 暫定日本語案: クライアント-side.
• 暫定日本語案: [ ] trailingSlash is 設定 explicitly in svelte.config.js.
• 暫定日本語案: [ ] Prerendered dynamic routes have entries function enumerating paths.
• 暫定日本語案: [ ] sitemap exists (+server.js route または package) と robots.txt is in 暫定日本語案: static/ または route.
• 暫定日本語案: [ ] robots.txt does ない block .js または .css.
• 暫定日本語案: [ ] Routing is History API (SvelteKit デフォルト) — no hash/fragment routes.
• 暫定日本語案: [ ] あなた verified rendered HTML in GSC URL Inspection (コンテンツ + metadata 暫定日本語案: present on 最初 fetch).

mental models

暫定日本語案: 1. Svelte-vs-SvelteKit fork. 暫定日本語案: 前に anything else, answer: bare Svelte または SvelteKit? Bare Svelte is CSR-だけ — 暫定日本語案: コンテンツ isn’t in HTML. SvelteKit is SSR-最初. Nearly すべての “Svelte SEO problem” 暫定日本語案: traces back へ someone using plain Svelte (または disabling SvelteKit’s SSR) 向けに コンテンツ 暫定日本語案: その needs へ 順位.

暫定日本語案: 2. Prerendering = SSR at 構築 time. 暫定日本語案: “Static” doesn’t mean “no rendering.” Prerendering runs あなた サーバー render at 構築 暫定日本語案: time と saves HTML. その’s なぜ ssr: false できる’t prerender — there’s nothing へ 暫定日本語案: render. 保つ SSR on; choose いつ it runs (リクエスト time = SSR, 構築 time = 暫定日本語案: prerender).

暫定日本語案: 3. rendering-mode-per-route decision. 暫定日本語案: SvelteKit lets あなた choose per route, so match mode へ コンテンツ:

• 暫定日本語案: Static-ish コンテンツ (blog, docs, marketing) → prerender (SSG).
• 暫定日本語案: Fresh/dynamic コンテンツ (listings, personalized ページ) → SSR.
• 暫定日本語案: Behind—login, ない-インデックス登録 UI → SPA fallback is acceptable there だけ.

暫定日本語案: 4. HTML-最初 metadata. 暫定日本語案: Anything crawler needs — タイトル, 説明, canonical, JSON-LD — belongs in 暫定日本語案: サーバー-rendered HTML via <svelte:head> fed by サーバー load function. onMount() 暫定日本語案: metadata is seen late by Google, と providers その treat AI crawlers as fetch-だけ 暫定日本語案: won’t see it at all.

暫定日本語案: 5. adapter = deployment shape. 暫定日本語案: adapter decides どこ SSR runs (または whether it’s all static). Static 向けに コンテンツ 暫定日本語案: サイト; node/vercel/cloudflare 向けに SSR. Edge adapters できる shrink TTFB, which できる 役立つ 暫定日本語案: LCP — ただし adapter is one input; あなた データ fetching, caching, と runtime’s 暫定日本語案: cold-start behavior decide 何 あなた actually 測定. Adapters また differ in 暫定日本語案: streaming, filesystem access, と error handling, so verify production behavior 暫定日本語案: per adapter rather than assuming feature parity.

暫定日本語案: 6. Plan 向けに crawlers その don’t run あなた JavaScript. 暫定日本語案: Rendering behavior 向けに AI crawlers is provider- と version-specific, と 現在の 暫定日本語案: provider ドキュメント doesn’t guarantee shared render 手順. safe planning 暫定日本語案: assumption is fetch-だけ: if コンテンツ isn’t in initial HTML, treat it as 暫定日本語案: invisible へ その class of crawler. SSR/prerender removes dependency on any 暫定日本語案: crawler’s rendering capability at all — strongest lever あなた have, ない 暫定日本語案: guarantee について 何 any one AI system does とともに result.

SvelteKit SEO — cheat sheet

暫定日本語案: Rendering modes (設定 per route via ページ options)

暫定日本語案: ** trap**

• 暫定日本語案: adapter-static + ssr: false → empty shells, ない prerendered HTML. 保つ 暫定日本語案: ssr on とともに adapter-static.

暫定日本語案: Adapters

暫定日本語案: Fast rules

• 暫定日本語案: Metadata → <svelte:head> (no library needed); フィード から +page.server.js 暫定日本語案: load, 決して onMount(). Confirm 各 route’s タイトル/説明 is unique.
• 暫定日本語案: Routing → History API (デフォルト). 決して hash/fragment routes.
• 暫定日本語案: 設定 trailingSlash explicitly.
• 暫定日本語案: Prerendered dynamic routes → 追加 entries function.
• 暫定日本語案: No built-in sitemap/robots.txt — 構築 them (+server.js route または package).
• 暫定日本語案: 決して block .js/.css in robots.txt.
• 暫定日本語案: AI crawlers → generally fetch-だけ, provider-specific → 保つ SSR on so コンテンツ 暫定日本語案: doesn’t depend on render 手順.
• 暫定日本語案: Options (ssr/csr/prerender/trailingSlash) are hierarchical — 確認 暫定日本語案: value その applies へ specific route, ない just project デフォルト.

Plain Svelte または SvelteKit

Svelte SEO mistakes

• 暫定日本語案: Using plain クライアント-だけ Svelte 向けに 検索 landing ページ. Move rankable routes へ SvelteKit SSR または prerendering.
• 暫定日本語案: 設定 ssr = false globally. その turns サイト へ SPA と removes 完全な initial HTML. Scope クライアント-だけ behavior へ routes その do ない need 検索 visibility.
• 暫定日本語案: Updating <svelte:head> だけ 後に ブラウザー fetches. Load metadata とともに 同じ サーバー/構築 データ その renders ページ.
• 暫定日本語案: Using hash-based URLs 向けに コンテンツ routes. Hash fragments are ない separate サーバー routes. 使用 normal pathname routing.
• 暫定日本語案: テスト だけ 後に hydration. Compare raw HTML とともに rendered DOM so クライアント code cannot hide 不足している ソース コンテンツ.

Raw HTML is empty app shell

暫定日本語案: Likely cause: plain Svelte SPA output または ssr = false. Fix: 使用 SvelteKit SSR/prerendering 向けに route と move essential loading へ サーバー-compatible load. Confirm: curl returns heading, コンテンツ, と internal links.

タイトル と canonicals 表示される だけ 後に JavaScript

暫定日本語案: Likely cause: head values depend on クライアント lifecycle または ブラウザー-だけ fetching. Fix: return データ during SSR/prerender と render it 通じて <svelte:head>. Confirm: raw と rendered head values agree.

dynamic route is 不足している から static 構築

暫定日本語案: Likely cause: prerenderer cannot discover parameterized path. Fix: expose crawlable links または 設定 entries, または render その route on demand. Confirm: deployed route returns 完全な 200 ページ.

ページ 機能 locally ただし fails 後に deployment

暫定日本語案: Likely cause: adapter mismatch, 不足している サーバー support, または environment-dependent データ fetching. Fix: テスト production adapter output と its runtime variables. Confirm: production ソース HTML matches テスト 構築.

Confirm SvelteKit is actually serving rendered HTML

暫定日本語案: whole point of SvelteKit’s SSR is その コンテンツ is in raw HTML — 前に any 暫定日本語案: JavaScript runs. fastest way へ confirm あなた didn’t accidentally ship CSR shell 暫定日本語案: is へ fetch raw レスポンス と look 向けに あなた コンテンツ. plain curl doesn’t run 暫定日本語案: JavaScript, so it sees exactly 何 non-rendering crawler sees.

暫定日本語案: macOS / Linux

# Raw HTML as the server sends it (no JS executed)
curl -sL "https://example.com/your-page/" -o raw.html

# Is your real content in the raw HTML? (empty result = you're shipping a CSR shell)
grep -o "Your unique headline text" raw.html

# Is your title/description in the initial response?
grep -iE "<title>|name=\"description\"" raw.html

暫定日本語案: Windows (PowerShell)

Invoke-WebRequest -Uri "https://example.com/your-page/" -OutFile raw.html
Select-String -Path raw.html -Pattern "Your unique headline text"
Select-String -Path raw.html -Pattern "<title>","name=`"description`""

暫定日本語案: If あなた headline と metadata are present in raw.html, SSR/prerendering is 機能. 暫定日本語案: If それら’re 不足している ただし visible in ブラウザー, あなた コンテンツ depends on クライアント-side 暫定日本語案: rendering — 確認 その ssr isn’t 設定 へ false と その あなた’re ない fetching コンテンツ 暫定日本語案: だけ in onMount().

暫定日本語案: 確認 あなた’re ない blocking JS/CSS

curl -sL "https://example.com/robots.txt" | grep -iE "disallow.*\.(js|css)|Disallow:\s*/(_app|assets)"

暫定日本語案: Disallow matching /_app/ (SvelteKit’s bundled output) または あなた CSS means Google 暫定日本語案: できる’t render ページ — almost 常に mistake.

ツール 向けに debugging SvelteKit SEO

• 暫定日本語案: URL Inspection (Google 検索 Console) — ソース of truth. Run live 暫定日本語案: テスト, then 確認 rendered HTML, screenshot, と ページ resources へ 暫定日本語案: confirm あなた コンテンツ と metadata are present (と その nothing is blocked).
• 暫定日本語案: PageSpeed Insights — SvelteKit docs explicitly recommend it; checks Core Web 暫定日本語案: Vitals (LCP/INP/CLS) その SvelteKit’s lean output is built へ win.
• 暫定日本語案: WebPageTest — other ツール SvelteKit docs name; waterfall + filmstrip view 暫定日本語案: 向けに diagnosing TTFB と render timing.
• 暫定日本語案: Rich Results テスト — fast way へ confirm JSON-LD made it へ rendered output.
• 暫定日本語案: Screaming Frog SEO Spider — クロール とともに JS rendering on/off へ diff raw vs. 暫定日本語案: rendered HTML 全体で whole SvelteKit サイト.
• 暫定日本語案: Ahrefs サイト Audit — surfaces broken canonicals, 不足している metadata, リダイレクト 暫定日本語案: chains, と indexability 問題 at scale.
• 暫定日本語案: View ソース / curl — quickest “is my content in the raw HTML?” 確認 (see 暫定日本語案: Scripts tab).

テスト yourself: Svelte SEO

暫定日本語案: Five quick questions on どのように Svelte と SvelteKit affect 検索 visibility. Pick 暫定日本語案: answer 向けに 各, then 確認.

時間を使う価値のあるリソース

暫定日本語案: My related writing

• 暫定日本語案: JavaScript SEO: Definitive Guide — my full reference on rendering, DOM parity, と rendering-mode trade-offs その underpin everything here. It mentions Svelte alongside React, Vue, と Angular as frameworks とともに head/meta modules 向けに SEO.
• 暫定日本語案: Beginner’s Guide へ Technical SEO — どこ rendering と クロール fit in bigger picture.

暫定日本語案: My speaking

• 暫定日本語案: どのように 検索 機能 (SlideShare) — my walkthrough of クロール, rendering, インデックス登録, と ランキング. (My standing disclaimer applies: “This is my understanding of systems… not going to be 100% complete or accurate.”)

暫定日本語案: から around industry

• 暫定日本語案: SEO • SvelteKit Docs — 公式, authoritative starting point: SSR by デフォルト, <svelte:head>, trailing slashes, と sitemap pattern.
• 暫定日本語案: ページ options (prerender, ssr, csr) • SvelteKit Docs — per-route rendering controls と SPA-mode SEO warning, in team’s own words.
• 暫定日本語案: Understand JavaScript SEO Basics (Google 検索 Central) — render queue, “not all bots can run JavaScript,” と History API guidance.
• 暫定日本語案: SvelteKit SEO: あなた Secret Weapon (Okupter) — practitioner guide covering meta tags, prerendering, rendering modes, structured データ, と sitemaps.
• 暫定日本語案: SvelteKit SEO: 検索エンジン Optimization Metadata (Rodney Lab) — essential meta tags, SEO component pattern, social cards, と 言語 declaration.
• 暫定日本語案: どのように へ 追加 basic SEO component へ SvelteKit (Thilo Maier) — code-focused walkthrough of reusable SEO component.
• 暫定日本語案: Creating Sitemap in SvelteKit (Bryan Anthonio) — clear, 現在の guide へ +server.js sitemap-endpoint approach.
• 暫定日本語案: Rich Harris explains なぜ SvelteKit pushes 向けに SSR (DEV Community) — context on なぜ SvelteKit’s creator made SSR デフォルト と pushes against SPA/CSR.

変更履歴