> ## Documentation Index
> Fetch the complete documentation index at: https://lovable.generaltranslation.app/llms.txt
> Use this file to discover all available pages before exploring further.
# Implement SEO and GEO best practices
> A practical guide to optimizing your Lovable apps for search engines, social media previews, and AI systems using metadata, sitemaps, structured data, performance checks, and LLM-friendly patterns.
## How SEO and GEO work in Lovable
Lovable gives you a lot of flexibility: **Search Engine Optimization (SEO)** and **Generative Engine Optimization (GEO)** emerge from the code the Lovable Agent generates when you create pages, content, and features.
The Agent may add elements like titles, descriptions, or tags based on your prompts, but this isn't systematic and **doesn’t guarantee full or correct implementation.**
Because of this, you should **treat SEO and GEO like code**: something you intentionally review, test, and refine. This guide shows you exactly what to ask for and how to verify it.
### Built-in Speed tool
Lovable also includes a **built-in Speed tool powered by Google Lighthouse**. It provides a quick snapshot of your published site’s performance, accessibility, best practices, and SEO checks.
It’s a great first look at your site’s health, but Lighthouse doesn’t verify critical factors like crawlability, structured data, metadata accuracy, or social previews, so this guide fills in those gaps.
### Custom domains
Using a **custom domain** is one of the most important steps for SEO and GEO. A branded domain helps search engines understand your site, preserves backlink value over time, and ensures all traffic consolidates under a single canonical URL.
Lovable lets you:
* Connect your own domain or subdomain
* Choose one **primary domain** (all other domains redirect to it)
After setting up your custom domain, [**verify it in Google Search Console**](#google-search-console-gsc-setup) so Google can crawl and index the correct domain. For detailed setup instructions, see [**Custom domains**](/features/custom-domain).
## Understanding Lovable’s architecture
Lovable builds modern web applications using React and Vite, meaning your app is a **client-side rendered (CSR)** **single-page application (SPA)**. Instead of serving a different HTML file for every page, the browser loads a small initial HTML shell and then handles routing and rendering with JavaScript.
**Traditional platforms** like WordPress or Webflow send the browser a fully assembled HTML page for each URL.
**Lovable** sends code and instructions that your device uses to build each view. All “pages” are really just different states of the same application.
For visitors, this means fast navigation, instant transitions, seamless experience.
### What this means for SEO and GEO
For **search engines, social platforms, and AI crawlers**, the architecture changes how your content is discovered.
**Google and traditional search engines:**
Google can index CSR sites, but it happens in two stages:
1. **Crawl the initial HTML** and collect your page structure
2. **Return later to render JavaScript (JS)** and capture the full content
This two-step process works reliably, but:
* Indexing can take **a bit longer** (days instead of hours)
* Fresh pages may appear later in results
* It **does not harm rankings**, only indexing speed
**Social media platforms and AI systems:**
* Platforms like **Facebook, X/Twitter, and LinkedIn** do not wait for content to render, so they only see the initial HTML page structure.
* If all your pages share the same basic title and preview image, social links may show generic or incorrect information
* Many **AI systems** don't reliably see dynamically rendered content, so they may miss your pages or only see partial content
**Modern search engines handle CSR well.** CSR does not block indexing or ranking, implementation and content quality matter most.
Follow the best practices in this guide to **ensure your Lovable site is optimized for search engines, social platforms, and AI systems and can compete effectively.**
## Foundation: Make your site crawlable
These steps ensure search engines can access, discover, and index all the important pages of your Lovable app.
### XML sitemap
Sitemaps help search engines discover all your pages. This is especially important for CSR sites where crawlers can't easily find all routes. Lovable Agent can generate `sitemap.xml` with all public routes when requested.
**Example prompt**
> Create XML sitemap at /sitemap.xml listing all public routes. Include lastmod dates and priorities: homepage 1.0, main pages 0.8, blog posts 0.6.
**Verify**
* Publish your project so the sitemap file is live
* Check that it is accessible at: `https://yourdomain.com/sitemap.xml` (should return XML)
* Check all key routes included (home, main pages, blog, products)
* Update `lastmod` whenever content changes
* Use `priority` to indicate importance (0.0–1.0)
* Submit to Google Search Console and Bing Webmaster Tools
* Regenerate and resubmit when adding/removing pages (not automatic). For example, prompt:
> Update sitemap.xml to include /new-page and remove /old-page then resubmit to Google Search Console.
**Example sitemap.xml**
```
https://yourdomain.com/2025-01-151.0https://yourdomain.com/about2025-01-150.8
```
### Robots.txt
`robots.txt` tells search engines which areas of your site they’re allowed to crawl. It’s important to avoid blocking key resources that Google needs to render your pages correctly. Lovable Agent can create a `robots.txt` file when requested.
**Example prompt**
> Create robots.txt at /public/robots.txt that allows all crawlers, references Sitemap: [https://yourdomain.com/sitemap.xml](https://yourdomain.com/sitemap.xml), and allows GPTBot and PerplexityBot for AI visibility.
**Verify**
* Check that it is accessible at: `https://yourdomain.com/robots.txt`
* Never block CSS, JavaScript, or `/assets/` folder
* Includes `Sitemap:` line pointing to your sitemap
* Controls AI bot access (GPTBot, PerplexityBot) based on your strategy
**Example robots.txt**
```
User-agent: *
Allow: /
Sitemap: https://yourdomain.com/sitemap.xml
User-agent: GPTBot
Allow: /
```
### Canonical tags
Canonical tags tell search engines which URL is the “official” version of a page, helping prevent duplicate content issues. Lovable Agent can generate canonical tags when requested.
**Example prompt**
> Add canonical tags to all pages pointing to their own URLs. Use [https://yourdomain.com](https://yourdomain.com) format with no trailing slash.
**Verify**
* Check each page. Paste this in the browser console:
```
console.log('Canonical:', document.querySelector('link[rel="canonical"]')?.href);
```
* Confirm **exactly one** canonical tag exists per page.
* Make sure it matches your preferred domain and URL variant (HTTPS, trailing slash).
* Avoid pointing different pages to the same canonical unless it’s intentional (for example, filtered product views).
### Clean URLs and routing
Search engines rely on URLs to understand what a page is about, so clean and descriptive URLs help improve both crawlability and rankings. Lovable Agent typically generates clean routes automatically through React Router.
**Example prompt**
> Review all routes and make sure URLs are clean and descriptive. Use hyphens for word separation and avoid query parameters.
**Verify**
* Navigate to each route and check browser console for errors
* URLs should be: stable, descriptive, no random IDs
* Consistent format site-wide (trailing slash or not, `www` or not)
* All routes load without JavaScript errors
### Internal linking
Internal links connect your pages so both users and search engines can navigate your site easily. Search engines rely on these links to discover content, understand topic relationships, and distribute page authority across your site.
Lovable Agent can create nav/footer links and suggest or create contextual links when requested.
**Example prompt**
> Add 3-5 contextual internal links to related pages. Use descriptive anchor text instead of "click here".
**Verify**
* Check that links are crawlable. The number should roughly match what you expect based on your navigation and content.
```
console.log('Links:', document.querySelectorAll('a[href]').length);
```
* Use real `` tags, not `onClick` handlers
* Important pages have multiple internal links pointing to them
* Include links to your most important pages in the footer so they appear site-wide
* Anchor text is descriptive with keywords (not "click here")
* Good anchor text: `organic dog food benefits`
* Bad anchor text: `click here`, `read more`
* Deep pages reachable within 3 clicks from homepage
## On-page SEO: Help search engines understand content
These practices clarify what each page is about, making your content easier for search engines to interpret and rank accurately.
### Page titles
Page titles are a critical on-page ranking factor. They show up in search results and browser tabs, and they have a strong impact on click-through rates. Lovable Agent can generate title tags based on your page’s purpose.
**Example prompt**
> Update the page titles for all routes. Use clear, descriptive titles that match each page’s purpose, and keep them under 60 characters.
**Verify**
* Check title content and length for each page. Paste this in the browser console:
```
console.log('Title:', document.title, '| Length:', document.title.length);
```
* Each route has unique, descriptive title (not generic `Home` everywhere)
* Under 60 characters to avoid truncation
* Includes primary keyword plus brand name
### Meta descriptions
Meta descriptions appear in search results just below the page title. They are not a direct ranking factor, but they have a strong influence on click-through rates. Lovable Agent can add meta descriptions when requested.
**Example prompt**
> Write unique meta descriptions for all key pages. Keep each one clear, helpful, and between 140–160 characters.
**Verify**
* Check description and length for each page. Paste this in the browser console:
```
console.log('Desc:', document.querySelector('meta[name="description"]')?.content, '| Length:', document.querySelector('meta[name="description"]')?.content.length);
```
* Each page has unique description (**140-160 characters**)
* Bad: `Welcome to our website `(generic, repeated)
* Good: `Premium organic dog food delivered fresh to your door. Free shipping over $50.` (158 chars)
* Highlights benefits, differentiation, and a soft call to action
* Not duplicated across pages
### Heading structure (H1 → H3)
A clear heading structure (H1 to H3) helps search engines understand how your content is organized and which sections are most important. Lovable Agent can generate proper H1 tags and a logical hierarchy when requested.
**Example prompt**
> Review the heading structure on each page. There should be one H1 at the top, with H2 for major sections and H3 for nested content. Don’t skip heading levels.
**Verify**
* Check there is only one H1 tag. Paste this in the browser console - should return 1:
```
console.log('H1s:', document.querySelectorAll('h1').length);
```
* View heading content. Paste this in the browser console:
```
console.log('H1:', document.querySelector('h1')?.textContent);
```
* H1 includes primary keyword and states page purpose
* Headings flow logically (H1 → H2 → H3, never skip levels)
* Headings are not used purely for styling
### Semantic HTML
Semantic HTML uses meaningful tags to describe your content, helping both search engines and screen readers understand the structure of your page. Lovable Agent typically adds semantic elements such as ``, `
It’s a great first look at your site’s health, but Lighthouse doesn’t verify critical factors like crawlability, structured data, metadata accuracy, or social previews, so this guide fills in those gaps.
### Custom domains
Using a **custom domain** is one of the most important steps for SEO and GEO. A branded domain helps search engines understand your site, preserves backlink value over time, and ensures all traffic consolidates under a single canonical URL.
Lovable lets you:
* Connect your own domain or subdomain
* Choose one **primary domain** (all other domains redirect to it)
After setting up your custom domain, [**verify it in Google Search Console**](#google-search-console-gsc-setup) so Google can crawl and index the correct domain. For detailed setup instructions, see [**Custom domains**](/features/custom-domain).
## Understanding Lovable’s architecture
Lovable builds modern web applications using React and Vite, meaning your app is a **client-side rendered (CSR)** **single-page application (SPA)**. Instead of serving a different HTML file for every page, the browser loads a small initial HTML shell and then handles routing and rendering with JavaScript.
**Traditional platforms** like WordPress or Webflow send the browser a fully assembled HTML page for each URL.
**Lovable** sends code and instructions that your device uses to build each view. All “pages” are really just different states of the same application.
For visitors, this means fast navigation, instant transitions, seamless experience.
### What this means for SEO and GEO
For **search engines, social platforms, and AI crawlers**, the architecture changes how your content is discovered.
**Google and traditional search engines:**
Google can index CSR sites, but it happens in two stages:
1. **Crawl the initial HTML** and collect your page structure
2. **Return later to render JavaScript (JS)** and capture the full content
This two-step process works reliably, but:
* Indexing can take **a bit longer** (days instead of hours)
* Fresh pages may appear later in results
* It **does not harm rankings**, only indexing speed
**Social media platforms and AI systems:**
* Platforms like **Facebook, X/Twitter, and LinkedIn** do not wait for content to render, so they only see the initial HTML page structure.
* If all your pages share the same basic title and preview image, social links may show generic or incorrect information
* Many **AI systems** don't reliably see dynamically rendered content, so they may miss your pages or only see partial content
**Modern search engines handle CSR well.** CSR does not block indexing or ranking, implementation and content quality matter most.
Follow the best practices in this guide to **ensure your Lovable site is optimized for search engines, social platforms, and AI systems and can compete effectively.**
## Foundation: Make your site crawlable
These steps ensure search engines can access, discover, and index all the important pages of your Lovable app.
### XML sitemap
Sitemaps help search engines discover all your pages. This is especially important for CSR sites where crawlers can't easily find all routes. Lovable Agent can generate `sitemap.xml` with all public routes when requested.