# Skills de agente

> Enseña a tu agente de programación a escribir, revisar y personalizar un sitio de htmlpress.

Htmlpress incluye cinco [Agent Skills](https://agentskills.io/) que explican a agentes de programación como Claude Code, Cursor y Codex cómo funciona un proyecto de htmlpress. Una vez instaladas, tu agente conoce el contrato de las páginas, qué componentes existen, qué claves de configuración se permiten, cómo escapar el layout, cómo desplegar y cómo comprobar su trabajo. No tienes que explicarle nada de eso en el prompt.

Htmlpress mantiene pequeño el trabajo de un agente: escribir HTML semántico, usar un componente solo donde HTML no tiene ninguno y dejar los estilos al tema. Cuantas menos opciones ofrece una página, más se parecen las páginas a un mismo sitio.

| Skill                     | Tu agente la usa al                                                                                      |
| ------------------------- | -------------------------------------------------------------------------------------------------------- |
| `htmlpress-authoring`     | escribir o editar páginas: metas, encabezados, componentes, bloques de código, matemáticas e inclusiones |
| `htmlpress-configuration` | editar `htmlpress.yaml`: secciones, enlaces, parches, include y exclude                                  |
| `htmlpress-customization` | cambiar el aspecto: tokens, escapes, layouts y componentes del proyecto                                  |
| `htmlpress-landing`       | diseñar una landing page, con la de htmlpress.dev como referencia                                        |
| `htmlpress-knowledge`     | escribir documentación interna para personas: investigación, informes, registros y decisiones            |
| `htmlpress-deployment`    | publicar la compilación en Cloudflare, GitHub Pages, Vercel, Netlify o cualquier hosting                 |

## Instalar desde el sitio web

htmlpress.dev publica sus skills en [/.well-known/agent-skills/](/.well-known/agent-skills/index.json), así que la [CLI `skills`](https://github.com/vercel-labs/skills) puede instalarlas desde la URL del sitio. Ejecuta esto en la raíz de tu proyecto:

```sh
npx skills add https://htmlpress.dev
```

Te pregunta qué skills instalar y para qué agentes. Para saltarte las preguntas, pásalos como flags:

```sh
npx skills add https://htmlpress.dev --skill htmlpress-authoring --agent claude-code
```

Añade `--global` para instalarlas para tu usuario en lugar del proyecto, y `--list` para ver qué hay disponible sin instalar nada. Ejecuta `npx skills update` más adelante para obtener versiones más recientes.

## Instalar desde el paquete

Las skills también vienen dentro de los paquetes de npm y PyPI. Instalarlas desde ahí las mantiene alineadas con la versión de htmlpress de tu lockfile, mientras que el sitio web siempre sirve la última versión:

**npm**

```sh
npx skills add ./node_modules/gethtmlpress/skills
```

**PyPI**

```sh
npx skills add .venv/share/htmlpress/skills
```

El paquete de Python las instala en `share/htmlpress/skills` del entorno; con `cargo install`, instálalas desde el sitio web.

## Usarlas

No necesitas invocar una skill tú mismo. Los agentes leen la descripción de cada skill y la cargan cuando una tarea coincide: pedir una página nueva carga `htmlpress-authoring`, y un cambio en el aspecto del sitio, `htmlpress-customization`. Si tu agente permite invocar skills por nombre, también puedes llamar a una directamente, como con `/htmlpress-deployment` en Claude Code.

### El ciclo

1. Ejecuta `htmlpress --llms` una vez para conocer los comandos.
2. Escribe o edita páginas en la carpeta del proyecto.
3. Ejecuta `htmlpress build <root> --json` y lee `pages` y cualquier error en stderr.
4. Para una comprobación visual, ejecuta `htmlpress start <root>` y abre la página en un navegador.

### Reglas que conviene darle a un agente

- Un `<title>` y un `<h1>` por página; un `<meta name="order">` donde importe el orden de la navegación.
- Nada de `style` en línea ni clases para el aspecto: sobrescribe un token `--htmlpress-*` en su lugar.
- Solo los [componentes documentados](/es/authoring/rich-elements/); todo lo demás es HTML sencillo.
- Nunca edites `.htmlpress/build`.

## Ver también

- [Agentes de IA](/es/customization/ai-agents/): publica las skills de tu propio proyecto de la misma forma, junto a las copias en Markdown y el `llms.txt` que escribe cada compilación.