Make Search Engines Find You: SEO in Practice for AI-Built Sites

The Uncomfortable Truth: Search Engines Don't See Your Website

What you see in your browser is a polished landing page with smooth animations. What a search engine might see is something entirely different: an empty <div id="root"></div> plus a multi-megabyte JS bundle — the actual content only appears after the JavaScript downloads and executes.

This is the built-in SEO handicap of vibe-coded projects, and it comes as a triple stack: first, AI defaults to client-side rendering. Vite React templates and create-react-app scaffold SPAs; when you ask AI to "build a landing page," it never volunteers that "search engines might not see this." Second, cookie-cutter titles. The <title> stays "Vite + React + TS" or "My App" — I've seen products live for six months with that still sitting in the browser tab. Third, no sitemap.xml. The only way search engines discover your new pages is by following links, and your internal links may be buried inside JS routing.

"But Googlebot executes JavaScript, right?" It does — at a cost. Googlebot runs an evergreen Chromium and will render JS, but rendering goes through a queue: your page enters the crawl queue, then the render queue, and for a small site it's nothing unusual to wait days before being truly "seen." That burns through your already-small crawl budget. Bing and DuckDuckGo render even less. And the new players are worse: AI search engines (ChatGPT, Perplexity) base their citations almost entirely on static HTML — your client-rendered content is effectively invisible to them.

What to do: a 10-minute self-check before launch. Run curl -s https://yourdomain.com | head -60 and check whether your copy is in the returned HTML; search Google for site:yourdomain.com to see how many pages are actually indexed; use the URL Inspection tool in Google Search Console to see the rendered page as Google sees it. If curl returns an empty shell, stop here and read the next section first.

Don't do this: launch, wait three months, ask "why no traffic," then discover Google indexed exactly one page — titled "Vite App."

Rendering Strategy Is the First Watershed: Get It Wrong and Everything After Is Wasted

Every technical SEO move rests on one premise: the search engine gets complete HTML in a single request. Pick the wrong rendering strategy and your metadata and structured data are castles in the sand. The decision is simpler than it looks — go page type by page type:

• Marketing pages, blogs, docs, pricing → SSG. HTML emitted at build time: fast and stable, the best SEO option there is.
• Frequently updated but cacheable → ISR. Blog listings, leaderboards — set a revalidate interval and they refresh automatically.
• Login state, personalization → SSR. Rendered per request; right for dashboards.
• Pure interactive tools (editors, kanbans) → CSR is fine. But your acquisition landing pages must be SSR/SSG — don't let them go client-rendered just because the tool is.

How (Next.js App Router): in app/layout.tsx, export export const metadata: Metadata = { metadataBase: new URL('https://yourdomain.com'), title: { default: 'ProductName - one line saying what it does', template: '%s | ProductName' }, description: 'Page description under ~150 characters, with one action word' }; for dynamic routes like app/blog/[slug]/page.tsx, use export async function generateMetadata({ params }) to fetch the post and return a unique title and description; ISR is one line: export const revalidate = 3600.

The most common gotcha of the AI era: metadata only works in Server Components. If the file starts with 'use client', an exported metadata object is silently ignored — no error, no warning. AI loves adding 'use client' at the top of a page component and then "helpfully" writing metadata for you. Written equals not written. Audit every page: grep your codebase for files where 'use client' and generateMetadata appear together.

Rescue plan for pure-CSR legacy sites, ranked: the thorough fix is migrating to Next.js / Astro / Remix — at minimum move the landing page, pricing, and blog, and leave the tool itself on CSR. The second option is a prerendering middleware like prerender.io, which serves pre-rendered HTML when it detects a crawler user agent. But mind the red line: what the crawler gets must match what users see — serving two different versions is cloaking and will get you penalized. Don't do this: keeping the whole site CSR for "speed" and hoping Google eventually renders you; or digging up abandoned build-time prerender plugins — a dead dependency is worse than no fix.

One line to remember: search engines look at your HTML first, then decide whether to wait for your JS — don't make them wait.

The Technical SEO Checklist: One Weekend of Work, Lasting Returns

Once the rendering strategy is settled, walk through these seven items one by one. All deterministic work, no mysticism:

1. Semantic HTML: exactly one h1 per page. No skipping levels — an h4 directly under an h2 is AI's favorite mistake; use <nav> for navigation and <main> / <article> for content, and refactor away the div soup AI generated. Run Lighthouse once — its SEO category names exactly what's missing.

2. sitemap.xml + robots.txt. In Next.js, return a { url, lastModified, changeFrequency, priority } array from app/sitemap.ts and declare rules plus the sitemap location in app/robots.ts; other frameworks can use next-sitemap or a handwritten build script. Submit it in both GSC and Bing Webmaster Tools — submission doesn't mean instant indexing, but no submission guarantees slowness.

3. Canonical URLs. Declare alternates: { canonical: 'https://yourdomain.com/blog/xxx' } on every page. Share links with ?utm_source=, www vs. apex domain, http vs. https — leave them un-unified and your authority gets diluted across duplicates.

4. JSON-LD structured data. Drop a <script type="application/ld+json"> in the page: Article for blog posts (headline, datePublished, author), SoftwareApplication for product/tool pages, FAQPage wherever you have an FAQ section. Validate with Google's Rich Results Test. Don't do this: fabricating aggregateRating five-star reviews for yourself — fake structured data draws manual penalties, never worth it.

5. Open Graph / Twitter Cards. Set og:title, og:description, and og:image (1200×630) per page, summary_large_image for Twitter. Don't ship the default gray box — generate title-based share images dynamically with @vercel/og on the edge at near-zero cost. Preview on metatags.io before shipping; cropping and truncation show up immediately.

6. Images: real alt text, compressed first. Write what the image actually shows ("kanban board in dark mode"), not "image1"; compress large images first — Squoosh for one-offs, sharp in the build pipeline; in Next.js just use next/image for responsive sizing and lazy loading out of the box.

7. 404s and 301s. Dead links deserve a 404 page with navigation back home, not a blank page; URL changes during a redesign get 301s (redirects() in next.config.js), never 302s as a shortcut — 302s don't pass link equity, wasting whatever ranking the old URLs built.

All seven fit in a weekend. After that, your site technically deserves to be indexed — the rest is up to content and time.

Content Strategy: AI Can Help You Write, But Can't Make You Worth Indexing

Technical SEO gets you seen; content gets you worth indexing. Programmatic SEO (generating pages in bulk with AI) isn't against the rules — the red line is information gain: every page must answer "what does this offer that the top 10 results don't?" Real data, real comparisons, real screenshots, real war stories — at least one per page. A thousand pages of correct-but-empty prose are worth nothing.

This isn't fearmongering: Google's March 2024 core update explicitly named "scaled content abuse" in its spam policies — low-value content mass-produced purely for ranking can get the whole site demoted. Don't do this: one-click generating 1,000 "Best {keyword} in {city}" pages; paraphrasing someone else's article with AI and shipping it under a new headline; keyword stuffing. The biggest trap of AI writing isn't "being detected as AI" — it's "writing nothing of value."

Through the E-E-A-T lens (Experience, Expertise, Authoritativeness, Trustworthiness — from Google's quality rater guidelines), a vibe-coded site builds credibility with four concrete moves: an author page with a real human — real name, real photo, GitHub/Twitter links, not "Admin"; case studies with real data screenshots (redacted where sensitive); published and updated dates on every article, so engines and readers know the content is alive; an about page saying who built this and why. Anonymous + no contact info + all-AI text is the lowest-trust combo there is — neither engines nor users are fooled.

The truth about content compounding: 10 genuinely problem-solving deep dives beat 100 AI filler pieces. Topic ideas are free — start with the 10 questions you're asked most, and give each the detail nobody else bothered to include. That's your information gain.

Measure and Iterate: No Search Console Means Driving Blind

Two mandatory connections: Google Search Console (verify via DNS TXT record or an HTML file) and Bing Webmaster Tools (one-click import from GSC, five minutes). Don't stop at analytics like GA — they tell you how many people arrived, not how search engines see you.

Watch only the three-stage funnel, in order: stage one, indexed pages — is the "Pages → Indexed" curve in GSC climbing? Without indexing, everything downstream is fiction. Stage two, impressions — does the Performance report show an impressions curve? Impressions mean Google is willing to give you a shot. Stage three, clicks — for pages with CTR under 1%, rewrite the title and description (add numbers, add the year, add the concrete benefit). That's the highest-ROI optimization there is.

After publishing a new page, don't wait for the crawler: request indexing manually in GSC's URL Inspection tool. And spend 20 minutes a week on the Performance report's query list — the actual queries that surface you are often not what you expected, and they're free intelligence for tuning titles and filling content gaps.

The 30-day SEO action plan after launch:

• Week 1 (technical): lock in the rendering strategy and ship it; fill in title/description sitewide; generate sitemap.xml + robots.txt and submit to GSC and Bing; fix 404s/301s; confirm GSC data is flowing.
• Week 2 (technical cleanup + content kickoff): add JSON-LD sitewide and validate with the Rich Results Test; set up OG share images; audit image alts; publish 2 deep, genuinely useful posts.
• Week 3: keep up 2 posts a week; check the GSC Performance report — rewrite titles for pages with impressions but no clicks; do one substantive share in 2–3 relevant communities (Show HN, Product Hunt — share the problem-solving process, not an ad).
• Week 4: review the funnel — how much did indexing grow, which query clusters gained impressions; deepen the pages that earned impressions (add an FAQ section, paired with FAQPage schema); plan next month's 8 topics.

Don't do this: buying backlinks or click-boosting. It might work briefly; getting caught means a site-wide penalty — a bet indie hackers can't afford.

The Final Call: SEO Is a Slow Variable — Be Worth Indexing First

Let's set expectations: SEO is the cheapest growth channel for a vibe-coded project — zero ad spend, compounding traffic. It's also one of the slowest variables; the curve takes 3–6 months to show. Anyone expecting "did SEO last week, traffic explosion this week" will quit in week three and conclude "SEO doesn't work."

The order never changes: be worth indexing before chasing indexing tricks. Informative content, no technical landmines, credibility that holds up — get those three right and every technical SEO move just helps the engine see the value that's already there. Flip it around: for a product nobody needs, great SEO only helps more people discover faster that they don't need it.

So the action list is really three lines: fix rendering and metadata this week; ship 8 posts with real information gain this month; then give the search engines some patience. Time handles the rest.