Meta Descriptions in Nuxt

Meta descriptions don't directly impact rankings. They affect click-through rates by giving users context about your page.

<meta name="description" content="Learn how to implement meta descriptions in Nuxt. Includes reactive content, SEO best practices, and social sharing tips.">

Quick Facts

1. Google can choose another passage: snippet guidance says snippets primarily come from page content. It may use your description when that better describes the page.
2. Length isn't fixed: Google truncates the snippet to fit the device width rather than a set character count (official guidance). Aim for roughly 150-160 characters and front-load the value, since mobile truncates sooner.
3. Template descriptions are lazy: "Buy at great prices" won't differentiate you. Summarize using AI tools if you're short on time.

Setting Meta Descriptions in Nuxt

Nuxt includes Unhead by default. Use useSeoMeta for type-safe descriptions:

useSeoMeta({
  description: 'Your description here'
})

Alternatively, useHead() gives you more control:

useHead({
  meta: [
    { name: 'description', content: 'Your description here' }
  ]
})

Dynamic Meta Descriptions

Use Nuxt's data fetching composables for reactive descriptions:

<script setup lang="ts">
const { data: post } = await useFetch('/api/post')

useSeoMeta({
  // computed getter syntax
  description: () => post.value?.description
})
</script>

Writing for AI & LLMs

Write descriptions that match the visible page. Google requires no special markup for its AI features. A description does not guarantee a citation or inclusion in an AI answer.

Open Graph Description 'og:description'

The Open Graph protocol defines og:description as an optional description for your object. Set explicit X metadata when you need separate copy, and test link previews on the target platform.

useSeoMeta({
  description: 'Technical description for search',
  ogDescription: 'More casual description for social sharing',
  twitterDescription: 'Description for X',
})

Testing tools:

• Facebook Sharing Debugger
• LinkedIn Post Inspector
• OpenGraph.xyz (tests Facebook, LinkedIn, Discord, X)

Nuxt SEO Module

Automates meta descriptions, titles, and social sharing:

A deployed description does not immediately replace a Google snippet. Google must recrawl and process the page, and it may select another passage.

Record the edit date and check the displayed result before comparing complete CTR periods. The reported serving timings do not predict when Google will use your description.

Checklist