How to spot a vibe coded website?

What "vibe coding" actually means

Vibe coding is the practice of describing what you want to an AI tool and letting it generate the website for you, often with no designer or developer reviewing the result. Tools like Lovable, Claude Code and Cursor have made this remarkably quick. You type a few prompts, and a working site appears.

The catch is simple. "It works" and "it is good" are not the same thing. A vibe coded site can look passable at a glance and still carry the kind of flaws that make visitors hesitate. For a service business that relies on its website to win trust and enquiries, those small flaws add up.

None of this is a criticism of AI itself. We use AI frequently in everyday work, but more as a helper. The issue is shipping AI output without the design and engineering judgment that turns a rough draft into a finished product.

Why this matters for a service business

Your website is often the first real impression a prospective client gets. People decide whether a business looks credible within seconds, and design quality is a big part of that judgment. When the spacing feels off, or the text is hard to read, visitors may not know exactly why, but they sense that something is amiss.

For service businesses, that hesitation is expensive. A site that looks unpolished can undercut an otherwise strong reputation, slow down enquiries and make your pricing harder to justify. Good design is not decoration. It is part of how you earn trust and turn visitors into clients.

The visual tells

Most vibe coded sites give themselves away through the same handful of visual habits:

• Inconsistent spacing. Margins and padding vary between sections and elements, so the rhythm of the page feels uneven. Consistent spacing is one of the clearest signs of considered design.

• The default blue to purple gradient. Many AI tools reach for the same blue-and-purple gradient. Once you have seen it, you cannot unsee it, and it signals a generic, untouched template.

• Poor contrast. Light grey text on a white background, or weak contrast between text and its background, hurts readability and accessibility. The Web Content Accessibility Guidelines set a minimum contrast ratio of 4.5:1 for normal text.

• Weak typography. Default fonts, awkward line lengths, inconsistent heading sizes and cramped line spacing all point to type that was never properly set.

• Broken scale and hierarchy. Logos, headings, and images are sized to fight each other, so nothing guides the eye. Good design uses scale to show what matters most.

The technical tells

Some of the most important signs sit under the surface:

• Slow loading. AI-generated code is often heavier than necessary, which drags down performance. Google's Core Web Vitals are a useful, public way to measure this.

• Shaky mobile layouts. Resize the browser or open the site on a phone. Vibe coded layouts often break, overlap or overflow at sizes the AI was never prompted to handle.

• Accessibility gaps. Missing alt text, unlabelled buttons and poor keyboard support are common when no one reviews the output.

• Missing SEO/AEO basics. No meta descriptions, no open graph images, duplicate page titles, absent structured data (e.g. JSON Schema) and a thin heading structure all suggest a site that shipped without an SEO pass.

The content and trust tells

The words can give it away too:

• Generic copy. Bland, interchangeable text that could describe any business is a hallmark of unedited AI output.

• Leftover placeholder text. Lorem ipsum, "Your headline here", or sample links that go nowhere are a clear sign no one finished the job.

• Vague calls to action. Buttons that do not say what happens next, or a site with no obvious way to get in touch, leave enquiries on the table.

The business and strategy tells

The deepest problems with a vibe coded site are not visual at all. An AI builds what you describe, but it does not understand your business, your market or what makes a visitor choose you over a competitor. That gap tends to show up in a few ways:

• No clear goal. The site looks like a website, but it is not built to do a job, whether that is booking calls, generating enquiries or qualifying leads.

• Weak messaging and positioning. Generic headlines that never say who you help, what problem you solve, or why you are the right choice.

• No conversion thinking. The page structure, user journey and calls to action are an afterthought, so visitors are not guided towards the next step.

• Missing proof. No testimonials, case studies or trust signals are placed where they actually influence a decision.

A polished design can hide this for a while, but a site that was never planned around your business goals will quietly underperform, even when it looks fine.

How to check your own site in ten minutes

You do not need to be technical to run a quick self-audit:

1. Open your site on your phone and look for anything that overlaps or runs off the screen.

2. Squint at a few sections. Does the spacing feel even and calm, or busy and uneven?

3. Read your body text. If it strains your eyes, it strains your visitors' eyes too.

4. Run your homepage through Google's PageSpeed Insights to see how it scores (https://pagespeed.web.dev).

5. Look at your main call to action. Is it obvious what to do next, and is it easy to do it?

If several of these raise a flag, your site may be carrying more vibe coded baggage than you realised.

What to do if your site shows these signs

The good news is that none of this is permanent. In many cases, the fix is a focused round of design and technical clean up: tightening spacing, correcting contrast and type, trimming heavy code and sorting out the SEO basics. In others, where the foundations are shaky, a rebuild on a solid platform like Framer or Webflow is the faster route to a site you can rely on.

Either way, the goal is the same. A website that loads quickly, reads clearly and earns trust, so it works as hard as you do.

Frequently asked questions