--- title: "Vue SEO Guide" description: "Meta tags, crawler control, rendering strategy, and Core Web Vitals for Vue apps, with a dedicated guide for each piece and where to start." canonical_url: "https://nuxtseo.com/learn-seo/vue" last_updated: "2026-10-05" --- ::key-takeaways - Check content, metadata, discovery links, and direct responses. Rendering mode alone does not guarantee indexing - [Good field INP is 200ms or less, and good LCP is 2.5s or less](https://web.dev/articles/vitals) at the 75th percentile - Unhead supports head management in Vue apps. Choose rendering, routing, and hosting integrations for your actual content :: Vue applications can serve static content, render on the server, generate pages at build time, or create views in the browser. Google can render JavaScript. Content that depends on the app still needs successful execution and available resources. This guide covers meta tags, crawler control, rendering strategy, and monitoring for Vue applications. Start with a representative page and verify its actual output, rather than treating SSR as a universal indexing fix. AI products use different crawler, retrieval, and search systems. Do not assume they all share a JavaScript limitation. For Google's AI features, [existing SEO practices still apply](https://developers.google.com/search/docs/appearance/ai-features); Google does not require extra AI files or special schema, and does not guarantee inclusion. Choose a [rendering mode](/learn-seo/vue/routes-and-rendering/rendering) that meets your content and freshness needs. Then check [metadata](/learn-seo/vue/mastering-meta), [crawler access](/learn-seo/vue/controlling-crawlers), and [field Core Web Vitals](/learn-seo/vue/launch-and-listen/core-web-vitals). Google uses Core Web Vitals in ranking systems, but [good scores do not guarantee top rankings](https://developers.google.com/search/docs/appearance/core-web-vitals). ## Content Sections **New to Vue SEO?** Start with [Mastering Meta](/learn-seo/vue/mastering-meta). It covers titles, descriptions, and the entity graph with Unhead. **Need a quick audit?** Use the [SEO Checklist](/learn-seo/checklist) to check INP, AI bot access, and schema validation. ### [Mastering Meta](/learn-seo/vue/mastering-meta) Provide metadata that describes your pages. Search presentation and AI inclusion depend on each system. | Guide | What You'll Learn | | -------------------------------------------------------------- | --------------------------------------------- | | [Titles](/learn-seo/vue/mastering-meta/titles) | Brand patterns and title templates | | [Descriptions](/learn-seo/vue/mastering-meta/descriptions) | Writing descriptions that earn the click | | [Social Sharing](/learn-seo/vue/mastering-meta/social-sharing) | OG image generation and Twitter Cards | | [Schema.org](/learn-seo/vue/mastering-meta/schema-org) | Structured data for entities and rich results | | [Rich Results](/learn-seo/vue/mastering-meta/rich-results) | Merchant listings and article snippets | ### [Controlling Crawlers](/learn-seo/vue/controlling-crawlers) Manage how search engines and LLMs discover and access your content. | Guide | What You'll Learn | | -------------------------------------------------------------------- | --------------------------------------------------- | | [robots.txt](/learn-seo/vue/controlling-crawlers/robots-txt) | Managing `User-agent: GPTBot` and standard crawlers | | [Sitemaps](/learn-seo/vue/controlling-crawlers/sitemaps) | XML sitemaps for dynamic content | | [Meta Tags](/learn-seo/vue/controlling-crawlers/meta-tags) | `noindex` strategies for thin content | | [Canonical URLs](/learn-seo/vue/controlling-crawlers/canonical-urls) | Preventing duplicate content issues | ### [SPA SEO](/learn-seo/vue/spa) Single page apps are viable for SEO, but need specific handling for crawlers and rendering. | Guide | What You'll Learn | | --------------------------------------------------------- | ------------------------------------------------- | | [Prerendering](/learn-seo/vue/spa/prerendering) | Generating static HTML at build time | | [Dynamic Rendering](/learn-seo/vue/spa/dynamic-rendering) | Why it's a workaround, not a fix | | [Hydration](/learn-seo/vue/spa/hydration) | Inspecting hydration mismatches and initial state | ### [SSR Frameworks](/learn-seo/vue/ssr-frameworks) SSR and static generation can expose public content in initial HTML. Choose an integration that fits your routing and data needs. | Guide | What You'll Learn | | ---------------------------------------------------- | --------------------------------- | | [Nuxt](/learn-seo/vue/ssr-frameworks/nuxt-vs-quasar) | Comparing Nuxt and Quasar | | [Vite SSR](/learn-seo/vue/ssr-frameworks/vite-ssr) | Custom SSR implementations | | [VitePress](/learn-seo/vue/ssr-frameworks/vitepress) | Built for documentation and blogs | ### [Routes & Rendering](/learn-seo/vue/routes-and-rendering) Plan URL identities, discovery paths, and the content in each response. | Guide | What You'll Learn | | ------------------------------------------------------------------ | ------------------------------------------ | | [URL Structure](/learn-seo/vue/routes-and-rendering/url-structure) | Clean, semantic URL patterns | | [Pagination](/learn-seo/vue/routes-and-rendering/pagination) | Handling deep paginated content | | [i18n](/learn-seo/vue/routes-and-rendering/i18n) | `hreflang` implementation for global reach | | [Rendering Modes](/learn-seo/vue/routes-and-rendering/rendering) | ISR vs SSR vs SSG trade-offs | ### [Launch & Listen](/learn-seo/vue/launch-and-listen) Deploy, verify, and monitor your search performance. | Guide | What You'll Learn | | ------------------------------------------------------------------- | ------------------------------------------- | | [Core Web Vitals](/learn-seo/vue/launch-and-listen/core-web-vitals) | Optimizing INP and LCP | | [Search Console](/learn-seo/vue/launch-and-listen/search-console) | Monitoring indexing and clicks | | [Indexing Issues](/learn-seo/vue/launch-and-listen/indexing-issues) | Debugging "Crawled - currently not indexed" | ## A Vue SEO Setup [Install Unhead and its Vue plugin](/learn-seo/vue/mastering-meta) before calling its composables. This component-setup excerpt supplies static metadata; it does not configure routing or serve a page: ```vue ``` Nuxt uses the same head-management foundation. Installed and configured SEO modules can add sitemaps, robots rules, structured data, and OG images. See the [Nuxt SEO guide](/learn-seo/nuxt) if you're starting a new project. ## Common Mistakes to Avoid - **Blocking CSS/JS in robots.txt**: Google renders your page with headless Chrome and needs those assets to do it. - **Ignoring layout shift**: reserve space for images and dynamic content. A loading component alone does not guarantee stable layout. - **Lazy-loading the LCP image**: avoid delaying the image that drives LCP. Measure discovery and loading priority on the actual page. - **Discarding meaningful URL differences**: use canonicals for duplicate or near-identical content. Keep query values that identify distinct content. ## External Resources - [Google Search Central: JavaScript SEO](https://developers.google.com/search/docs/crawling-indexing/javascript/javascript-seo-basics) - [Unhead Documentation](https://unhead.unjs.io/) - [web.dev: Interaction to Next Paint](https://web.dev/articles/inp) ## Sitemap See the full [sitemap](/sitemap.md) for all pages.