Website Analyzer

Website Analyzer Skill

A comprehensive, multi-dimensional website analysis framework following Anthropic's best practices for prompt clarity, structured reasoning, and actionable output. Covers everything from surface-level design to deep business strategy alignment.

Step 0 — Pre-Analysis Setup

Before fetching anything:

1. Confirm the URL is live and accessible. If the user gave a partial URL (e.g., builtwithvince.com), prepend https://.
2. Clarify analysis depth if not stated — default to full analysis unless user asks for a focused audit (e.g., "just UX" or "just SEO").
3. Fetch the homepage using web_fetch. Also fetch:
   • /about or /about-us (for brand/philosophy)
   • /services, /products, or /pricing (for offer clarity)
   • Any page the user specifically mentions
4. Note what you can and cannot access — server-side code, databases, and private APIs are inaccessible. Be transparent about coverage limits.

Step 1 — First Impressions (The 5-Second Test)

Simulate what a first-time visitor perceives within 5 seconds of landing:

• Primary message: What does this site communicate immediately? Is the headline clear?
• Visual hierarchy: Where does the eye go first? Is there a clear focal point?
• Trust signals: Does the site feel credible, professional, and safe immediately?
• Call-to-action visibility: Is there an obvious next step above the fold?
• Brand tone: Formal or casual? Corporate or personal? Warm or transactional?

Rate this section: Strong / Adequate / Needs Work

Step 2 — Business Philosophy & Brand Positioning

Analyze the deeper strategic intent behind the site:

2a. Mission & Philosophy

• What problem is this business trying to solve?
• Is there a stated or implied "why" (purpose beyond profit)?
• Does the content reflect a coherent worldview or philosophy?
• Is the brand voice consistent across pages?

2b. Positioning

• How does the brand position itself relative to competitors?
• Is the unique value proposition (UVP) explicitly stated?
• Is the brand niche or broad? Specialist or generalist?
• Does the site own a clear category in the visitor's mind?

2c. Trust & Authority

• Testimonials, case studies, social proof — are they present and credible?
• Are credentials, certifications, or affiliations shown?
• Is the founder/team visible? (Human trust layer)
• Press mentions, awards, or third-party validation?

Step 3 — Target Audience Analysis

Reconstruct who this site is built for:

• Inferred primary persona: Job role, pain level, sophistication, context of visit
• Secondary personas: Anyone else the site appears to serve
• Audience-content match: Does the copy speak in the audience's language?
• Emotional triggers used: Fear, aspiration, belonging, FOMO, logic, authority?
• Sophistication level: Is the copy written for beginners, practitioners, or experts?
• Geography/context signals: Are there regional, cultural, or timezone cues?

Flag mismatches between presumed audience and actual copy/design decisions.

Step 4 — Frontend Analysis

4a. Visual Design

• Layout system: Grid, flexbox, or freeform? Consistent spacing?
• Color palette: How many colors? Does it follow a 60-30-10 rule?
• Typography: Font pairing, size hierarchy, readability on both desktop and mobile
• Imagery: Stock vs. original, quality, relevance, load weight
• Whitespace usage: Cluttered or breathable?
• Design consistency: Does the visual language hold across all pages?

4b. User Experience (UX)

• Navigation: Is it intuitive? Are menu labels clear and predictable?
• Information architecture: Is content organized logically?
• Scroll behavior: Is important content above the fold? Is scroll depth rewarded?
• Friction points: Any confusing flows, dead ends, or broken interactions?
• Forms: Are they simple, labeled clearly, and minimal in fields?
• Micro-interactions: Hover states, transitions, feedback cues — present and functional?

4c. Mobile Responsiveness

• Does the layout adapt cleanly to mobile screen sizes?
• Are tap targets appropriately sized (minimum 44px)?
• Is the font readable without zooming?
• Are images and videos properly constrained?
• Does the mobile experience feel native or like a squished desktop?

4d. Accessibility (WCAG Basics)

• Color contrast ratio — does text pass AA standard (4.5:1)?
• Alt text on images?
• Keyboard navigability visible?
• Semantic HTML use (headings, landmarks, labels)?
• ARIA attributes present where needed?

Step 5 — Copywriting & Content Analysis

• Headline quality: Clear, benefit-led, and specific? Or vague and generic?
• Body copy voice: Does it match the brand philosophy?
• Clarity of offer: Can a visitor understand what's being sold/offered in one sentence?
• CTA copy: Is it action-oriented and specific? ("Book a Call" vs. "Submit")
• Storytelling: Is there narrative flow that leads the visitor toward a decision?
• SEO copy signals: Are primary keywords present naturally in headings and body?
• Length and density: Is copy appropriate for the audience's patience level?
• Proof elements: Numbers, results, specifics — or generic claims?

Step 6 — Conversion Architecture

Evaluate how the site drives visitors toward a goal:

• Primary conversion goal: What action is the site designed to produce?
• Conversion funnel clarity: Is there a clear path from awareness → interest → action?
• CTA placement and frequency: Too few, too many, or well-timed?
• Objection handling: Does the site anticipate and address buyer hesitations?
• Lead capture mechanisms: Forms, email opt-ins, chat widgets, booking tools?
• Exit intent / retargeting signals: Any pop-ups, sticky CTAs, or persistent offers?
• Social proof placement: Is proof shown closest to the point of decision?
• Friction removal: Is the path to conversion as short as possible?

Step 7 — SEO & Discoverability

Surface-level on-page SEO review (no backend access):

• Title tags: Present, descriptive, and under 60 characters?
• Meta descriptions: Present and compelling?
• Heading hierarchy: Single H1, logical H2–H4 structure?
• URL structure: Clean, readable, keyword-rich slugs?
• Internal linking: Pages linked logically for crawlability?
• Image optimization: File names descriptive? Alt text present?
• Page speed signals: Visible heavy assets (uncompressed images, render-blocking scripts)?
• Schema/structured data: Any visible signs of rich snippet markup?
• Blog/content strategy: Is there ongoing content being published?

Use web_fetch on page source when deeper inspection is needed.

Step 8 — Technical Stack Inference

Based on visible HTML, meta tags, script sources, and footer credits:

• CMS or builder: WordPress, Webflow, Framer, Squarespace, custom, etc.
• Frontend framework signals: React, Vue, Next.js, vanilla JS?
• Analytics tools: Google Analytics, Plausible, Hotjar, etc. (check for GA tags or pixel scripts)
• Marketing/CRM integrations: HubSpot, GoHighLevel, ActiveCampaign snippets?
• Chat or support tools: Intercom, Drift, Crisp, etc.
• Payment or booking tools: Stripe, Calendly, TidyCal embeds?
• Performance tools: CDN headers, lazy loading signals, caching headers if visible?
• Security signals: HTTPS present? SSL cert valid?

Note: This is inference, not inspection. Be appropriately hedged.

Step 9 — Performance Signals (Observational)

Without running Lighthouse directly, note visible performance indicators:

• Excessive or unoptimized images
• Render-blocking script tags in <head>
• Number of external third-party scripts loaded
• Video autoplay without lazy loading
• Heavy animation libraries
• Fonts loaded from multiple sources

If the user wants a formal Lighthouse audit, recommend running PageSpeed Insights at pagespeed.web.dev.

Step 10 — Competitive & Market Context

Frame the site within its competitive landscape:

• Does the site feel differentiated or generic in its market?
• Are there obvious patterns borrowed from competitors without adding anything new?
• What would make a visitor choose this over alternatives?
• Is pricing/offer structure competitive for the perceived positioning?
• Is the site punching above or below its weight class visually?

Step 11 — Overall Scorecard

Rate each dimension on a 1–5 scale with a one-line rationale:

Step 12 — Priority Recommendations

Surface the top 5 highest-leverage fixes ranked by impact:

1. 🔴 Critical — [Issue + specific fix]
2. 🟠 High Priority — [Issue + specific fix]
3. 🟡 Medium — [Issue + specific fix]
4. 🟡 Medium — [Issue + specific fix]
5. 🟢 Quick Win — [Issue + specific fix]

Follow each with a brief rationale connecting the fix to a business outcome — not just aesthetics.

Output Format

Deliver the analysis as a structured report with:

• Section headers matching the steps above
• Inline observations (not just abstract scores)
• Specific examples pulled from the actual site (quote headlines, describe specific UI elements)
• Actionable next steps — not generic advice
• Honest tone — praise what works, be direct about what doesn't

Avoid:

• Generic UX advice not tied to the specific site
• Recommendations without context of business goals
• Over-praising to soften critique
• Technical jargon without explanation when writing for non-technical founders

Fetch Strategy

Primary fetch:     web_fetch("https://[domain]/")
Secondary fetches: web_fetch("https://[domain]/about")
                   web_fetch("https://[domain]/services")  (or /pricing, /work, /portfolio)
                   web_fetch("https://[domain]/blog")      (if content strategy is relevant)
Optional:          web_fetch("https://[domain]/contact")   (for CTA/form analysis)

Always fetch at minimum the homepage + one secondary page before writing the analysis. If any fetch fails, note it and analyze what's accessible.

Calibration by Request Type

This skill follows Anthropic's principles of clear instruction, structured reasoning, and helpful specificity. Each section is designed to produce grounded, evidence-based analysis rather than surface-level impressions.