` | `Your App` (older projects: `Vibely App`) | No, placeholder | | `description` | `Replace this with a one-sentence description of your app.` (older projects: `Vibely Generated Project`) | No, placeholder | | `og:title` / `og:description` | The same two placeholders | No, placeholder | | `og:type` | `website` | Yes | | `twitter:card` | `summary` | Partly: shows a small thumbnail, not a full-width image | | `og:image` | Missing | No: shared links show a grey card | | `canonical` | Missing | No: different URLs for the same page compete | | `viewport`, `charSet` | Set correctly | Yes | | `public/robots.txt` | Allows Googlebot, Bingbot, Twitterbot, facebookexternalhit and all others | Partly: no `Sitemap:` line, no AI crawlers named | | `public/sitemap.xml` | Missing | No | | Structured data (JSON-LD) | Missing | No | <Warning> The placeholders appear in every search result, browser tab and shared link until you replace them. The fastest fix is **Website info** in the Publish dialog (below); for per-page titles, ask Vibely in chat. </Warning> ### Website info and your app's own tags The **Website info** title and description in the [Publish dialog](/features/deploy/publish#the-publish-dialog-step-by-step) are your site-wide defaults. When you publish, Vibely applies them to your live site, tag by tag (`<title>`, `description`, `og:title`, `og:description`, `twitter:title`, `twitter:description`): 1. **Your app's own value wins.** If your code sets a real title or description for a page, the live site keeps it. 2. **Placeholders are replaced.** Where a page still has a template placeholder (`Your App`, `Vibely App`, `Replace this with…`, `Vibely Generated Project`) or an empty value, Website info is used instead. 3. **Missing tags are added.** A page with no `<title>`, `description`, `og:title` or `og:description` gets one from Website info. So Website info fixes every placeholder at once, while a page-specific title from your code (like "Pricing — Acme") is never overwritten. Changes to Website info reach the live site on your next **Update**. It isn't applied to the editor preview, and the in-editor SEO review reads your code, so it still reports placeholders that Website info covers on the live site. ## Improve your SEO step by step <Steps> <Step title="Write a real title and description"> > Set the page title to "Acme Invoicing — send invoices in 30 seconds" and write a real meta description, 120–155 characters. Update og:title and og:description to match. Keep the title under 60 characters, since Google truncates around there, and the description between 120 and 155. Much shorter, and search engines fill the gap with whatever text they find first on the page. </Step> <Step title="Add a social preview image"> > Generate a 1200×630 social preview image, save it in public/, reference it as an absolute og:image URL, and switch twitter:card to summary\_large\_image. `og:image` must be an **absolute** URL; a relative path shows as a grey card on every platform. The template's `twitter:card` is `summary`, which shows even a good image as a small square, so change both. </Step> <Step title="Give every page its own metadata"> > Give every route its own head() with a page-specific title and description. Otherwise every page in a multi-page app has the same title and description, and they compete with each other as the same search result. </Step> <Step title="Set a canonical URL"> > Add a canonical link pointing at [https://app.example.com](https://app.example.com). The same page can be reachable on your `vibelyagent.com` address and your custom domain. A canonical URL tells search engines which one to index. Set it once you know your final domain. </Step> <Step title="Add a sitemap"> > Create public/sitemap.xml listing every route, and add a Sitemap: line to public/robots.txt with its absolute URL. A new app has few inbound links, so a sitemap is how crawlers discover your pages. </Step> <Step title="Add structured data"> > Add JSON-LD to the root route describing this app — SoftwareApplication with name, description and url. Structured data tells machines what your app *is* instead of leaving them to guess from the text. See below. </Step> </Steps> ## Get cited by AI search AI answer engines read the same pages crawlers do, but they lift specific claims and attribute them. Two things help most. **Structured data.** JSON-LD is how a machine learns what your page is about. Pick the schema.org type that matches, such as `SoftwareApplication`, `Organization`, `Product` or `FAQPage`, and fill in at least `name`, `description` and `url`. **Name AI crawlers in `robots.txt`.** The template's catch-all rule already allows them, so this doesn't unblock anything. It makes your intent explicit, since some of these crawlers only read the rules addressed to them by name. > Add explicit Allow rules to public/robots.txt for GPTBot, ClaudeBot, PerplexityBot, Google-Extended and OAI-SearchBot. | Crawler | Who it is | | - | - | | `GPTBot` | OpenAI, training and retrieval | | `OAI-SearchBot` | OpenAI, ChatGPT search results | | `ClaudeBot` | Anthropic | | `PerplexityBot` | Perplexity | | `Google-Extended` | Google's control for Gemini | <Tip> Want your pricing or docs quoted accurately? Ask for a `public/llms.txt`: a plain-text summary of your key pages and facts. It's one file and gives answer engines a clean source to quote from. </Tip> ## Accessibility helps SEO * **One `<h1>` per page.** It tells search engines and screen readers what the page is about. Styled text isn't a substitute. * **`alt` text on every image.** Without it, screen readers read the file name and image search has nothing to index. Use `alt=""` only for purely decorative images. > Add exactly one h1 to each page and descriptive alt text to every image. ## Custom domains A domain you own is the best long-term home for your search presence. [Connect a custom domain](/features/deploy/custom-domain), make it your primary domain, then set your canonical URL and sitemap to use it. ## FAQ <AccordionGroup> <Accordion title="Can my Vibely app rank well in search?"> Yes. New web apps render pages on the server, so crawlers see your full content. Ranking then depends on your content, metadata, and the links pointing to your site, like any other website. </Accordion> <Accordion title="Do I need a pre-rendering service?"> No. New Vibely web apps already send fully rendered pages to every visitor and crawler. </Accordion> <Accordion title="Why do shared links show the wrong title or image?"> Either the placeholders are still in place, `og:image` is missing or relative, or the platform cached an old version. Fix the tags, publish, then refresh the preview in the platform's debugger (for example, Facebook's Sharing Debugger or LinkedIn's Post Inspector). </Accordion> <Accordion title="How long does it take Google to index my site?"> Anywhere from a few days to a few weeks. Verifying your domain in Google Search Console and submitting your sitemap speeds up discovery. </Accordion> <Accordion title="Does Vibely do keyword research or rank tracking?"> No. Vibely has no keyword research, competitor analysis, backlink data, rank tracking or Google Search Console integration. Verify your site in Search Console yourself once it's live. </Accordion> <Accordion title="Does this apply to mobile apps?"> No. App Store and Play Store listings aren't crawled like websites. The equivalent is App Store optimization. See [App Store optimization](/features/mobile-apps/aso). </Accordion> </AccordionGroup> ## Related <CardGroup cols={2}> <Card title="Publish" icon="rocket" href="/features/deploy/publish"> Your app must be public to be indexed. </Card> <Card title="Custom domain" icon="globe" href="/features/deploy/custom-domain"> Build search presence on your own domain. </Card> <Card title="Analytics" icon="chart-line" href="/features/grow/analytics"> See which sources bring visitors. </Card> <Card title="App Store optimization" icon="mobile" href="/features/mobile-apps/aso"> The mobile equivalent of SEO. </Card> </CardGroup> ## Related topics - [Project analytics](/features/grow/analytics.md) - [FAQ](/faq.md) - [How Vibely hosts your app](/features/deploy/hosting.md) - [Find your way around the editor](/features/projects/editor.md) - [Publish your Vibely project](/features/deploy/publish.md) This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.

> ## Documentation Index > Fetch the complete documentation index at: https://docs.vibely.sh/llms.txt > Use this file to discover all available pages before exploring further. # Optimize your app for SEO and AI search > Get your app found on Google and Bing, and quoted by AI search engines like ChatGPT, Perplexity, Claude and Gemini. **Search engine optimization (SEO)** helps your app show up in search engines like Google and Bing. **Answer engine optimization (AEO)** helps it show up in AI answers from ChatGPT, Perplexity, Claude or Gemini. Both depend on the same foundations: pages crawlers can read, good metadata, clean content structure, and links pointing to your site. Vibely handles the first part for you. The rest is a few sentences in chat, and this page tells you which ones. Optimize your app for SEO and AI search

## Before you begin * **Your pages are readable by crawlers.** New Vibely web apps render on the server, so search engines, social platforms and AI crawlers get fully rendered HTML, not an empty page waiting for JavaScript. * **Only publicly published apps can be indexed.** Unpublished projects and sites with restricted [website access](/features/deploy/publish#who-can-see-your-published-app) are invisible to search engines. * **A new app ships with placeholder metadata.** Replace it before you share your link anywhere. * **Every fix is a chat message.** Vibely edits the page head in `src/routes/__root.tsx` and writes files under `public/`. Each fix is a normal build and uses credits. ## Quick start 1. Replace the placeholder title and description. 2. Add a social preview image. 3. Give each page its own title and description. 4. [Publish](/features/deploy/publish) and, if you have one, [connect your domain](/features/deploy/custom-domain). 5. Add a canonical URL, `sitemap.xml` and structured data. 6. Verify your site in [Google Search Console](https://search.google.com/search-console) and submit your sitemap. ## Review your app in the editor Vibely can check your app for you. In the editor header, with the **Preview** view open, click **SEO & AI search** (the magnifying glass). The review reads your project's code, so it works before you publish, and gives you: * **A score from 0 to 100**, weighted so a missing title counts for more than a minor nit. * **A list of findings**, each marked **Fix first**, **Worth fixing**, or **Nice to have**. It checks the page title and description (including the template placeholders), the canonical URL, the social preview image and Open Graph tags, `robots.txt` and `sitemap.xml`, AI crawlers in `robots.txt`, structured data, and page headings. * **Fix this** on every finding, which sends Vibely the fix as a chat message, and **Fix all**, which sends every fix in one message. Fixes are normal builds and use credits. The review re-runs each time you open it, so open it again after the fix lands to confirm. It's available for web projects only. ## What a new app ships with | Tag or file | Default | Good enough to ship? | | - | - | - | | `` | `Your App` (older projects: `Vibely App`) | No, placeholder | | `description` | `Replace this with a one-sentence description of your app.` (older projects: `Vibely Generated Project`) | No, placeholder | | `og:title` / `og:description` | The same two placeholders | No, placeholder | | `og:type` | `website` | Yes | | `twitter:card` | `summary` | Partly: shows a small thumbnail, not a full-width image | | `og:image` | Missing | No: shared links show a grey card | | `canonical` | Missing | No: different URLs for the same page compete | | `viewport`, `charSet` | Set correctly | Yes | | `public/robots.txt` | Allows Googlebot, Bingbot, Twitterbot, facebookexternalhit and all others | Partly: no `Sitemap:` line, no AI crawlers named | | `public/sitemap.xml` | Missing | No | | Structured data (JSON-LD) | Missing | No | <Warning> The placeholders appear in every search result, browser tab and shared link until you replace them. The fastest fix is **Website info** in the Publish dialog (below); for per-page titles, ask Vibely in chat. </Warning> ### Website info and your app's own tags The **Website info** title and description in the [Publish dialog](/features/deploy/publish#the-publish-dialog-step-by-step) are your site-wide defaults. When you publish, Vibely applies them to your live site, tag by tag (`<title>`, `description`, `og:title`, `og:description`, `twitter:title`, `twitter:description`): 1. **Your app's own value wins.** If your code sets a real title or description for a page, the live site keeps it. 2. **Placeholders are replaced.** Where a page still has a template placeholder (`Your App`, `Vibely App`, `Replace this with…`, `Vibely Generated Project`) or an empty value, Website info is used instead. 3. **Missing tags are added.** A page with no `<title>`, `description`, `og:title` or `og:description` gets one from Website info. So Website info fixes every placeholder at once, while a page-specific title from your code (like "Pricing — Acme") is never overwritten. Changes to Website info reach the live site on your next **Update**. It isn't applied to the editor preview, and the in-editor SEO review reads your code, so it still reports placeholders that Website info covers on the live site. ## Improve your SEO step by step <Steps> <Step title="Write a real title and description"> > Set the page title to "Acme Invoicing — send invoices in 30 seconds" and write a real meta description, 120–155 characters. Update og:title and og:description to match. Keep the title under 60 characters, since Google truncates around there, and the description between 120 and 155. Much shorter, and search engines fill the gap with whatever text they find first on the page. </Step> <Step title="Add a social preview image"> > Generate a 1200×630 social preview image, save it in public/, reference it as an absolute og:image URL, and switch twitter:card to summary\_large\_image. `og:image` must be an **absolute** URL; a relative path shows as a grey card on every platform. The template's `twitter:card` is `summary`, which shows even a good image as a small square, so change both. </Step> <Step title="Give every page its own metadata"> > Give every route its own head() with a page-specific title and description. Otherwise every page in a multi-page app has the same title and description, and they compete with each other as the same search result. </Step> <Step title="Set a canonical URL"> > Add a canonical link pointing at [https://app.example.com](https://app.example.com). The same page can be reachable on your `vibelyagent.com` address and your custom domain. A canonical URL tells search engines which one to index. Set it once you know your final domain. </Step> <Step title="Add a sitemap"> > Create public/sitemap.xml listing every route, and add a Sitemap: line to public/robots.txt with its absolute URL. A new app has few inbound links, so a sitemap is how crawlers discover your pages. </Step> <Step title="Add structured data"> > Add JSON-LD to the root route describing this app — SoftwareApplication with name, description and url. Structured data tells machines what your app *is* instead of leaving them to guess from the text. See below. </Step> </Steps> ## Get cited by AI search AI answer engines read the same pages crawlers do, but they lift specific claims and attribute them. Two things help most. **Structured data.** JSON-LD is how a machine learns what your page is about. Pick the schema.org type that matches, such as `SoftwareApplication`, `Organization`, `Product` or `FAQPage`, and fill in at least `name`, `description` and `url`. **Name AI crawlers in `robots.txt`.** The template's catch-all rule already allows them, so this doesn't unblock anything. It makes your intent explicit, since some of these crawlers only read the rules addressed to them by name. > Add explicit Allow rules to public/robots.txt for GPTBot, ClaudeBot, PerplexityBot, Google-Extended and OAI-SearchBot. | Crawler | Who it is | | - | - | | `GPTBot` | OpenAI, training and retrieval | | `OAI-SearchBot` | OpenAI, ChatGPT search results | | `ClaudeBot` | Anthropic | | `PerplexityBot` | Perplexity | | `Google-Extended` | Google's control for Gemini | <Tip> Want your pricing or docs quoted accurately? Ask for a `public/llms.txt`: a plain-text summary of your key pages and facts. It's one file and gives answer engines a clean source to quote from. </Tip> ## Accessibility helps SEO * **One `<h1>` per page.** It tells search engines and screen readers what the page is about. Styled text isn't a substitute. * **`alt` text on every image.** Without it, screen readers read the file name and image search has nothing to index. Use `alt=""` only for purely decorative images. > Add exactly one h1 to each page and descriptive alt text to every image. ## Custom domains A domain you own is the best long-term home for your search presence. [Connect a custom domain](/features/deploy/custom-domain), make it your primary domain, then set your canonical URL and sitemap to use it. ## FAQ <AccordionGroup> <Accordion title="Can my Vibely app rank well in search?"> Yes. New web apps render pages on the server, so crawlers see your full content. Ranking then depends on your content, metadata, and the links pointing to your site, like any other website. </Accordion> <Accordion title="Do I need a pre-rendering service?"> No. New Vibely web apps already send fully rendered pages to every visitor and crawler. </Accordion> <Accordion title="Why do shared links show the wrong title or image?"> Either the placeholders are still in place, `og:image` is missing or relative, or the platform cached an old version. Fix the tags, publish, then refresh the preview in the platform's debugger (for example, Facebook's Sharing Debugger or LinkedIn's Post Inspector). </Accordion> <Accordion title="How long does it take Google to index my site?"> Anywhere from a few days to a few weeks. Verifying your domain in Google Search Console and submitting your sitemap speeds up discovery. </Accordion> <Accordion title="Does Vibely do keyword research or rank tracking?"> No. Vibely has no keyword research, competitor analysis, backlink data, rank tracking or Google Search Console integration. Verify your site in Search Console yourself once it's live. </Accordion> <Accordion title="Does this apply to mobile apps?"> No. App Store and Play Store listings aren't crawled like websites. The equivalent is App Store optimization. See [App Store optimization](/features/mobile-apps/aso). </Accordion> </AccordionGroup> ## Related <CardGroup cols={2}> <Card title="Publish" icon="rocket" href="/features/deploy/publish"> Your app must be public to be indexed. </Card> <Card title="Custom domain" icon="globe" href="/features/deploy/custom-domain"> Build search presence on your own domain. </Card> <Card title="Analytics" icon="chart-line" href="/features/grow/analytics"> See which sources bring visitors. </Card> <Card title="App Store optimization" icon="mobile" href="/features/mobile-apps/aso"> The mobile equivalent of SEO. </Card> </CardGroup> ## Related topics - [Project analytics](/features/grow/analytics.md) - [FAQ](/faq.md) - [How Vibely hosts your app](/features/deploy/hosting.md) - [Find your way around the editor](/features/projects/editor.md) - [Publish your Vibely project](/features/deploy/publish.md) This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.