# Fixing Metadata

> Audita y corrige metadatos HTML: títulos, descripciones, canónicas, Open Graph, Twitter cards, favicons, JSON-LD y robots. Úsalo al añadir SEO, arreglar vistas previas, revisar Open Graph, configurar canónicas o publicar páginas nuevas.

Fuente: https://skillsagentes.com/skills/ibelick/ui-skills/fixing-metadata
Markdown: https://skillsagentes.com/skills/ibelick/ui-skills/fixing-metadata.md

Repositorio: https://github.com/ibelick/ui-skills
Autor: ibelick
Licencia: MIT
Actualizado: hace 7 meses
Coste de contexto: 85 tok instalada, 1.1k tok al activarse, 1.1k tok con todos los archivos del bundle
Bundle: 1 archivo, 4 KB
Permisos que pide: ninguno declarado

## Instalación

Un skill son archivos markdown: los mismos archivos valen para cualquier agente y lo único que cambia es el directorio de destino, es decir la bandera `--agent`. Añade `-g` para instalarlo en todos los proyectos de la máquina.

```bash
# Claude Code
npx -y skills add ibelick/ui-skills --skill fixing-metadata --agent claude-code
# Cursor
npx -y skills add ibelick/ui-skills --skill fixing-metadata --agent cursor
# Codex
npx -y skills add ibelick/ui-skills --skill fixing-metadata --agent codex
# Gemini CLI
npx -y skills add ibelick/ui-skills --skill fixing-metadata --agent gemini
# Windsurf
npx -y skills add ibelick/ui-skills --skill fixing-metadata --agent windsurf
# Cline
npx -y skills add ibelick/ui-skills --skill fixing-metadata --agent cline
```

## Qué hace

- Audita páginas en busca de metadatos HTML ausentes o incorrectos: títulos, meta descripciones, canónicas, Open Graph, Twitter cards, favicons, JSON-LD y robots.
- Prioriza los fallos críticos (duplicados, indexación, canónicas) antes que los secundarios.
- Asegura que title, description, canonical y og:url sean coherentes entre sí.
- Verifica las tarjetas sociales en una URL real, no en localhost.
- Mantiene los cambios mínimos y limitados a metadatos; no refactoriza código ajeno.

## Cuándo usarla

- Al añadir o cambiar metadatos de página: títulos, descripciones, canónicas o robots.
- Al implementar Open Graph, Twitter cards o datos estructurados (JSON-LD).
- Al configurar favicons, iconos, manifest, theme-color o componentes SEO compartidos.
- Al cambiar locale, idiomas alternativos o enrutado canónico, y al publicar páginas nuevas o enlaces compartibles.

## Qué la activa

- "Revisa los metadatos SEO de esta página y dime qué falta o sobra."
- "No se ve la vista previa al compartir el enlace; arregla las etiquetas Open Graph."
- "Comprueba que el canonical y el og:url coincidan en todas las páginas."
- "La página de staging no debe indexarse; añade noindex y corrige el canonical."
- "Añade los meta tags básicos (title, description, canonical) a la nueva página de marketing."

## Archivos

- SKILL.md — 4 KB

## SKILL.md

Reproducido tal cual desde ibelick/ui-skills bajo MIT. Esta sección es el documento original y está en inglés.

## Workflow

1. Identify pages with missing or incorrect metadata (titles, descriptions, canonical, OG tags)
2. Audit against the priority rules below — fix critical issues (duplicates, indexing) first
3. Ensure title, description, canonical, and og:url all agree with each other
4. Verify social cards render correctly on a real URL, not localhost
5. Keep diffs minimal and scoped to metadata only — do not refactor unrelated code
## when to apply

Reference these guidelines when:
- adding or changing page titles, descriptions, canonical, robots
- implementing Open Graph or Twitter card metadata
- setting favicons, app icons, manifest, theme-color
- building shared SEO components or layout metadata defaults
- adding structured data (JSON-LD)
- changing locale, alternate languages, or canonical routing
- shipping new pages, marketing pages, or shareable links

## rule categories by priority

| priority | category | impact |
|----------|----------|--------|
| 1 | correctness and duplication | critical |
| 2 | title and description | high |
| 3 | canonical and indexing | high |
| 4 | social cards | high |
| 5 | icons and manifest | medium |
| 6 | structured data | medium |
| 7 | locale and alternates | low-medium |
| 8 | tool boundaries | critical |

## quick reference

### 1. correctness and duplication (critical)

- define metadata in one place per page, avoid competing systems
- do not emit duplicate title, description, canonical, or robots tags
- metadata must be deterministic, no random or unstable values
- escape and sanitize any user-generated or dynamic strings
- every page must have safe defaults for title and description

### 2. title and description (high)

- every page must have a title
- use a consistent title format across the site
- keep titles short and readable, avoid stuffing
- shareable or searchable pages should have a meta description
- descriptions must be plain text, no markdown or quote spam

### 3. canonical and indexing (high)

- canonical must point to the preferred URL for the page
- use noindex only for private, duplicate, or non-public pages
- robots meta must match actual access intent
- previews or staging pages should be noindex by default when possible
- paginated pages must have correct canonical behavior

### 4. social cards (high)

- shareable pages must set Open Graph title, description, and image
- Open Graph and Twitter images must use absolute URLs
- prefer correct image dimensions and stable aspect ratios
- og:url must match the canonical URL
- use a sensible og:type, usually website or article
- set twitter:card appropriately, summary_large_image by default

### 5. icons and manifest (medium)

- include at least one favicon that works across browsers
- include apple-touch-icon when relevant
- manifest must be valid and referenced when used
- set theme-color intentionally to avoid mismatched UI chrome
- icon paths should be stable and cacheable

### 6. structured data (medium)

- do not add JSON-LD unless it clearly maps to real page content
- JSON-LD must be valid and reflect what is actually rendered
- do not invent ratings, reviews, prices, or organization details
- prefer one structured data block per page unless required

### 7. locale and alternates (low-medium)

- set the html lang attribute correctly
- set og:locale when localization exists
- add hreflang alternates only when pages truly exist
- localized pages must canonicalize correctly per locale

### 8. tool boundaries (critical)

- prefer minimal changes, do not refactor unrelated code
- do not migrate frameworks or SEO libraries unless requested
- follow the project's existing metadata pattern (Next.js metadata API, react-helmet, manual head, etc.)

## review guidance

- fix critical issues first (duplicates, canonical, indexing)
- ensure title, description, canonical, and og:url agree
- verify social cards on a real URL, not localhost
- prefer stable, boring metadata over clever or dynamic
- keep diffs minimal and scoped to metadata only

## Dónde encaja

- Categoría: [SEO y GEO](https://skillsagentes.com/categorias/seo-geo.md) — Keywords, auditorías on-page, datos estructurados y visibilidad en respuestas de IA.
- Creador: [ibelick](https://skillsagentes.com/creators/ibelick.md) — 7 skills en el directorio
- [Todas las skills](https://skillsagentes.com/skills.md)
- [Ranking de instalaciones](https://skillsagentes.com/ranking.md)

## Otras skills del mismo repositorio

- [Create Design Md](https://skillsagentes.com/skills/ibelick/ui-skills/create-design-md.md): Crea o actualiza un DESIGN.md desde un repositorio o web pública: documenta el lenguaje de diseño, reconstruye el sistema visual y extrae tokens y pautas de evidencia. No modifica código fuente ni convierte patrones accidentales en diseño.
- [Improve Ui](https://skillsagentes.com/skills/ibelick/ui-skills/improve-ui.md): Audita una interfaz contra su diseño, detecta problemas de UI verificados y escribe planes autocontenidos sin tocar código. Útil para revisar, refinar o limpiar sin cambiar la identidad, ver deriva del design system o preparar un handoff.
- [Ui Skills Root](https://skillsagentes.com/skills/ibelick/ui-skills/ui-skills-root.md): Úsalo antes de trabajo relacionado con UI para seleccionar el contexto de UI Skills más pequeño y útil a través de la CLI ui-skills.
- [Baseline Ui](https://skillsagentes.com/skills/ibelick/ui-skills/baseline-ui.md): Pule rápido el código de interfaz corrigiendo espaciado, jerarquía, tipografía y pequeños problemas de layout. Úsalo cuando la interfaz necesite una limpieza o un pulido rápido.
- [Fixing Accessibility](https://skillsagentes.com/skills/ibelick/ui-skills/fixing-accessibility.md): Audita y corrige problemas de accesibilidad HTML: ARIA, navegación por teclado, gestión del foco, contraste de color y errores de formulario. Úsalo al añadir controles interactivos, formularios, diálogos o revisar WCAG.

## Skills relacionadas

- [Baseline Ui](https://skillsagentes.com/skills/ibelick/ui-skills/baseline-ui.md): Pule rápido el código de interfaz corrigiendo espaciado, jerarquía, tipografía y pequeños problemas de layout. Úsalo cuando la interfaz necesite una limpieza o un pulido rápido.
- [Create Design Md](https://skillsagentes.com/skills/ibelick/ui-skills/create-design-md.md): Crea o actualiza un DESIGN.md desde un repositorio o web pública: documenta el lenguaje de diseño, reconstruye el sistema visual y extrae tokens y pautas de evidencia. No modifica código fuente ni convierte patrones accidentales en diseño.
- [Fixing Accessibility](https://skillsagentes.com/skills/ibelick/ui-skills/fixing-accessibility.md): Audita y corrige problemas de accesibilidad HTML: ARIA, navegación por teclado, gestión del foco, contraste de color y errores de formulario. Úsalo al añadir controles interactivos, formularios, diálogos o revisar WCAG.
- [Fixing Motion Performance](https://skillsagentes.com/skills/ibelick/ui-skills/fixing-motion-performance.md): Audita y corrige problemas de rendimiento en animaciones: layout thrashing, propiedades del compositor, movimiento ligado al scroll y desenfoques. Úsalo si las animaciones van a tirones o revisas el rendimiento de animaciones CSS/JS.
- [Improve Ui](https://skillsagentes.com/skills/ibelick/ui-skills/improve-ui.md): Audita una interfaz contra su diseño, detecta problemas de UI verificados y escribe planes autocontenidos sin tocar código. Útil para revisar, refinar o limpiar sin cambiar la identidad, ver deriva del design system o preparar un handoff.

---

Skills Agentes · [Índice de páginas en markdown](https://skillsagentes.com/sitemap.md) · [Inicio](https://skillsagentes.com/index.md)