Panduan Headless Commerce Platforms

TL;DR — sebuah “headless commerce platform” (terjemahan) “headless commerce platform” adalah mesin itu berjalan Anda products, cart, dan checkout dan hands itu data untuk sebuah terpisah storefront Anda bangun. setiap vendor claims theirs adalah “SEO-optimized out dari itu box.” (terjemahan) “SEO-dioptimalkan out dari box.” itu’s hanya half benar. beberapa (Shopify Hydrogen, BigCommerce Catalyst) ship nyata SEO scaffolding — sebuah sitemap, sebuah robots.txt, sebuah metadata helper. Others (Medusa, Saleor, Elastic Path) ship tidak ada apa pun SEO-spesifik dan leave semua dari ini untuk Anda. Pick berdasarkan bagaimana banyak Anda ingin bangun versus inherit.

Apa kami’re sebenarnya comparing di sini

di sebuah wajar Shopify atau WooCommerce store, satu sistem melakukan semuanya: ini stores Anda products, memproses orders, dan renders halaman shoppers dan Google see. sebuah headless setup splits itu apart. sebuah commerce mesin menangani products, inventory, dan checkout, dan hands itu data melalui sebuah API untuk sebuah terpisah frontend itu renders apa orang sebenarnya lihat.

commerce mesin adalah “headless commerce platform.” (terjemahan) “headless commerce platform.” major ones sebagai dari pertengahan 2026 adalah Shopify (melalui -nya Hydrogen kerangka kerja dan Storefront API), BigCommerce (melalui Catalyst), commercetools, Salesforce Commerce Cloud (melalui PWA Kit), Medusa, Saleor, dan Elastic Path.

satu hal itu penting untuk choosing

untuk SEO, platforms jangan benar-benar differ pada apakah Anda halaman dapat menjadi di-crawl — itu muncul down untuk bagaimana Anda frontend renders halaman, yang Headless Ecommerce SEO hub covers di penuh (SSR, SSG, CSR). Apa mereka differ pada adalah bagaimana banyak SEO plumbing mereka hand Anda untuk free versus bagaimana banyak Anda memiliki untuk bangun yourself.

Think dari ini sebagai three groups:

• mereka memberikan Anda sebuah lot. Shopify Hydrogen dan BigCommerce Catalyst keduanya ship sebuah berfungsi contoh storefront dengan sebuah sitemap, sebuah robots.txt, dan sebuah cara untuk set Anda tag judul dan deskripsi meta sudah wired di.
• mereka memberikan Anda helpers, tidak finished hal. commercetools dan Salesforce PWA Kit hand Anda alat untuk bangun sitemap tetapi membuat Anda assemble ini yourself.
• mereka memberikan Anda tidak ada apa pun SEO-spesifik. Medusa, Saleor, dan Elastic Path adalah pure “di sini’s Anda product data melalui an API” (terjemahan) “di sini’s Anda product data melalui sebuah API” mesin. setiap bit dari SEO — sitemap, metadata, robots.txt — adalah pada Anda (atau pada whatever frontend kerangka kerja Anda bangun, biasanya Berikutnya.js).

hal sebagian besar orang mendapatkan wrong

“SEO-optimized out of the box” (terjemahan) “SEO-dioptimalkan out dari box” adalah sebuah spectrum, tidak sebuah checkbox. setiap vendor’s marketing halaman says ini. tetapi Elastic Path’s own SEO blog post tidak bahkan mention sitemaps, tag canonical, atau redirects — so “out dari itu box” (terjemahan) “out dari box” dapat berarti hampir tidak ada apa pun. jangan take claim di face nilai. tanyakan spesifik pertanyaan: apa melakukan ini platform ship untuk sitemaps, metadata, redirects, dan mempertahankan my staging situs out dari Google? jawaban vary sebuah lot.

ingin platform-oleh-platform breakdown, preview-environment gotcha, dan sebuah decision kerangka kerja untuk picking satu? Switch untuk Advanced tab.

TL;DR — Headless commerce platforms sit pada sebuah spectrum dari “ships real SEO scaffolding” (terjemahan) “ships nyata SEO scaffolding” untuk “leaves everything to you.” (terjemahan) “leaves semuanya untuk Anda.” Shopify Hydrogen ships paling — sebuah getSeoMeta utility, sitemap routes, robots.txt, dan (melalui Oxygen) automatic crawler-blocking pada preview deployments. BigCommerce Catalyst proxies BigCommerce’s own sitemap indeks dan menggunakan Berikutnya.js App Router generateMetadata conventions. commercetools Frontend dan Salesforce PWA Kit memberikan Anda SDK/API helpers, tidak shipped routes — Anda assemble sitemap yourself, dengan nyata pagination limits. Medusa, Saleor, dan Elastic Path ship tidak ada apa pun SEO-spesifik; frontend owns semuanya. Dua risks adalah genuinely differentiated oleh platform: preview-environment leakage (Hydrogen auto-blocks crawler pada shareable tautan; others jangan jaminan ini) dan redirect maps (Tidak platform automates them). Platform pilihan sets bagaimana banyak scaffolding Anda inherit — tidak apakah halaman adalah dapat di-crawl, yang adalah masih rendering decision hub owns.

Platform pilihan adalah tidak rendering decision

Mulai di sini, karena ini adalah single sebagian besar umum confusion. Apakah Googlebot mendapatkan nyata HTML atau sebuah empty shell adalah decided oleh Anda frontend’s rendering model — rendering sisi server (SSR), static generation (SSG), atau rendering sisi klien (CSR). itu’s frontend kerangka kerja’s job, dan Headless Ecommerce SEO hub covers ini secara mendalam. I tidak akan re-derive SSR vs. CSR di sini.

Apa commerce platform melakukan decide adalah bagaimana banyak SEO scaffolding Anda inherit — sitemap, metadata plumbing, robots.txt, preview-environment menangani. sebuah pristine SSR setup pada Medusa masih memiliki Tidak sitemap until Anda bangun satu; sebuah CSR mistake pada Hydrogen masih tanks sebuah product halaman bahkan though Hydrogen ships setiap lainnya piece. pertahankan dua axes terpisah: rendering = crawlability; platform = scaffolding.

SEO-tooling spectrum

Di sini’s di mana seven platforms land:

Ships nyata tooling (sebuah berfungsi reference storefront dengan SEO wired di): Shopify Hydrogen, BigCommerce Catalyst.

Ships SDK helpers, tidak routes (Anda assemble sitemap yourself): commercetools Frontend, Salesforce PWA Kit.

Ships tidak ada apa pun SEO-spesifik (pure commerce API; frontend owns semua dari ini): Medusa, Saleor, Elastic Path.

itu framing adalah seluruh artikel. rest adalah per-platform detail.

Shopify Hydrogen (Storefront API)

Hydrogen adalah Shopify’s headless kerangka kerja, dan ini ships paling menyelesaikan SEO scaffolding dari apa pun reviewed di sini. Satu correction up front: Hydrogen adalah tidak Remix-based anymore. npm registry menampilkan @shopify/hydrogen 2026.4.4 peer-depending pada react-router ~7.16.0 dengan Tidak Remix dependency di semua, dan Shopify’s own @shopify/remix-oxygen package now carries sebuah formal deprecation notice telling Anda untuk import from react-router instead. Shopify’s own SEO doc hasn’t caught up to its own package metadata — sebagai dari ini periksa it masih membaca “Hydrogen menggunakan Remix’s built-di meta features untuk SEO tags” — so jangan take itu line di face value jika Anda scaffolding a new project; periksa package.json, tidak itu prose.

Metadata — sebuah purpose-dibangun utility. Whatever doc panggilan underlying router, Hydrogen masih ships getSeoMeta utility, yang membuat ini easier dan lebih consistent untuk render SEO meta tags. itu getSeoMeta helper menangani judul, deskripsi, images, canonical URLs, dan JSON-LD — sebuah sebenarnya metadata abstraction, tidak “bring your own <head>.” (terjemahan) “menyediakan sendiri elemen <head>.” ini adalah satu-satunya platform di sini itu ships sebuah dedicated SEO-metadata utility. Shopify juga notes itu “Oleh default Hydrogen removes query parameters dari canonical URLs” (terjemahan) “oleh default Hydrogen menghapus kueri parameters dari canonical URLs” — sebuah sensible default Anda dapat override di Anda meta exports.

Sitemap — shipped dan self-refreshing. Hydrogen skeleton template mencakup sitemap.xml dan per-jenis sitemap routes out dari box, dan -nya getSitemap utility generates per-resource-jenis sitemaps dengan locale alternates. sitemap files adalah cached untuk 24 hours, so penerbitan atau unpublishing sebuah product memperbarui sitemap secara otomatis di dalam itu window — Tidak scheduled job untuk babysit.

robots.txt — shipped, dengan sebuah preview safeguard. template ships sebuah robots.txt route. dan di sini’s differentiator: per Shopify’s SEO docs, “If you make a non-production deployment accessible with a shareable link or an auth bypass token, then Oxygen overrides the deployment’s robots.txt file with a disallow rule for all bots and crawlers.” (terjemahan) “Jika Anda membuat deployment nonproduksi yang dapat diakses melalui tautan yang bisa dibagikan atau token bypass autentikasi, Oxygen akan mengganti berkas robots.txt deployment tersebut dengan aturan disallow untuk semua bot dan crawler.” Oxygen (Shopify’s Hydrogen hosting) secara otomatis blocks semua crawler pada preview/shareable-tautan deployments. itu’s sebuah nyata masalah — duplicate staging konten getting terindeks — itu sebagian besar platforms leave Anda untuk solve oleh hand, dan Hydrogen hanya menangani.

apa left untuk Anda: verify Tidak product atau category route adalah accidentally left sebagai sebuah resource route itu skips SSR (React Router’s kerangka kerja mode menggunakan yang sama server-loader pattern Remix digunakan sebelum Hydrogen’s migration), dan configure Oxygen caching ( hub’s advanced lens covers stale-cache risk).

BigCommerce headless (Catalyst)

Catalyst adalah BigCommerce’s Berikutnya.js App Router reference storefront. -nya SEO scaffolding adalah nyata tetapi architecturally berbeda dari Hydrogen’s.

Sitemap — proxied, tidak generated. Per BigCommerce’s Catalyst docs, “Catalyst acts as an intermediary when handling requests to /sitemap.xml.” (terjemahan) “Catalyst bertindak sebagai perantara ketika menangani permintaan ke /sitemap.xml.” ini fetches sitemap indeks dari BigCommerce (terhadap channel’s canonical URL) dan mengembalikan XML. So sitemap muncul untuk menjadi disajikan dari Anda storefront, tetapi data lives di BigCommerce, tidak di Anda frontend codebase — opposite dari Hydrogen, di mana sitemap route lives di dalam app. BigCommerce juga warns itu “Jika Anda storefront juga menggunakan pihak ketiga sistem itu generate konten dengan berbeda URLs, Anda akan perlu untuk submit multiple sitemaps untuk cover itu URLs dari various sources,” (terjemahan) “jika Anda storefront juga menggunakan ketiga-party sistem itu generate konten dengan berbeda URLs, Anda akan perlu untuk submit multiple sitemaps untuk cover URLs dari various sources,” dan notes sitemaps “don’t need to reside on the same domain as the website they represent” (terjemahan) “jangan perlu untuk reside pada yang sama domain sebagai situs web mereka mewakili” — flexible untuk multi-channel setups, tetapi sebuah footgun jika per-channel canonical domains tidak configured correctly.

Metadata — Berikutnya.js conventions. Catalyst populates generateMetadata dan alternates.canonical field per route dari Storefront API GraphQL data, server-side. itu’s standard App Router pattern Berikutnya.js SEO artikel sudah documents di detail — I’ll poin di sana alih-alih re-jelaskan generateMetadata syntax.

Peringatan migrasi. Jika Anda berpindah dari tema Stencil lama milik BigCommerce ke Catalyst, kesetaraan URL menjadi penentu utama. Seperti dinyatakan Dan Kogan dari 1Digital Agency dalam panduan praktisi SEO Catalyst: “Do not change established URLs on a Stencil-to-Catalyst migration. Every product, category, and content URL should match the legacy structure exactly, or you need a complete 301 redirect map.” (terjemahan) “Saat bermigrasi dari Stencil ke Catalyst, jangan mengganti URL yang telah digunakan. Semua URL produk, kategori, dan konten harus mempertahankan struktur lama secara persis; jika tidak, Anda harus menyiapkan peta redirect 301 yang lengkap.” Ia juga menyoroti regresi Catalyst yang berulang—generateMetadata mengembalikan fallback khusus klien karena kueri GraphQL dialihkan ke komponen klien, tag canonical hilang pada halaman daftar berpaginasi, dan JSON-LD Product dipancarkan dua kali (sekali oleh komponen khusus dan sekali oleh aplikasi pihak ketiga). Semua hal tersebut layak diperiksa sebelum peluncuran.

commercetools (Frontend / composable storefronts)

commercetools adalah enterprise “composable/MACH” (terjemahan) “composable/MACH” option, dan -nya SEO scaffolding adalah proportionally thinner — Anda mendapatkan SDK helper metode, tidak shipped routes.

Per commercetools’ Frontend docs, platform generates three terpisah sitemaps — static halaman, product halaman, dan category halaman — combined ke sebuah sitemap indeks. Static halaman come dari sdk.page.getPages(), products dari extensions.product.query(), dan categories dari extensions.product.queryCategories(). tetapi setup adalah tidak automatic: ini memerlukan Frontend tambahkan-pada plus manually membuat three Berikutnya.js route handlers (sitemap-static.xml/route.tsx, sitemap-products.xml/route.tsx, sitemap-categories.xml/route.tsx) dan sebuah postbuild script untuk assemble akhir /sitemap.xml. dan product/category kueri adalah cursor-paginated dengan sebuah 500-item limit per permintaan, so sebuah besar catalog perlu pagination logic di dalam Anda sitemap generator. ini adalah paling bangun-ini-yourself dari enterprise platforms untuk sitemaps secara khusus — yang tracks dengan commercetools’ seluruh Tidak-opinionated-frontend positioning.

Salesforce Commerce Cloud headless (PWA Kit / Composable Storefront)

PWA Kit’s SEO tooling adalah paling fragmented dan manual dari platforms dengan sebuah official reference storefront.

Sitemap — path branches. Per Salesforce’s docs, jika Anda routes adalah configured di Business Manager, Anda buat sitemap di Business Manager; jika routes adalah managed di luar ini (custom PWA Kit routing), Anda bangun atau supplement sitemap melalui sebuah API endpoint alih-alih. ada Tidak single automatic path — ini bergantung pada bagaimana storefront adalah siapkan. untuk PWA Kit deployments secara khusus, manual langkah sertakan menambahkan sebuah path di ssr.js config, updating ssrShared property, redeploying bundle, dan verifying sitemap adalah accessible. Salesforce’s own guidance adalah untuk schedule sebuah job untuk pertahankan sitemap saat ini — meaning Tidak automatic refresh pada catalog perubahan, unlike Hydrogen’s 24-hour auto-perbarui. dibangun-di sitemap menangani memiliki telah sebuah requested-tetapi-manual area pada PWA Kit GitHub repo — berguna color itu ini adalah sebuah known kesenjangan, though issue adalah community sinyal, tidak sebuah official statement.

Metadata — tied untuk halaman Designer. PWA Kit’s usePage() hook (dari @salesforce/commerce-sdk-react) dan <Page> component expose halaman name, deskripsi, dan route untuk SEO metadata — tetapi itu’s tied untuk Salesforce’s CMS-like halaman Designer konten model, tidak sebuah dedicated SEO utility like Hydrogen’s getSeoMeta.

Medusa, Saleor, dan Elastic Path — pure APIs

ini three adalah “leaves everything to you” (terjemahan) “leaves semuanya untuk Anda” tier, dan ini adalah worth menjadi blunt tentang apa itu berarti.

Medusa adalah sebuah pure commerce backend. ada Tidak dedicated Medusa SEO documentation karena Medusa memiliki Tidak opinion pada frontend rendering di semua. -nya Berikutnya.js Starter Storefront mendukung App Router dengan React server Components (so SSR adalah tersedia), tetapi metadata, sitemap, dan canonical mechanics adalah entirely inherited dari whatever Berikutnya.js conventions Anda implement. dalam praktik virtually setiap Medusa storefront adalah Berikutnya.js — so Berikutnya.js SEO artikel adalah Anda nyata reference, tidak Medusa’s docs.

Saleor adalah yang sama story: sebuah GraphQL-pertama headless API (Python/Django backend) dengan community dan Vercel-maintained Berikutnya.js storefront templates. SEO adalah 100% sebuah function dari chosen frontend. sama tier sebagai Medusa.

Elastic Path adalah API-pertama dengan metadata sebagai mentah fields Anda wire up yourself. -nya product dan category entities mendukung custom fields untuk SEO metadata itu dapat menjadi, di Elastic Path’s kata, “accessed via APIs just like the content that you render to your customers” (terjemahan) “accessed melalui APIs hanya like konten itu Anda render untuk Anda customers” — tetapi itu’s sebuah bangun-Anda-own-schema pattern, tidak sebuah shipped utility. -nya slug resource adalah described sebagai sebuah “lower case, uri friendly string” (terjemahan) “lebih rendah case, uri friendly string” untuk membangun URLs. Notably, Elastic Path’s own SEO untuk headless commerce blog post (oleh Kirsten Aebersold — vendor konten, tidak neutral) melakukan say “Jika Anda dynamically building a halaman dengan a JavaScript kerangka kerja alone, Anda mungkin ingin untuk look menjadi serving up cached versions dari itu halaman untuk itu bots” (terjemahan) “jika Anda’re dynamically membangun sebuah halaman dengan sebuah JavaScript kerangka kerja alone, Anda mungkin ingin untuk look ke serving up cached versi dari halaman untuk bot” — tetapi ini tidak pernah covers sitemaps, canonical tags, redirects, atau preview environments. Ketika bahkan vendor’s own SEO halaman skips half dari apa Anda perlu, “SEO-optimized out of the box” (terjemahan) “SEO-dioptimalkan out dari box” adalah melakukan sebuah lot dari berfungsi.

None dari ini three adalah buruk untuk SEO — ada Tidak platform ceiling. tetapi ada juga Tidak scaffolding untuk lean pada. Semuanya adalah sebuah function dari frontend Anda bangun.

Preview dan staging leakage — differentiated risk

ini adalah satu place platform pilihan membuat sebuah concrete, measurable SEO perbedaan, so ini adalah worth calling out secara terpisah.

Hydrogen/Oxygen secara otomatis melarang semua crawler pada deployment preview dan tautan yang dapat dibagikan—perlindungan bawaan agar situs staging Anda tidak terindeks dan bersaing dengan production sebagai konten duplikat. Tidak ada jaminan otomatis yang setara dalam dokumentasi Catalyst, commercetools, atau PWA Kit. Masalah ini bukan sekadar teori: 1Digital Agency melaporkan “Preview deployments indexed by Googlebot” (terjemahan) “Deployment preview yang diindeks Googlebot” sebagai kegagalan berulang dalam migrasi Catalyst di dunia nyata. Itu merupakan satu sumber praktisi, bukan pernyataan resmi platform, jadi perlakukan klaim khusus tentang Catalyst tersebut sebagai satu titik data yang kredibel. Namun, pelajaran dasarnya berlaku untuk semua platform: jika platform Anda tidak otomatis memblokir crawler preview, blokir sendiri (dengan larangan di robots.txt, autentikasi HTTP, atau header noindex pada setiap lingkungan non-production). Pada platform “everything-to-you” (terjemahan) “semuanya diserahkan kepada Anda”, tanggung jawab ini sepenuhnya berada pada Anda sesuai definisinya.

Redirect management — sebuah migration concern, tidak sebuah platform fitur

Tidak platform reviewed ships sebuah automatic redirect sistem. setiap headless migration — Stencil untuk Catalyst, monolith untuk headless, satu commerce mesin untuk lainnya — perlu sebuah jelas 301 map dari old URLs untuk baru. consensus di seluruh migration-focused trade posts adalah consistent: re-platforming failures hampir selalu trace back untuk redirect maps, struktur URL, dan structured-data gaps, dan Anda harus tidak pernah launch tanpa sebuah verified 301 map. itu’s yang sama lesson situs’s situs Migrations artikel covers di penuh — I’ll cross-reference ini untuk checklist alih-alih re-derive ini di sini. platform-spesifik angle adalah hanya ini: jangan assume apa pun dari ini mesin menangani redirects untuk Anda. None melakukan.

Portability adalah underrated upside

Satu myth worth killing: switching commerce platforms melakukan tidak berarti rebuilding Anda SEO dari scratch. rendering layer — Anda Berikutnya.js (atau React Router) storefront — adalah apa determines crawlability, dan ini adalah largely portable di seluruh commerce backends. sebuah Berikutnya.js storefront dapat poin di BigCommerce, Medusa, Saleor, atau commercetools dengan mostly data-layer perubahan. Apa perubahan ketika Anda tukar platforms adalah scaffolding: di mana sitemap data muncul dari, apakah ada sebuah metadata utility, bagaimana redirects dan previews adalah handled. itu’s sebuah bermakna re-wire, tetapi ini adalah tidak “mulai over.” (terjemahan) “mulai di atas.”

dan jangan di atas-indeks pada API quality sebagai sebuah SEO sinyal, either. sebuah platform’s GraphQL/REST API hanya determines apa data adalah tersedia untuk bangun metadata dan sitemaps dari. Apakah itu data sebenarnya reaches Google server-side adalah sebuah frontend/rendering decision — yang, again, hub owns.

Di mana untuk go berikutnya

• Headless Ecommerce SEO — hub: SSR/SSG/CSR rendering decision, data terstruktur (Product, ProductGroup/hasVariant), dan mengapa GMC feed adalah independent dari rendering.
• Berikutnya.js SEO — since Catalyst, commercetools Frontend, Medusa, dan Saleor storefronts adalah biasanya Berikutnya.js, ini adalah di mana generateMetadata dan sitemap.ts mechanics langsung.
• JavaScript SEO — umum JS-rendering failure modes itu apply untuk apa pun JS-berat storefront.

AI summary

sebuah condensed take pada Advanced versi:

• Platform pilihan ≠ rendering pilihan. Crawlability muncul dari frontend’s rendering model (SSR/SSG/CSR — owned oleh headless ecommerce hub). commerce platform decides bagaimana banyak SEO scaffolding Anda inherit.
• sebuah spectrum, three tiers:
• Ships nyata tooling: Shopify Hydrogen (getSeoMeta metadata utility, sitemap routes, robots.txt, auto preview-crawler blocking melalui Oxygen) dan BigCommerce Catalyst (sitemap proxied dari BigCommerce, Berikutnya.js generateMetadata conventions).
• Ships SDK helpers, tidak routes: commercetools Frontend (three-sitemap pattern melalui SDK metode, manual route wiring, 500-item pagination limit) dan Salesforce PWA Kit (sitemap path branches pada Business Manager vs. custom routing; manual scheduled regeneration).
• Ships tidak ada apa pun SEO-spesifik: Medusa, Saleor, Elastic Path — pure commerce APIs; Berikutnya.js frontend owns semua SEO.
• Metadata: Hydrogen’s getSeoMeta adalah satu-satunya shipped SEO-metadata utility (judul/deskripsi/image/canonical/JSON-LD). Everyone else exposes mentah API fields Anda wire ke generateMetadata yourself.
• Preview/staging leakage adalah sebuah nyata differentiator: Hydrogen/Oxygen auto-blocks crawler pada shareable tautan; Tidak equivalent jaminan untuk Catalyst, commercetools, atau PWA Kit (1Digital reports Catalyst previews getting terindeks di wild). Block them yourself jika platform tidak.
• Redirects adalah sebuah migration concern — Tidak platform automates sebuah 301 map; cross-reference situs Migrations artikel.
• Portability upside: Berikutnya.js frontend adalah largely reusable di seluruh backends; swapping platforms re-wires scaffolding, tidak Anda seluruh SEO.
• Myth untuk kill: “SEO-optimized out of the box” (terjemahan) “SEO-dioptimalkan out dari box” adalah sebuah spectrum — Elastic Path’s own SEO post tidak bahkan cover sitemaps, tag canonical, atau redirects.

Yang headless commerce platform (untuk SEO)?

ini walks SEO-scaffolding tradeoff, tidak business/pricing decision. pertanyaan di setiap node adalah “what do I want to inherit vs. build?” (terjemahan) “apa melakukan I ingin untuk inherit vs. bangun?”

Dokumentasi resmi

Utama-sumber platform documentation, per commerce mesin.

Shopify Hydrogen

• optimisasi mesin pencari untuk Hydrogen — getSeoMeta utility, canonical menangani, sitemap dan robots.txt routes, dan Oxygen preview-blocking perilaku.
• Hydrogen getSeoMeta utility — metadata helper’s inputs (judul, deskripsi, image, canonical, JSON-LD).
• Hydrogen getSitemap utility — per-resource-jenis sitemap generation dengan locale alternates.

BigCommerce Catalyst

• Catalyst Sitemap docs — bagaimana Catalyst proxies BigCommerce’s sitemap indeks. (ini URL moved dari developer.bigcommerce.com untuk docs.bigcommerce.com since ini artikel adalah drafted — verified 2026-07-19; old path 301s di sini.)

commercetools

• Sitemaps | Frontend Development — three-sitemap pattern, SDK metode (getPages, query, queryCategories), route handlers, dan 500-item pagination limit.

Salesforce Commerce Cloud (PWA Kit)

• meningkatkan SEO dengan sebuah Sitemap | Composable Storefront — Business-Manager-vs-custom-routing branch dan manual sitemap langkah.
• PWA Kit GitHub issue #1755 — tambahkan Sitemap menangani — community sinyal itu dibangun-di sitemap menangani memiliki telah sebuah manual kesenjangan.

Medusa / Saleor / Elastic Path

• Medusa Berikutnya.js Starter Storefront — App Router + React server Components; SEO inherited dari Anda Berikutnya.js implementation.
• Elastic Path — SEO untuk headless commerce situs web — vendor blog; berguna sebagai platform’s stated SEO position (note ini omits sitemaps/canonical/redirects).

Quotes dari sumber

Verbatim statements dari platform docs dan satu named practitioner. Deep tautan jump untuk quoted passage di mana sumber mendukung ini.

Shopify Hydrogen — metadata utility

• “Hydrogen uses Remix’s built-in meta features for SEO tags, and includes the getSeoMeta utility, which makes it easier and more consistent to render SEO meta tags.” (terjemahan) “Hydrogen menggunakan fitur meta bawaan Remix untuk tag SEO dan menyertakan utilitas getSeoMeta, sehingga rendering tag meta SEO menjadi lebih mudah dan konsisten.” — Shopify.dev, Hydrogen SEO docs. ini tepat kalimat adalah masih langsung pada doc, tetapi ini adalah stale: @shopify/hydrogen Tidak lebih lama bergantung pada Remix (ini peer-bergantung pada react-router ~7.16.0, dan @shopify/remix-oxygen adalah formally deprecated di favor dari react-router). getSeoMeta utility itself adalah accurate dan saat ini. Jump untuk quote
• “Oleh default Hydrogen removes query parameters dari canonical URLs.” (terjemahan) “oleh default Hydrogen menghapus kueri parameters dari canonical URLs.” — Shopify.dev, Hydrogen SEO docs.

Shopify Hydrogen — preview-crawler blocking

• “If you make a non-production deployment accessible with a shareable link or an auth bypass token, then Oxygen overrides the deployment’s robots.txt file with a disallow rule for all bots and crawlers.” (terjemahan) “Jika Anda membuat deployment nonproduksi yang dapat diakses melalui tautan yang bisa dibagikan atau token bypass autentikasi, Oxygen akan mengganti berkas robots.txt deployment tersebut dengan aturan disallow untuk semua bot dan crawler.” — Shopify.dev, Hydrogen SEO docs.

BigCommerce Catalyst — sitemap proxying

• “Catalyst acts as an intermediary when handling requests to /sitemap.xml.” (terjemahan) “Catalyst bertindak sebagai perantara ketika menangani permintaan ke /sitemap.xml.” — BigCommerce Developer Center, Catalyst Sitemap docs.
• “Jika Anda storefront juga menggunakan pihak ketiga sistem itu generate konten dengan berbeda URLs, Anda akan perlu untuk submit multiple sitemaps untuk cover itu URLs dari various sources.” (terjemahan) “jika Anda storefront juga menggunakan ketiga-party sistem itu generate konten dengan berbeda URLs, Anda akan perlu untuk submit multiple sitemaps untuk cover URLs dari various sources.” — BigCommerce Developer Center, Catalyst Sitemap docs.
• “The sitemaps don’t need to reside on the same domain as the website they represent.” (terjemahan) “ sitemaps jangan perlu untuk reside pada yang sama domain sebagai situs web mereka mewakili.” — BigCommerce Developer Center, Catalyst Sitemap docs.

Dan Kogan, 1Digital Agency (practitioner, Catalyst SEO)

• “Do not change established URLs on a Stencil-to-Catalyst migration. Every product, category, and content URL should match the legacy structure exactly, or you need a complete 301 redirect map.” (terjemahan) “Jangan ubah URL yang sudah mapan dalam migrasi Stencil ke Catalyst. Setiap URL produk, kategori, dan konten harus sama persis dengan struktur lama, atau Anda memerlukan peta pengalihan 301 yang lengkap.” Baca guide
• “Use generateMetadata and SSR-emitted JSON-LD for every PDP and PLP. Do not rely on client-side schema injection.” (terjemahan) “Gunakan generateMetadata dan JSON-LD yang dipancarkan SSR untuk setiap PDP dan PLP. Jangan mengandalkan injeksi schema sisi klien.” Baca guide

Elastic Path (vendor blog — treat sebagai platform’s stated position, tidak neutral)

• “Jika Anda dynamically building a halaman dengan a JavaScript kerangka kerja alone, Anda mungkin ingin untuk look menjadi serving up cached versions dari itu halaman untuk itu bots.” (terjemahan) “jika Anda’re dynamically membangun sebuah halaman dengan sebuah JavaScript kerangka kerja alone, Anda mungkin ingin untuk look ke serving up cached versi dari halaman untuk bot.” Baca post

Mistakes itu cost Anda

Concrete failure modes I’d periksa untuk pada apa pun headless commerce bangun.

Trusting “SEO-optimized out of the box” (terjemahan) “SEO-dioptimalkan out dari box” di face nilai. Mengapa ini adalah wrong: ini adalah sebuah spectrum, tidak sebuah jaminan. Hydrogen ships nyata scaffolding; Medusa, Saleor, dan Elastic Path ship tidak ada apa pun SEO-spesifik. Elastic Path’s own SEO blog post tidak bahkan mention sitemaps, tag canonical, atau redirects. melakukan alih-alih: tanyakan spesifik pertanyaan per platform — apa ships untuk sitemaps, metadata, redirects, dan preview-blocking? — dan budget gaps sebagai bangun berfungsi.

Assuming setiap platform mempertahankan staging out dari Google. Mengapa ini adalah wrong: hanya Hydrogen/Oxygen auto-blocks crawler pada preview/shareable deployments. ada Tidak terdokumentasi equivalent untuk Catalyst, commercetools, atau PWA Kit, dan setidaknya satu practitioner (1Digital Agency) reports Catalyst preview deployments getting terindeks oleh Googlebot di wild. (Single-sumber claim — treat sebagai satu credible data poin, tidak settled fact.) melakukan alih-alih: block non-production environments yourself — robots.txt disallow, HTTP auth, atau sebuah noindex header pada setiap preview/staging URL. tidak pernah assume platform melakukan ini.

Treating sebuah platform tukar sebagai “rebuild all SEO from scratch.” (terjemahan) “rebuild semua SEO dari scratch.” Mengapa ini adalah wrong: rendering layer (Anda Berikutnya.js/React Router frontend) adalah apa determines crawlability dan adalah largely portable di seluruh backends — sebuah Berikutnya.js storefront dapat poin di BigCommerce, Medusa, Saleor, atau commercetools dengan mostly data-layer perubahan. melakukan alih-alih: re-wire hanya scaffolding itu sebenarnya differs — sitemap data sumber, metadata utility, redirect menangani, preview-blocking. Reuse frontend.

Judging SEO oleh API quality. Mengapa ini adalah wrong: GraphQL/REST API hanya determines apa data adalah tersedia untuk bangun metadata dan sitemaps dari. Apakah itu data reaches Google bergantung pada server-side rendering — sebuah frontend decision, tidak sebuah API satu. melakukan alih-alih: evaluate rendering model (per hub) secara terpisah dari API. sebuah great API dengan sebuah CSR frontend masih ships empty HTML untuk crawler.

Skipping peta pengalihan pada migration. Mengapa ini adalah wrong: Tidak platform reviewed automates redirects. Re-platforming failures hampir selalu trace back untuk missing 301 maps, changed struktur URL, dan structured-data gaps. melakukan alih-alih: bangun dan verify sebuah menyelesaikan old-URL→baru-URL 301 map sebelum launch. pada Stencil→Catalyst secara khusus, pertahankan URLs identical atau map setiap satu. See situs Migrations artikel untuk checklist.

Letting Product JSON-LD render twice, atau client-side. Mengapa ini adalah wrong: 1Digital flags Product JSON-LD emitted twice (sebuah custom component plus sebuah ketiga-party app) dan generateMetadata returning sebuah client-hanya fallback karena GraphQL kueri mendapat thrown untuk sebuah client component — keduanya umum Catalyst regressions. melakukan alih-alih: emit satu server-dirender Product block per PDP, dan pertahankan generateMetadata kueri server-side. Validate dengan Rich hasil Test.

Platform SEO scaffolding — di sebuah glance

Apa setiap platform ships out dari box

Fast facts

• hanya Hydrogen ships sebuah dedicated SEO-metadata utility (getSeoMeta).
• hanya Hydrogen/Oxygen auto-blocks crawler pada preview/shareable deployments.
• Catalyst proxies BigCommerce’s sitemap — data lives di BigCommerce, tidak Anda app.
• commercetools sitemap kueri cap di 500 items/permintaan — besar catalogs perlu paging logic.
• Tidak platform ships automatic redirect management — sebuah 301 map adalah selalu Anda job.
• Platform pilihan = scaffolding; rendering model (SSR/SSG/CSR) = crawlability.

Three-tier summary

• Ships nyata tooling: Hydrogen, Catalyst
• Ships SDK helpers, tidak routes: commercetools, PWA Kit
• Ships tidak ada apa pun SEO-spesifik: Medusa, Saleor, Elastic Path

Headless platform SEO vetting checklist

Jalankan ini sebelum committing untuk sebuah platform, dan again sebelum launch.

Scaffolding audit (apa platform memberikan Anda)

• Confirmed apa ships untuk metadata — sebuah utility (Hydrogen) vs. mentah API fields Anda wire ke generateMetadata (everyone else).
• Confirmed bagaimana sitemap adalah produced — shipped route (Hydrogen), proxied (Catalyst), atau SDK/API Anda assemble (commercetools, PWA Kit, Medusa, Saleor, Elastic Path).
• untuk commercetools: pagination logic di sitemap generator untuk catalogs di atas 500 items per kueri.
• untuk PWA Kit: decided sitemap path (Business Manager vs. custom routing) dan scheduled sebuah regeneration job.
• Confirmed ada sebuah robots.txt route (atau dibangun satu).

Preview / staging safety

• pada Hydrogen: relying pada Oxygen’s automatic crawler-block — verified ini adalah active pada shareable tautan.
• pada setiap lainnya platform: explicitly blocked non-production environments (robots.txt disallow, HTTP auth, atau noindex header).
• diperiksa itu Tidak preview/staging URLs adalah saat ini terindeks (site: penelusuran pada preview domain).

rendering (owned oleh hub, tetapi verify per platform)

• curl-diperiksa sebuah product halaman — judul dan deskripsi present di mentah HTML (tidak CSR-hanya).
• Confirmed category/collection routes juga render server-side.

Migration / redirects

• Menyelesaikan old-URL → baru-URL 301 map dibangun dan verified.
• pada Stencil→Catalyst: URLs dipertahankan identical, atau setiap satu mapped.
• Product JSON-LD emitted setelah, server-side (Tidak double-emission dari sebuah ketiga-party app).

Verify apa sebuah headless store sebenarnya ships

seluruh poin dari ini artikel adalah “jangan trust itu vendor claim.” (terjemahan) “jangan trust vendor claim.” Di sini’s cara periksa claims yourself, per platform, pada sebuah langsung demo atau Anda own bangun.

adalah product halaman server-dirender? (shell)

jika product judul tidak di mentah HTML, halaman adalah CSR — Tidak platform scaffolding saves Anda dari itu.

# Product name should appear in the raw HTML, before any JS runs.
curl -s https://yourstore.example/products/some-slug | grep -i '<title>'
curl -s https://yourstore.example/products/some-slug | grep -o 'og:title[^>]*'

melakukan sitemap exist, dan di mana melakukan ini come dari? (shell)

# Hydrogen ships this route; Catalyst proxies it from BigCommerce; others may 404.
curl -sI https://yourstore.example/sitemap.xml
# Peek at the first URLs to confirm it's populated (not an empty shell).
curl -s https://yourstore.example/sitemap.xml | grep -o '<loc>[^<]*</loc>' | head

adalah preview/staging environment blocked? (shell)

Hydrogen-vs-everyone-else test. pada sebuah preview URL, Oxygen seharusnya mengembalikan disallow-semuanya robots.txt.

# On a preview/shareable deployment URL:
curl -s https://preview--yourstore.example/robots.txt
# Hydrogen/Oxygen preview: expect "User-agent: *  Disallow: /"
# If it returns your production robots.txt instead, previews can be indexed — block them.

temukan canonical + JSON-LD di dirender head (DevTools Console)

Paste ke Chrome DevTools Console pada apa pun PDP untuk see apakah canonical dan Product schema adalah sebenarnya di DOM (dan apakah Product JSON-LD adalah duplicated — sebuah umum Catalyst regression):

// Canonical URL the page declares:
document.querySelector('link[rel="canonical"]')?.href ?? '(no canonical)';

// Every JSON-LD block, parsed — watch for TWO Product blocks:
[...document.querySelectorAll('script[type="application/ld+json"]')]
  .map(s => { try { return JSON.parse(s.textContent); } catch { return s.textContent; } });

Satu-click canonical checker (bookmarklet)

Save sebagai sebuah bookmark; click ini pada apa pun product halaman untuk alert declared canonical dan bagaimana banyak Product JSON-LD blocks exist (2+ adalah sebuah masalah):

javascript:(()=>{const c=document.querySelector('link[rel="canonical"]')?.href||'(none)';const p=[...document.querySelectorAll('script[type="application/ld+json"]')].filter(s=>/"@type"\s*:\s*"Product"/.test(s.textContent)).length;alert('Canonical: '+c+'\nProduct JSON-LD blocks: '+p);})();

Extract setiap product URL dari sebuah proxied Catalyst sitemap (Python)

berguna ketika Anda perlu URL list untuk sebuah peta pengalihan atau sebuah audit:

import urllib.request, re

url = "https://yourstore.example/sitemap.xml"
xml = urllib.request.urlopen(url).read().decode("utf-8")
locs = re.findall(r"<loc>(.*?)</loc>", xml)
for loc in locs:
    print(loc)

Remember: sebuah curl itu menampilkan sebuah empty <title> atau sebuah missing sitemap tells Anda lebih daripada apa pun “SEO-optimized out of the box” (terjemahan) “SEO-dioptimalkan out dari box” claim pada sebuah pricing halaman.

alat untuk vetting sebuah headless platform

• curl / view-sumber — fastest “adalah ini sebenarnya server-dirender?” (terjemahan) “adalah ini sebenarnya server-dirender?” periksa. jika product judul tidak di mentah HTML, Tidak platform scaffolding penting namun.
• Google Search Console — pemeriksaan URL — “Test langsung URL” (terjemahan) “Test langsung URL” menampilkan bagaimana Googlebot renders sebuah diberikan product/category halaman dan apa canonical ini sees. sumber kebenaran di atas Anda template.
• Rich hasil Test — validate Product JSON-LD per PDP, dan catch double-emitted schema (sebuah umum Catalyst regression).
• Screaming Frog SEO Spider — crawl sebuah staging bangun untuk temukan missing canonicals pada paginated listings, orphaned routes, dan apakah preview URLs adalah reachable/dapat diindeks.
• Ahrefs situs Audit — surface duplicate konten, missing metadata, dan redirect-chain masalah di seluruh sebuah headless bangun di scale.
• site: penelusuran pada preview domain — crude-tetapi-effective test untuk apakah Anda staging environment memiliki sudah telah terindeks.

Kerangka kerja untuk comparing headless commerce platforms

dua-axis model: rendering dan scaffolding

Score storefront pada dua independent axes:

• rendering determines crawlability. SSR atau SSG seharusnya put product dan category konten di awal HTML; CSR dapat leave crawler dengan sebuah shell.
• Platform scaffolding determines apa Anda team harus bangun. Metadata plumbing, sitemap routes, robots.txt, preview blocking, dan redirect kepemilikan dapat ship, memerlukan assembly, atau menjadi absent.

sebuah platform dengan strong scaffolding dapat masih memiliki sebuah CSR implementation masalah. sebuah pure API platform dapat masih menjadi excellent untuk SEO ketika -nya frontend implements missing layer. tidak pernah collapse dua scores ke satu vendor claim.

inherit–bangun–operate model

Classify setiap SEO kemampuan sebelum platform selection:

platform decision adalah tidak hanya bangun effort. sebuah manual sitemap itu berfungsi pada launch masih membuat sebuah operating obligation ketika catalog size, locales, atau routing perubahan.

evidence ladder

Evaluate sebuah platform claim di ini order:

1. Mentah respons evidence: curl, respons headers, dan view-sumber tampilkan apa sebuah crawler menerima.
2. Route evidence: langsung sitemap, canonical, JSON-LD, dan robots.txt perilaku.
3. Environment evidence: production dan preview deployments behave differently di mana mereka seharusnya.
4. Vendor documentation: menjelaskan yang dimaksud perilaku, tetapi melakukan tidak prove implementation shipped correctly.
5. Marketing language: berguna hanya sebagai sebuah pertanyaan generator.

evidence ladder mempertahankan “SEO-ready” (terjemahan) “SEO-ready” dari substituting untuk sebuah testable acceptance criterion.

Post-implementation proof untuk sebuah headless platform

Product HTML dan canonical test

Test untuk jalankan: Fetch sebuah representative product URL dengan curl -s dan inspect mentah respons untuk -nya judul, product name, canonical, dan satu Product JSON-LD block.

Yang diharapkan hasil: product konten dan canonical adalah present sebelum JavaScript, dan persis satu server-dirender Product object ada.

Failure interpretation: route dapat memiliki fallen back untuk CSR, metadata dapat menjadi client-hanya, atau multiple schema producers adalah active.

Monitoring window: Immediate setelah setiap product-template atau data-fetching perubahan.

Rollback trigger: sebuah rilis menghapus dapat diindeks product konten dari mentah HTML atau duplicates product schema di seluruh tested template set.

Sitemap completeness test

Test untuk jalankan: Fetch sitemap indeks dan child files, lalu bandingkan sampled product dan category URLs dengan commerce catalog. untuk commercetools, sertakan products pada keduanya sides dari sebuah pagination boundary.

Yang diharapkan hasil: Published canonical URLs muncul setelah, kembalikan 200, dan newest catalog perubahan arrive pada platform’s terdokumentasi refresh cycle.

Failure interpretation: route adalah missing, sebuah sumber sitemap adalah tidak proxied, pagination berhenti early, atau sebuah scheduled generator adalah stale.

Monitoring window: setelah launch dan setelah apa pun catalog, locale, routing, atau sitemap job perubahan.

Rollback trigger: sebuah deployment drops sebuah material catalog bagian dari sitemap atau dimulai emitting non-canonical/failed URLs.

Preview-environment isolation test

Test untuk jalankan: permintaan sebuah nyata shareable preview URL’s robots.txt dan headers, lalu gunakan pemeriksaan URL atau sebuah external fetch tanpa authenticated cookies.

Yang diharapkan hasil: Non-production URLs adalah inaccessible untuk anonymous crawler atau carry sebuah environment-wide block; production tetap dapat di-crawl.

Failure interpretation: hosting preview safeguard adalah absent, applies hanya untuk satu preview pattern, atau production aturan leaked ke staging.

Monitoring window: Immediate untuk setiap deployment mode, including branch previews dan auth-bypass tautan.

Rollback trigger: sebuah publik preview mengembalikan dapat diindeks konten tanpa yang dimaksud block, atau perbaiki accidentally blocks production.

Migration redirect test

Test untuk jalankan: permintaan menyelesaikan old-URL inventory tanpa berikut redirects, lalu validate status dan Location terhadap approved map.

Yang diharapkan hasil: setiap changed legacy URL mengembalikan satu permanent redirect untuk -nya closest canonical replacement; dipertahankan URLs tetap 200.

Failure interpretation: platform tukar omitted sebuah aturan, introduced sebuah chain, atau changed sebuah URL itu adalah dimaksudkan untuk stay stable.

Monitoring window: sebelum cutover, immediately setelah cutover, dan selama pertama post-launch crawl reviews.

Rollback trigger: tinggi-nilai legacy URLs kembalikan 404, loop, chain, atau redirect untuk sebuah irrelevant destination.

Uji pemahaman Anda: Headless Commerce Platforms

Five quick pertanyaan pada bagaimana major headless commerce platforms differ untuk SEO. Pick sebuah jawaban untuk setiap, lalu periksa.

Resources worth Anda time

My related writing

• JavaScript SEO Issues & Best Practices — umum rendering failure modes (parity, interaction, state, timing) behind apa pun JS-berat headless storefront; verify-jangan-trust approach I apply untuk platform claims di sini.
• Beginner’s Guide untuk SEO teknis — di mana rendering dan crawlability sit di bigger picture.

My speaking

• Bagaimana Penelusuran berfungsi (SlideShare) — crawling, rendering, pengindeksan, dan peringkat, i.e. pipeline setiap satu dari ini platforms feeds ke. (My standing disclaimer applies: “Ini adalah my understanding dari sistem… tidak going untuk menjadi 100% menyelesaikan atau accurate.” (terjemahan) “ini adalah my understanding dari sistem… tidak going untuk menjadi 100% menyelesaikan atau accurate.”)

dari sekitar industry

• optimisasi mesin pencari untuk Hydrogen (Shopify.dev) — getSeoMeta utility, sitemap/robots routes, dan Oxygen preview-blocking perilaku, straight dari sumber.
• Catalyst Sitemap docs (BigCommerce Developer Center) — bagaimana Catalyst proxies BigCommerce’s sitemap indeks.
• Sitemaps | Frontend Development (commercetools) — three-sitemap SDK pattern dan 500-item pagination limit.
• meningkatkan SEO dengan sebuah Sitemap | Composable Storefront (Salesforce Developers) — Business-Manager-vs-custom-routing branch untuk PWA Kit.
• BigCommerce Catalyst SEO | Berikutnya.js Storefront Best Practices (Dan Kogan, 1Digital Agency) — satu deep practitioner piece pada Catalyst SEO: URL parity pada migration, generateMetadata regressions, double JSON-LD, dan preview-pengindeksan.
• SEO untuk headless commerce situs web (Kirsten Aebersold, Elastic Path) — vendor’s own SEO position (berguna sebagai sebuah case study di apa “out dari itu box” (terjemahan) “out dari box” leaves out — Tidak sitemap/canonical/redirect coverage).
• Best headless commerce platforms: 2026 perbandingan (Vendure) — sebuah broad business/tech-stack perbandingan dari platforms (dengan SEO axis notably missing, yang adalah kesenjangan ini artikel fills).
• Best Headless Commerce Platforms 2026 (Anda Berikutnya Store) — lainnya platform-selection perbandingan untuk cross-referencing non-SEO decision criteria.

Log perubahan