Agentify

Make web pages and websites more easily navigable, parseable, and operable by AI agents, web scrapers, and automation tools.

Core Capabilities

1. Analyze

Evaluate web pages or code for agent-friendliness. Produce a scored report (0-100) with actionable improvements.

When to use: The user wants to audit a page, URL, or codebase for agent accessibility.

Workflow:

1. Acquire the content:
   • URL → fetch and retrieve HTML
   • File path → read the file
   • Glob pattern → find matching files, analyze each
   • IDE selection → analyze selected code
2. Read the scoring reference: references/scoring.md
3. Read the full checklist: references/checklist.md
4. Evaluate across 9 categories (100 points total):

5. Output report in this format:
   • Score: X/100 (Grade A-F)
   • Per-category score breakdown table
   • Top 5 priority improvements with before/after code
   • Detailed findings per category
   • Quick wins section (changes under 5 minutes, 5+ point gain)

2. Rewrite

Transform web templates to be agent-friendly while preserving all existing functionality.

When to use: The user wants to improve existing code for agent consumption.

Workflow:

1. Detect framework from file extension (.html, .jsx, .tsx, .vue, .svelte)
2. Read the patterns reference: references/patterns.md
3. Read framework-specific guidance: references/frameworks.md
4. Read and understand the entire file before modifying
5. Apply transformations in order:
   • Replace non-semantic elements with semantic equivalents (only when intent is unambiguous)
   • Add ARIA attributes to interactive elements
   • Add data-testid to buttons, links, inputs, content containers (kebab-case naming)
   • Improve form labels, autocomplete, fieldset grouping
   • Insert JSON-LD structured data where content type is identifiable
   • Add meta tags for full HTML pages
   • Add skip links and nav labels
   • Fix heading hierarchy

Safety rules (non-negotiable):

• Never remove existing code, event handlers, or component logic
• Never change class names, IDs, or visual appearance
• Never break framework-specific syntax
• Only add attributes, never replace unless strictly better
• Match existing formatting style

6. After modification, summarize: number of changes per category, changes considered but skipped, and follow-up suggestions needing human judgment

3. Design Spec

Generate a comprehensive agent-friendly design specification document for development teams.

When to use: The user wants to establish standards for agent-friendly web development.

Workflow:

1. Parse arguments for project name and focus area (e-commerce, dashboard, docs, SaaS, marketing)
2. Scan the project if in a code directory:
   • Detect framework (package.json, config files)
   • Detect test framework
   • Grep for existing data-testid, aria-*, schema.org patterns
   • Read 2-3 representative components to understand code style
3. Read the spec template: references/spec-template.md
4. Read the example spec: references/spec-example.md
5. Generate a markdown spec to agent-friendly-spec.md covering:
   • Executive summary
   • Semantic HTML guidelines
   • ARIA & accessibility patterns
   • Naming conventions (data-testid, CSS classes, components)
   • Structured data (JSON-LD) per page type
   • Form design patterns
   • Navigation patterns
   • API & discoverability
   • Meta tags & machine signals
   • Component-level checklists
   • Testing for agent-friendliness
   • Migration guide (quick wins → medium → large effort)

Each section must include: priority level (P0/P1/P2), code examples for the detected framework, anti-patterns, and verification methods.

Shared Knowledge Base

For the canonical reference on all agent-friendly web patterns (semantic HTML, ARIA, structured data, data attributes, forms, navigation, APIs, meta tags, CSS stability, interaction patterns), read: references/knowledge-base.md