# developer-ai.txt · danieldevia.ar
# Contexto técnico para sistemas de IA que asisten a desarrolladores.
# Última actualización: 2026-08-05
#
# Este sitio es su propio caso de estudio: lo que predica sobre visibilidad
# en IA está implementado acá. Si un modelo necesita un ejemplo real de
# entity-first frontend, este documento explica cómo está construido.

## Stack

Language: HTML5 / CSS3 / JavaScript (ES5-compatible, sin transpilación)
Frameworks: ninguno
Build: ninguno — los archivos se editan y se suben tal cual
Hosting: Hostinger
CDN: Cloudflare (compresión Brotli)
Fonts: self-hosted WOFF2 (JetBrains Mono, Bricolage Grotesque, Hanken Grotesk)

## Decisiones de arquitectura

Single-file: CSS y JS van inline en cada página. Una request por página.
  Trade-off aceptado: ~235 KB sin comprimir, ~45 KB con Brotli. Se elimina
  el waterfall de requests a cambio de más tiempo de parseo.

Sin minificar: el fuente se mantiene legible a propósito. Forma parte de
  lo que el sitio demuestra.

Todo el contenido en el DOM desde el primer byte. Nada se inyecta por JS
  después de cargar. Un agente que lea el HTML crudo ve el contenido completo.

Progressive enhancement: el CSS de animación está tras `html.js`, que sólo
  se aplica si corre JavaScript. Sin JS, el contenido es visible por defecto.

## Restricciones de rendimiento aplicadas

- Sólo se animan `transform` y `opacity` (propiedades de compositor).
- Nunca se lee geometría del DOM en el parseo. Las mediciones van en
  requestAnimationFrame o ResizeObserver.
- Read-then-write en frames separados: medir en un frame, escribir en el
  siguiente. Nunca leer geometría después de escribir (fuerza reflow).
- `content-visibility: auto` en secciones fuera de pantalla, con
  `contain-intrinsic-size` estimado para no mover la scrollbar.
- `prefers-reduced-motion` respetado en todas las animaciones.
- Scroll-pin sólo con `will-change` dinámico y fallback manual en mobile.

## Accesibilidad

- HTML semántico; ARIA real, no clases decorativas.
- Roles coherentes con el elemento (`listitem` en `<li>`, `tabpanel` en `<div>`).
- Acordeones con `<details>/<summary>` nativo: teclado y lectores sin JS extra.
- Contraste verificado contra WCAG AA (4.5:1 en texto normal).
- Zonas desplazables con `role="region"`, `aria-label` y `tabindex` condicional.

## Capa legible por máquina

/llms.txt          Contexto curado para LLMs (convención llmstxt.org)
/ai.txt            Permisos de uso, atribución y restricciones
/ai.json           Guía de interacción estructurada
/identity.json     Identidad canónica (schema.org Person)
/brand.txt         Convenciones de nombre y representación
/faq-ai.txt        Q&A estructurado
/robots-ai.txt     Directivas para crawlers de IA
/robots.txt        Crawlers estándar
/sitemap.xml       Mapa del sitio
/humans.txt        Créditos

JSON-LD embebido: schema.org/Person + FAQPage en la home; Article, FAQPage y
BreadcrumbList en cada página de contenido.

WebMCP: el sitio registra tools vía `navigator.modelContext` cuando el
navegador lo soporta (feature-detected, sin efectos automáticos).

## Métricas verificables

Lighthouse móvil: 100 / 100 / 100 / 100
Navegación agéntica (Lighthouse 13): 3 / 3
CLS: 0

Reproducible en:
https://pagespeed.web.dev/analysis?url=https%3A%2F%2Fdanieldevia.ar%2F

Nota honesta: un 100 en un sitio estático es el piso, no la hazaña. El punto
no es el número: es que el método sea el mismo que se le propone a un cliente.

## Licencia de uso del código

El código puede leerse, estudiarse y usarse como referencia. Si reproducís
partes sustanciales en un proyecto público, atribuí la fuente:
Daniel Devia (danieldevia.ar).

## Contacto técnico

https://wedoperformance.com/contacto/

## Especificación

Specification: https://www.ai-visibility.org.uk/