joshguntarverdiyev/web-checkup

**One agent skill that makes AI-built websites ready to ship.** It fixes the weak spots every vibe coder hits: template-looking design, missing states, broken mobile layouts, leaked API keys, open databases, slow pages, invisible SEO and blank link previews.
Works with Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and any agent that supports the open Agent Skills format.
See the difference
Same prompt, same model (Claude Opus 5.5), one run each, nothing cherry-picked: *"Build a one-page website for Crumb & Co., a small neighborhood sourdough bakery in Lisbon... Make it ready to launch."*
Without the skill you get the default "artisan" template: cream canvas, clay accent, tracked uppercase labels, a hand-drawn bread illustration, a stats row. With it, the page is built around the subject (an "oven board" of real bake times, Lisbon azulejo blue), shows its actions immediately on phones, has link previews, and was checked in a real browser before it was handed over.
Mobile comparison and full results
| | Without | With Web Checkup |
| --- | --- | --- |
| AI-template score | 11 (High) | 0 (Low) |
| Tap targets under 44 px on a phone | 14 | 0 |
| Link preview image | Missing | Present |
| Checked its own rendered output | No | Yes |
Plain Claude already handled structured data, focus styles and reduced motion. Method, both HTML files and full-page screenshots: examples/bakery.
Why
Without guidance, AI assistants produce the statistical average of everything they were trained on:
| What the AI does by default | What Web Checkup makes it do instead |
| --- | --- |
| Purple gradients, three icon cards, "Supercharge your workflow" | Reads the brief, commits to a design direction from the product's own world, and removes 50+ known template tells |
| Shows only the happy path | Builds and checks loading, empty, error, success and disabled states |
| Breaks on phones and tablets | Checks 320 px through 1440 px, tablets included, with screenshots |
| Puts sk_live_... or a Supabase service key in the browser, leaves database rules open | Finds leaked secrets, open RLS and Firebase rules, routes without auth, client-trusted prices, unverified webhooks |
| Ships unmeasured, heavy pages | Measures Core Web Vitals (lab and real users) and fixes LCP, INP and CLS |
| Vite + React , default favicon, blank link previews | Sets titles, descriptions, canonicals, Open Graph images, favicons, sitemap, robots.txt and structured data |
| Ignores keyboard and screen-reader users | Checks against WCAG 2.2 AA |
| "Looks done" | Verifies the rendered result and gives an honest Ready / Not ready verdict |
What it covers
- **Design and anti-template:** design direction, typography, color and dark mode, layout, motion, an AI-tell catalog with a score
- **UX and copy:** flows, states, forms, microcopy, conversion for landing, pricing and ecommerce pages
- **Brand and assets:** logo concepts, favicon set, Open Graph images, icon systems, imagery
- **Responsive:** phone, tablet and wide-screen rules and checks
- **Accessibility:** the WCAG 2.2 AA checklist, keyboard and screen-reader passes
- **Security:** a checklist of the 20 most common issues in vibe-coded apps, fix patterns for Next.js, Supabase, Firebase, Convex, Stripe and LLM features, headers, CSP and deployment hardening
- **Performance:** a measure-first workflow, Core Web Vitals, budgets, images, fonts, JavaScript, caching
- **SEO and discoverability:** technical SEO, metadata, structured data, Search Console, and visibility in ChatGPT, Perplexity and Google AI answers
- **Code quality:** guardrails and cleanup for AI-generated code
- **Privacy:** privacy policy, cookie consent, analytics, forms