GEO con HTML: Guía completa de implementación

Los sitios HTML estático implementan GEO a través del bloque head: añade meta tags completos, schema JSON-LD Article, URL canónica y tags Open Graph. Añade robots.txt y llms.txt a la raíz. No se requiere framework — HTML puro es completamente compatible con GEO y frecuentemente más rápido que los frameworks JS.

HTML estático tiene una ventaja clave para GEO: los crawlers de IA reciben HTML estático directamente sin necesidad de ejecutar JavaScript. Sin hidratación, sin problemas de renderizado del lado cliente, sin overhead de framework.

Bloque head HTML completo

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <!-- BÁSICOS -->
  <title>Cómo implementar GEO en HTML | Mi Sitio</title>
  <meta name="description" content="GEO en HTML estático requiere meta tags, JSON-LD y estructura semántica. Guía completa con ejemplos.">
  <meta name="author" content="Mi Empresa">
  <link rel="canonical" href="https://misitio.com/geo-html">

  <!-- OPEN GRAPH -->
  <meta property="og:type" content="article">
  <meta property="og:title" content="Cómo implementar GEO en HTML">
  <meta property="og:description" content="Guía completa de GEO para HTML estático">
  <meta property="og:url" content="https://misitio.com/geo-html">
  <meta property="og:site_name" content="Mi Sitio">
  <meta property="og:image" content="https://misitio.com/og/geo-html.jpg">
  <meta property="og:locale" content="es_ES">

  <!-- FECHAS DE ARTÍCULO (señal de recencia para scoring de IA) -->
  <meta property="article:published_time" content="2026-04-18T00:00:00Z">
  <meta property="article:modified_time" content="2026-04-18T00:00:00Z">
  <meta property="article:author" content="https://misitio.com/author/mi-empresa">
  <meta property="article:section" content="Guías técnicas">
  <meta property="article:tag" content="GEO">

  <!-- CONTROL DE CRAWLERS -->
  <meta name="robots" content="index, follow">

  <!-- SCHEMA JSON-LD -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "Article",
    "headline": "Cómo implementar GEO en HTML",
    "description": "Guía completa de GEO para HTML estático con meta tags y JSON-LD",
    "author": {
      "@type": "Organization",
      "name": "Mi Empresa"
    },
    "publisher": {
      "@type": "Organization",
      "name": "Mi Sitio",
      "logo": {
        "@type": "ImageObject",
        "url": "https://misitio.com/logo.png"
      }
    },
    "datePublished": "2026-04-18T00:00:00Z",
    "dateModified": "2026-04-18T00:00:00Z",
    "mainEntityOfPage": {
      "@type": "WebPage",
      "@id": "https://misitio.com/geo-html"
    }
  }
  </script>
</head>

Estructura semántica del body

<body>
  <main>
    <article>
      <header>
        <h1>Cómo implementar GEO en HTML</h1>
        <time datetime="2026-04-18">18 de abril, 2026</time>
        <address rel="author">Mi Empresa</address>
      </header>

      <section>
        <h2>¿Qué meta tags necesita una página HTML para GEO?</h2>
        <!-- Answer capsule: respuesta directa en el primer párrafo -->
        <p>
          Una página HTML necesita como mínimo: title, meta description de ≤160 chars,
          URL canónica, tags Open Graph completos, article:published_time,
          article:modified_time y schema JSON-LD Article.
        </p>
        <!-- Explicación extendida a continuación -->
      </section>

      <section>
        <h2>Cómo añadir schema FAQPage a HTML estático</h2>
        <p>Añade un segundo bloque script JSON-LD en el head para el schema FAQPage.</p>
      </section>

      <footer>
        <p>Fuentes: <cite>Princeton GEO Paper, arxiv.org/abs/2311.09735</cite></p>
      </footer>
    </article>
  </main>
</body>

robots.txt

Coloca robots.txt en la raíz de tu sitio (mismo nivel que index.html):

User-agent: GPTBot
Allow: /

User-agent: OAI-SearchBot
Allow: /

User-agent: ClaudeBot
Allow: /

User-agent: Claude-User
Allow: /

User-agent: Claude-SearchBot
Allow: /

User-agent: PerplexityBot
Allow: /

User-agent: Google-Extended
Allow: /

User-agent: BingBot
Allow: /

Sitemap: https://misitio.com/sitemap.xml
Sitemap: https://misitio.com/llms.txt

llms.txt

Coloca llms.txt en la raíz de tu sitio:

# Nombre de Mi Sitio
> Descripción de una línea de qué hace tu sitio y a quién sirve.

## Contenido principal
- [Guía GEO](https://misitio.com/guia-geo): Guía completa de Generative Engine Optimization
- [Implementación técnica](https://misitio.com/tecnico): Meta tags, schema y robots.txt

## Sobre nosotros
- [Quiénes somos](https://misitio.com/about): Equipo y credenciales

Sitemap XML

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://misitio.com/</loc>
    <lastmod>2026-04-18</lastmod>
    <priority>1.0</priority>
  </url>
  <url>
    <loc>https://misitio.com/guia-geo</loc>
    <lastmod>2026-04-18</lastmod>
    <priority>0.9</priority>
  </url>
</urlset>

Actualiza <lastmod> cada vez que actualices el contenido de una página. Esta es la señal de recencia primaria que usan los crawlers de IA.

Schema FAQPage (opcional pero de alto impacto)

Añade esto como un segundo bloque <script type="application/ld+json"> en el head cuando tu página tiene secciones de preguntas y respuestas:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "¿Qué es GEO?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "GEO (Generative Engine Optimization) es la práctica de estructurar contenido para ser citado por motores de IA como ChatGPT, Perplexity y Google AI Overviews. Se enfoca en calidad de respuesta, schema markup y estructura de respuesta directa."
      }
    }
  ]
}
</script>