Search

Optimizing SEO for Multilingual Websites

Technical SEO best practices for sites with multiple languages.

Admin1 min read
seoi18nperformance

Why SEO Matters for Multilingual Sites

Search engines need clear signals about language and regional targeting. A well-structured multilingual site can rank in multiple countries simultaneously.

Hreflang Tags

Hreflang tells Google which language version of a page to show:

<link rel="alternate" hreflang="en" href="https://example.com/en/about" />
<link rel="alternate" hreflang="id" href="https://example.com/id/about" />
<link rel="alternate" hreflang="x-default" href="https://example.com/about" />

This starter includes automatic hreflang generation via the hreflangLinks() function in src/lib/seo.ts.

Canonical URLs

Every page should have a self-referencing canonical URL:

export function canonicalUrl(locale: Locale, path: string): string {
  const prefix = localePrefix(locale);
  const normalized = path.replace(/\/$/, "");
  return `${SITE_CONFIG.url}${prefix}${normalized || ""}`;
}

Structured Data (JSON-LD)

Use jsonLdWebSite() for the home page and jsonLdBlogPost() for articles:

const websiteJsonLd = jsonLdWebSite({
  title: "My Site",
  description: "Site description",
  locale: "en",
  url: "https://example.com",
});

Sitemap

The @astrojs/sitemap integration generates a sitemap-index.xml that includes all locale variants of every page, ensuring search engines discover all language versions.

Performance Considerations

  • Static generation: Pages are pre-built, ensuring fast load times
  • CDN delivery: Cloudflare’s global network caches content at the edge
  • Core Web Vitals: Astro’s zero-JS architecture helps achieve good scores

Related posts