Quartzo

A SvelteKit library focused on SEO and GEO optimization.

npm install quartzo

Add this skill to your AI agent to auto-configure SEO

How to Use

Practical integration examples for your SvelteKit project.

Load metadata on the server to ensure dynamic SEO and proper SSR.

+page.server.ts

export const load = async () => {
  return {
    seo: {
      title: 'My Awesome Article',
      description: 'A complete guide on Svelte 5 and SEO.',
      url: '/blog/my-article',
      image: '/images/cover.jpg',
      imageAlt: 'Article cover with Svelte logo',
      publishedDate: '2026-02-22T10:00:00Z',
      tags: ['Svelte', 'SEO', 'Web Development'],
      breadcrumbs: [
        { name: 'Blog', url: '/blog' },
        { name: 'My Awesome Article', url: '/blog/my-article' }
      ],
      alternates: [
        { hreflang: 'pt-BR', href: '/blog/my-article' },
        { hreflang: 'en-US', href: '/en/blog/my-article' }
      ]
    }
  };
};

Frequently Asked Questions

Essential concepts to understand the library's impact on your project.

Simply run `npm install quartzo` in your SvelteKit project terminal. The library is compatible with Svelte 5 and SvelteKit 2.

SEO (Search Engine Optimization) is the set of practices that help search engines understand and index your pages. The goal is to increase organic visibility through useful content, performance, and consistent metadata.

GEO (Generative Engine Optimization) focuses on making content easy to understand and cite by AI assistants. Beyond traditional SEO, it prioritizes structure, data (Schema.org), clarity, context, and consistency in titles, descriptions, and entities.

They are the primary signals summarizing your content. They influence understanding, presentation in results, and click-through rate. On sites with many pages, keeping these consistent and unique per page is essential.

It is the "official" URL of a page. It prevents duplicate content when the same content can be accessed through different URLs (parameters, trailing slashes, etc.).

Open Graph defines how your page appears when shared (e.g., on WhatsApp, LinkedIn). It includes title, description, image, and content type.

They are specific meta tags to improve link previews on X (Twitter). Typically uses "summary_large_image" when an image exists to maximize readability.

It is a structured data format that describes what the page is (article, profile, creative work). It helps search engines and AIs understand entities, authors, dates, and topics reliably.

They allow you to control indexing. Useful for thin variations or pages you don't want in search results. "noindex" asks search engines not to index the page; "nofollow" reduces signal transmission through links.

It indicates alternative versions by language/region, preventing cannibalization between translated pages. It helps search engines deliver the correct version to the user.

They are hierarchical links (Home → Category → Page) that improve navigation and help search engines understand the site structure. They can also be sent as structured data.

With SSR, the initial HTML already contains the meta tags and base content, making indexing easier. In SvelteKit, this is the default and is recommended for content-driven sites.