About

Imported from xoai/sage (skills/web/SKILL.md). Install upstream with npx skills add xoai/sage --skill web. Copyright stays with the author.

web

Name: web
Author: xoai

Layer 1 — Domain Foundation (v2.0)

Universal web development principles that apply to every web project regardless of framework. React, Vue, Svelte, vanilla JS — these principles hold.

Philosophy

This pack encodes the foundational web platform knowledge that agents frequently get right in isolation but miss in practice. An agent knows what ARIA labels are. It still produces a form with no error announcements for screen readers. An agent knows about Core Web Vitals. It still renders a 2MB hero image without dimensions.

The gap isn't knowledge — it's consistent application.

What's Included

Type	Count	Coverage
Patterns	7	Accessibility (WCAG 2.2), performance (Core Web Vitals), security headers (OWASP), SEO, responsive design, error UX, loading states
Anti-patterns	6	Div soup, missing alt text, layout shift, unprotected forms, client-only critical paths, no security headers
Constitution	7	principles

Grounded in: W3C WCAG 2.2 (October 2023), Google Core Web Vitals (2025), OWASP Secure Headers Project, OWASP CSP Cheat Sheet, MDN Web Docs, Web Almanac 2025, European Accessibility Act (June 2025).

What This Pack Does NOT Cover

Framework-specific patterns (see react, nextjs, etc.)
CSS methodology opinions (BEM vs utility-first vs CSS-in-JS)
Build tool configuration (Webpack, Vite, Turbopack)
Backend/API patterns (see api or baas)

Use it

Copy one of these into your project. Installing also returns the manifest and these snippets.

yaml

targets:
  - https://api.opensmartroute.ai/api/v1/registry/xoai-sage-web/manifest   # or paste the manifest below

Manifest

An Open Capability Manifest: the router reads it to know what this does, what it costs and when to pick it.

xoai-sage-web.ocm.jsonjson

{
  "ocm": "1",
  "id": "xoai-sage-web",
  "kind": "skill",
  "name": "web",
  "description": "Universal web development principles — accessibility (WCAG 2.2), performance (Core Web Vitals), security headers (OWASP), SEO, responsive design, error UX, and loading states. Framework-agnostic.",
  "publisher": "xoai",
  "version": "1.0.0",
  "capabilities": {
    "domains": [
      "marketing"
    ],
    "tags": [
      "skill-md",
      "react",
      "vue",
      "svelte",
      "angular",
      "next",
      "github"
    ],
    "languages": [
      "en"
    ]
  },
  "quality_prior": 0.6,
  "examples": [
    "Universal web development principles — accessibility (WCAG 2.2), performance (Core Web Vitals), security headers (OWASP), SEO, responsive design, error UX, and loading states. Framework-agnostic."
  ],
  "primary": false,
  "metadata": {
    "source": {
      "provider": "github",
      "repository": "https://github.com/xoai/sage",
      "path": "skills/web/SKILL.md",
      "ref": "6ddd558bc41c0f1024ed79948370f9c15abd8c43",
      "url": "https://github.com/xoai/sage/blob/6ddd558bc41c0f1024ed79948370f9c15abd8c43/skills/web/SKILL.md",
      "key": "xoai/sage/skills/web/SKILL.md"
    }
  },
  "instructions": "# web\n\n**Layer 1 — Domain Foundation (v2.0)**\n\nUniversal web development principles that apply to every web project regardless\nof framework. React, Vue, Svelte, vanilla JS — these principles hold.\n\n## Philosophy\n\nThis pack encodes the foundational web platform knowledge that agents frequently\nget right in isolation but miss in practice. An agent knows what ARIA labels are.\nIt still produces a form with no error announcements for screen readers. An agent\nknows about Core Web Vitals. It still renders a 2MB hero image without dimensions.\n\nThe gap isn't knowledge — it's consistent application.\n\n##",
  "cost": {
    "context_tokens": 361
  }
}

Fetch it by URL: GET /api/v1/registry/xoai-sage-web/manifest?version=1.0.0

Reviews

Star ratings from people who tried it. One review per account; edit yours any time.

No reviews yet. Install it, try it, and be the first to rate it.