[{"data":1,"prerenderedAt":411},["ShallowReactive",2],{"blog-nuxt-3-seo":3},{"id":4,"title":5,"body":6,"date":395,"description":396,"extension":397,"image":398,"isoDate":399,"meta":400,"navigation":401,"path":402,"readTime":403,"seo":404,"seoTitle":405,"stem":406,"tags":407,"__hash__":410},"content\u002Fblog\u002Fnuxt-3-seo.md","Nuxt 3 SEO Optimization Guide",{"type":7,"value":8,"toc":381},"minimark",[9,13,16,21,24,33,47,166,169,176,197,202,212,218,232,238,258,339,342,346,349,367,371,377],[10,11,12],"p",{},"Search Engine Optimization (SEO) is no longer an afterthought; it's a critical feature for any web application. With Nuxt 3, building SEO-friendly applications has never been easier, thanks to its powerful server-side rendering (SSR) capabilities and a robust ecosystem of modules.",[10,14,15],{},"In this guide, we'll explore how to maximize your Nuxt 3 app's visibility using essential SEO tools and techniques.",[17,18,20],"h2",{"id":19},"_1-the-foundation-server-side-rendering-ssr","1. The Foundation: Server-Side Rendering (SSR)",[10,22,23],{},"Search engines like Google can crawl client-side rendered (CSR) applications, but SSR guarantees that your content is immediately available when the crawler hits your page. Nuxt 3 supports hybrid rendering, allowing you to use SSR for content-heavy pages (like blogs or marketing pages) while keeping other parts highly interactive.",[17,25,27,28,32],{"id":26},"_2-meta-tags-and-the-usehead-composable","2. Meta Tags and the ",[29,30,31],"code",{},"useHead"," Composable",[10,34,35,36,38,39,42,43,46],{},"Nuxt 3 provides the ",[29,37,31],{}," and ",[29,40,41],{},"useServerSeoMeta"," composables to dynamically manage your ",[29,44,45],{},"\u003Chead>"," tags.",[48,49,54],"pre",{"className":50,"code":51,"language":52,"meta":53,"style":53},"language-vue shiki shiki-themes github-light github-dark","\u003Cscript setup>\nuseServerSeoMeta({\n  title: 'My Awesome Page',\n  ogTitle: 'My Awesome Page',\n  description: 'This is my awesome page description.',\n  ogDescription: 'This is my awesome page description.',\n  ogImage: 'https:\u002F\u002Fexample.com\u002Fimage.png',\n  twitterCard: 'summary_large_image',\n})\n\u003C\u002Fscript>\n","vue","",[29,55,56,76,84,97,107,118,128,139,150,156],{"__ignoreMap":53},[57,58,61,65,69,73],"span",{"class":59,"line":60},"line",1,[57,62,64],{"class":63},"sVt8B","\u003C",[57,66,68],{"class":67},"s9eBZ","script",[57,70,72],{"class":71},"sScJk"," setup",[57,74,75],{"class":63},">\n",[57,77,79,81],{"class":59,"line":78},2,[57,80,41],{"class":71},[57,82,83],{"class":63},"({\n",[57,85,87,90,94],{"class":59,"line":86},3,[57,88,89],{"class":63},"  title: ",[57,91,93],{"class":92},"sZZnC","'My Awesome Page'",[57,95,96],{"class":63},",\n",[57,98,100,103,105],{"class":59,"line":99},4,[57,101,102],{"class":63},"  ogTitle: ",[57,104,93],{"class":92},[57,106,96],{"class":63},[57,108,110,113,116],{"class":59,"line":109},5,[57,111,112],{"class":63},"  description: ",[57,114,115],{"class":92},"'This is my awesome page description.'",[57,117,96],{"class":63},[57,119,121,124,126],{"class":59,"line":120},6,[57,122,123],{"class":63},"  ogDescription: ",[57,125,115],{"class":92},[57,127,96],{"class":63},[57,129,131,134,137],{"class":59,"line":130},7,[57,132,133],{"class":63},"  ogImage: ",[57,135,136],{"class":92},"'https:\u002F\u002Fexample.com\u002Fimage.png'",[57,138,96],{"class":63},[57,140,142,145,148],{"class":59,"line":141},8,[57,143,144],{"class":63},"  twitterCard: ",[57,146,147],{"class":92},"'summary_large_image'",[57,149,96],{"class":63},[57,151,153],{"class":59,"line":152},9,[57,154,155],{"class":63},"})\n",[57,157,159,162,164],{"class":59,"line":158},10,[57,160,161],{"class":63},"\u003C\u002F",[57,163,68],{"class":67},[57,165,75],{"class":63},[10,167,168],{},"This approach ensures that social sharing cards (Twitter, Facebook, LinkedIn) look professional and engaging.",[17,170,172,173],{"id":171},"_3-automating-with-nuxtjsseo","3. Automating with ",[29,174,175],{},"@nuxtjs\u002Fseo",[10,177,178,179,181,182,185,186,185,189,192,193,196],{},"Instead of managing everything manually, the ",[29,180,175],{}," suite (which includes ",[29,183,184],{},"nuxt-seo-utils",", ",[29,187,188],{},"nuxt-schema-org",[29,190,191],{},"@nuxtjs\u002Fsitemap",", and ",[29,194,195],{},"@nuxtjs\u002Frobots",") is a game-changer.",[198,199,201],"h3",{"id":200},"sitemap-generation","Sitemap Generation",[10,203,204,205,208,209,211],{},"A ",[29,206,207],{},"sitemap.xml"," helps search engines discover all your pages. With ",[29,210,191],{},", your sitemap is generated automatically based on your routes.",[198,213,215],{"id":214},"robotstxt",[29,216,217],{},"robots.txt",[10,219,220,221,223,224,227,228,231],{},"The ",[29,222,195],{}," module allows you to fine-tune which pages search engines should and shouldn't index. For example, you can block the ",[29,225,226],{},"\u002Fadmin"," routes easily from your ",[29,229,230],{},"nuxt.config.ts",".",[198,233,235,236],{"id":234},"structured-data-with-nuxt-schema-org","Structured Data with ",[29,237,188],{},[10,239,240,241,243,244,185,247,185,250,253,254,257],{},"Structured data (JSON-LD) translates your content into a language search engines understand natively. Using ",[29,242,188],{},", you can define a ",[29,245,246],{},"Person",[29,248,249],{},"Organization",[29,251,252],{},"Article",", or ",[29,255,256],{},"WebSite"," seamlessly:",[48,259,263],{"className":260,"code":261,"language":262,"meta":53,"style":53},"language-ts shiki shiki-themes github-light github-dark","\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n  schemaOrg: {\n    identity: definePerson({\n      name: 'Saymon Arefin Akash',\n      url: 'https:\u002F\u002Fexample.com',\n      \u002F\u002F ...\n    })\n  }\n})\n","ts",[29,264,265,271,285,290,300,310,320,325,330,335],{"__ignoreMap":53},[57,266,267],{"class":59,"line":60},[57,268,270],{"class":269},"sJ8bj","\u002F\u002F nuxt.config.ts\n",[57,272,273,277,280,283],{"class":59,"line":78},[57,274,276],{"class":275},"szBVR","export",[57,278,279],{"class":275}," default",[57,281,282],{"class":71}," defineNuxtConfig",[57,284,83],{"class":63},[57,286,287],{"class":59,"line":86},[57,288,289],{"class":63},"  schemaOrg: {\n",[57,291,292,295,298],{"class":59,"line":99},[57,293,294],{"class":63},"    identity: ",[57,296,297],{"class":71},"definePerson",[57,299,83],{"class":63},[57,301,302,305,308],{"class":59,"line":109},[57,303,304],{"class":63},"      name: ",[57,306,307],{"class":92},"'Saymon Arefin Akash'",[57,309,96],{"class":63},[57,311,312,315,318],{"class":59,"line":120},[57,313,314],{"class":63},"      url: ",[57,316,317],{"class":92},"'https:\u002F\u002Fexample.com'",[57,319,96],{"class":63},[57,321,322],{"class":59,"line":130},[57,323,324],{"class":269},"      \u002F\u002F ...\n",[57,326,327],{"class":59,"line":141},[57,328,329],{"class":63},"    })\n",[57,331,332],{"class":59,"line":152},[57,333,334],{"class":63},"  }\n",[57,336,337],{"class":59,"line":158},[57,338,155],{"class":63},[10,340,341],{},"This increases your chances of appearing in Rich Snippets and Google's Knowledge Graph.",[17,343,345],{"id":344},"_4-performance-is-seo","4. Performance is SEO",[10,347,348],{},"Google Core Web Vitals directly impact your ranking. To ensure top-tier performance:",[350,351,352,360],"ul",{},[353,354,355,356,359],"li",{},"Use ",[29,357,358],{},"@nuxt\u002Fimage"," to automatically serve optimized formats like WebP or AVIF.",[353,361,362,363,366],{},"Utilize ",[29,364,365],{},"nuxt-delay-hydration"," to delay loading Vue until the user interacts, bringing your First Input Delay (FID) and Total Blocking Time (TBT) down to zero.",[17,368,370],{"id":369},"conclusion","Conclusion",[10,372,373,374,376],{},"By combining Nuxt 3's native SSR with the ",[29,375,175],{}," module suite, you provide search engines with highly structured, lightning-fast, and easily digestible content. Optimize your meta tags, utilize JSON-LD, and watch your organic traffic grow.",[378,379,380],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}",{"title":53,"searchDepth":78,"depth":78,"links":382},[383,384,386,393,394],{"id":19,"depth":78,"text":20},{"id":26,"depth":78,"text":385},"2. Meta Tags and the useHead Composable",{"id":171,"depth":78,"text":387,"children":388},"3. Automating with @nuxtjs\u002Fseo",[389,390,391],{"id":200,"depth":86,"text":201},{"id":214,"depth":86,"text":217},{"id":234,"depth":86,"text":392},"Structured Data with nuxt-schema-org",{"id":344,"depth":78,"text":345},{"id":369,"depth":78,"text":370},"Sep 12, 2024","Learn how to use server-side rendering, the useHead composable, nuxt-seo-utils, Schema.org, sitemaps, and robots.txt to make your Nuxt 3 app rank higher.","md",null,"2024-09-12",{},true,"\u002Fblog\u002Fnuxt-3-seo","8 min read",{"title":5,"description":396},"Nuxt 3 SEO Guide","blog\u002Fnuxt-3-seo",[408,409],"Nuxt","SEO","mhqciPkBTTMcjAVlwll0Sv0H3m3cqsxN4yM3gP-3i58",1785350182148]