Resumen. El sitio está preparado para buscadores: cada página tiene su título con la plantilla «… | KopTup», una URL canónica en https://www.koptup.com, datos estructurados (JSON-LD) y una imagen para redes; sitemap.xml y robots.txt dicen qué indexar y qué no. La analítica (Google Analytics 4, Google Ads y LinkedIn) está programada pero hoy no está activa en producción: depende de tres variables de Vercel y del consentimiento del visitante. En lo legal, los tres formularios que piden datos (contacto, solicitar demo y «Prueba con tu documento») exigen la autorización de la Ley 1581 de 2012 y guardan la prueba con la versión de la política que fija el servidor; el admin atiende los derechos del titular en Admin › Privacidad (buscar, exportar y suprimir) y un job anonimiza lo vencido; hay páginas de privacidad, términos y cookies que describen lo que el sistema hace de verdad, y un banner de cookies.

Esta página describe lo que hace el código de main; no es asesoría legal.

1. Vista general
2. SEO
3. Analítica
4. Legal
5. Limitaciones conocidas
6. Para desarrolladores: archivos clave
7. Páginas relacionadas

flowchart LR
    classDef visitante fill:#dbeafe,stroke:#2563eb,color:#1e3a8a
    classDef sistema fill:#e0e7ff,stroke:#4f46e5,color:#312e81
    classDef admin fill:#fef3c7,stroke:#d97706,color:#78350f
    classDef externo fill:#f1f5f9,stroke:#64748b,color:#334155

    subgraph SEO["SEO: para buscadores y redes"]
        T["Título y descripción por página"]:::sistema
        C["Canonical en www.koptup.com"]:::sistema
        J["JSON-LD por página"]:::sistema
        O["Imagen para redes (og:image)"]:::sistema
        S["sitemap.xml y robots.txt"]:::sistema
    end
    subgraph AN["Analítica: solo con consentimiento"]
        B["Banner de cookies"]:::visitante
        G["GA4"]:::externo
        A["Google Ads"]:::externo
        L["LinkedIn Insight Tag"]:::externo
        E["5 eventos: lead, demo, subida, WhatsApp, plan"]:::sistema
    end
    subgraph LE["Legal: Ley 1581"]
        F["Autorización en formularios"]:::visitante
        P["Prueba guardada en MongoDB"]:::sistema
        PG["Páginas /privacy, /terms y /cookies"]:::sistema
    end
    GOO["Google y redes sociales"]:::externo
    EQ["Equipo de KopTup"]:::admin

    SEO --> GOO
    B -->|"Aceptar"| G
    B -->|"Aceptar"| A
    B -->|"Aceptar"| L
    E --> G
    F --> P --> EQ

Tres frentes independientes: lo que ven los buscadores, lo que se mide (si el visitante acepta) y lo que se guarda de cada persona.

• Plantilla: "<título de la página> | KopTup", con un máximo de 60 caracteres contando el sufijo. La única excepción es el inicio, que pone la marca primero: «KopTup | IA que responde con los documentos de tu empresa».
• Dónde se definen: apps/web/src/lib/seo-config.ts tiene el título, la descripción, la canonical y la imagen de cada página; cada layout.tsx o page.tsx las aplica con generateMetadata('<clave>'). Las páginas privadas (cuenta, activación) usan privatePageMetadata(título, ruta): título propio, noindex, nofollow y canonical a su propia ruta, o ninguna si la URL lleva un token.
• Panel y portal: /admin y /dashboard entregan en el HTML el título del área («Panel de administración | KopTup», «Mi portal | KopTup»); en el navegador cada sección lo afina, por ejemplo «Solicitudes de demo · Panel | KopTup» o «Mis demos · Mi portal | KopTup» (components/seo/AreaDocumentTitle.tsx, textos en pageTitles).
• Control automático: node apps/web/scripts/check-titles.mjs simula cómo Next arma cada título y falla si alguno pasa de 60 caracteres o repite la marca. Corre en CI (Operación y despliegue › 3).
• No se usa la meta keywords (Google la ignora).

Títulos reales de las páginas principales (leídos del HTML que entrega el sitio):

• El dominio canónico es https://www.koptup.com (con www). Está fijo en apps/web/src/lib/site.ts (SITE_URL) y de ahí salen la canonical, og:url, el JSON-LD, el sitemap y los enlaces que generan las demos.
• https://koptup.com/ responde con una redirección permanente (308) a https://www.koptup.com/.
• Cada página de contenido declara su propia canonical (por ejemplo https://www.koptup.com/rag/salud); también las páginas de cuenta. La página 404 y las rutas con un token en la URL (/activar/<token>) no declaran canonical. /pricing redirige de forma permanente (308) a /services#planes-rag.
• Idiomas: español e inglés comparten la misma URL (el idioma va en la cookie locale), así que no hay hreflang. Google ve el español, que es el idioma por defecto. Decisión: por eso el title, la description y las etiquetas og de cada página están en español también cuando el visitante eligió inglés (el contenido sí cambia). Traducirlos por cookie le mostraría a Google metadatos distintos para la misma URL.

A la izquierda, el inicio de /sitemap.xml; a la derecha, /robots.txt.

/sitemap.xml lo genera apps/web/src/app/sitemap.ts y hoy tiene 34 URL (16 fijas y las demos abiertas):

• La fecha de modificación es fija (2026-06-29) para no marcar todo el sitio como «cambiado hoy» en cada despliegue.
• Las demos «Con solicitud», «Solo por invitación» o desactivadas no se listan: a quien no tiene acceso le muestran una pantalla noindex.
• La lista de demos sale del catálogo que edita el admin (GET /api/demo-catalog, lib/sitemap-demos.ts). El sitemap se regenera como mucho cada hora, así que un cambio de modo tarda hasta una hora en reflejarse. Si el backend no responde, usa la tabla de respaldo del código (lib/demo-access-defaults.ts).

/robots.txt (apps/web/public/robots.txt) permite todo menos las zonas privadas o con datos de sesión: /dashboard, /admin, /api/, /login, /register, /forgot-password, /reset-password, /auth/, /test, /liquidacion, /activar/, /propuesta/, /demo-acceso/ y cualquier URL con token= o sessionId=. Bingbot repite esas reglas con Crawl-delay: 5; AhrefsBot, SemrushBot, DotBot, MJ12bot, GPTBot y CCBot están bloqueados por completo. Al final declara el sitemap con www.

Tres mecanismos, del más fuerte al más débil:

Los buscadores leen estos bloques para entender quién es KopTup, qué vende y cuáles son las preguntas frecuentes. Tipos por página (leídos del HTML del sitio):

Los precios que aparecen en el JSON-LD salen del mismo archivo que los precios visibles (lib/rag-plans.ts), así que no se desalinean. El bloque Organization solo afirma lo que el sitio muestra: areaServed Colombia, perfiles en sameAs tomados de SOCIAL_LINKS (lib/site.ts, los mismos del pie de página) y preguntas frecuentes que coinciden con las páginas; no declara año de fundación, número de empleados ni países atendidos.

Twitter usa la tarjeta summary_large_image con la misma imagen. La imagen generada se ve en Mapa del sitio.

• /llms.txt: resumen en texto de quién es KopTup y qué vende, pensado para asistentes de IA. Dice lo mismo que el sitio (sin año de fundación ni datos que no se puedan comprobar) y aclara que las demos usan datos de ejemplo. Es un archivo fijo de public/: si cambia el dominio o la oferta, hay que editarlo a mano.
• Verificación de Google Search Console: dos códigos en los metadatos del layout raíz y un archivo google….html en public/.
• manifest.json e íconos para instalar el sitio en el celular.

En producción no se mide nada. Al revisar www.koptup.com el 9 de octubre de 2026 el HTML no carga ninguna etiqueta de Google ni de LinkedIn, y por eso tampoco aparece el banner de cookies: el código solo lo muestra si hay al menos una etiqueta configurada. Para encender la medición, sigue la sección 3.6.

Un ID con otro formato se ignora (la etiqueta no se carga). La CSP de next.config.js solo abre los dominios de Google o de LinkedIn si su variable existe en ese build.

sequenceDiagram
    autonumber
    actor V as Visitante
    participant W as Web (navegador)
    participant LS as localStorage
    participant G as Google (gtag.js)
    participant L as LinkedIn

    V->>W: abre cualquier página
    W->>W: ¿hay alguna etiqueta configurada en el build?
    alt ninguna
        W-->>V: sin banner y sin medición
    else al menos una
        W->>LS: lee cookie_preferences
        alt nunca eligió
            W-->>V: muestra el banner (salvo en /cookies)
            V->>W: Aceptar, Rechazar o Configurar cookies
            W->>LS: guarda la elección con la fecha
        end
        opt aceptó analítica o marketing
            W->>W: consentimiento por defecto según su elección
            W->>G: carga gtag.js y config de GA4 o Ads, sin recargar
        end
        opt aceptó marketing y hay Partner ID
            W->>L: carga Insight Tag
        end
        Note over W,G: En /auth, /reset-password y /activar (la URL lleva tokens) y en /embed (el chat en el sitio de un cliente) nunca se cargan
    end

Nada se carga antes de que la persona elija; «Rechazar» deja solo las cookies esenciales. En /embed/* (el chat de widget.js y del iframe en el sitio de un cliente) no se muestra el banner ni se carga ninguna etiqueta, aunque el visitante haya aceptado cookies en koptup.com: KopTup no mide a los visitantes de sus clientes (NO_TRACKING_PATHS en components/analytics/Analytics.tsx).

Detalles del consentimiento (components/analytics/Analytics.tsx y lib/cookie-consent.ts):

• La elección se guarda en localStorage['cookie_preferences'] como { essential, functional, analytics, marketing, timestamp }. Si el navegador bloquea el almacenamiento, se respeta durante la visita.
• Antes de cargar Google se declara el modo de consentimiento: analytics_storage según «analítica» y ad_storage, ad_user_data y ad_personalization según «marketing»; con marketing rechazado se activa ads_data_redaction.
• Si la persona retira el consentimiento en /cookies, Google pasa a denied, GA4 se desactiva y la página se recarga para que ninguna etiqueta siga activa (LinkedIn no se puede apagar en caliente).
• La elección se sincroniza entre pestañas del mismo sitio.

Cómo se ve el banner y el panel de /cookies en escritorio, con un GIF, está en Flujos del visitante › Flujo 5. En el celular:

Banner en /rag a 390 × 844 (entorno local con un ID de GA4 ficticio; las peticiones a Google se bloquearon y antes de elegir no hubo ninguna).

1. Configurar cookies: lleva a /cookies, con un interruptor por categoría.
2. Rechazar: guarda «solo esenciales».
3. Aceptar: activa funcionales, analítica y marketing, y carga las etiquetas en ese momento.

Todos pasan por track() (lib/analytics.ts), que no hace nada si no hay consentimiento, si la etiqueta no está cargada o si se llama en el servidor, y nunca envía datos personales (ni nombre, ni email, ni teléfono). Van a GA4 y, si está cargada, a Google Ads.

flowchart LR
    classDef visitante fill:#dbeafe,stroke:#2563eb,color:#1e3a8a
    classDef sistema fill:#e0e7ff,stroke:#4f46e5,color:#312e81
    classDef externo fill:#f1f5f9,stroke:#64748b,color:#334155

    CON["/contact"]:::visitante
    SOL["/solicitar-demo"]:::visitante
    CHAT["/demo/chatbot"]:::visitante
    PLANES["/services, /rag y /chatbots-ia"]:::visitante

    GL["generate_lead"]:::sistema
    WA["whatsapp_click"]:::sistema
    DS["demo_start"]:::sistema
    DU["demo_upload"]:::sistema
    PC["plan_click"]:::sistema
    GA["GA4 y Google Ads"]:::externo

    CON -->|"envío con éxito"| GL
    CON -->|"botón de WhatsApp"| WA
    SOL -->|"envío con éxito"| GL
    SOL -->|"WhatsApp en el formulario y en la confirmación"| WA
    CHAT -->|"primera pregunta"| DS
    CHAT -->|"documento subido"| DU
    PLANES -->|"botón de un plan o solución"| PC
    GL --> GA
    WA --> GA
    DS --> GA
    DU --> GA
    PC --> GA

Cinco eventos en cuatro lugares del sitio.

• Google Ads: el código no tiene etiquetas de conversión propias. Se vincula GA4 con Google Ads, se marcan en GA4 como eventos clave los que interesan (por ejemplo generate_lead y demo_upload) y se importan en Ads como conversiones de GA4.
• LinkedIn: el Insight Tag mide visitas y audiencias; las conversiones se crean en Campaign Manager (por ejemplo, por URL de la página de gracias).
• Para ver plan_name y los demás parámetros en los informes, hay que registrarlos en GA4 como dimensiones personalizadas.

1. Crea la propiedad de GA4 (y, si aplica, la cuenta de Google Ads y el Insight Tag de LinkedIn) y copia sus IDs.
2. En Vercel, proyecto koptup, entorno Production: agrega NEXT_PUBLIC_GA_ID, NEXT_PUBLIC_GOOGLE_ADS_ID y/o NEXT_PUBLIC_LINKEDIN_PARTNER_ID.
3. Redespliega la web: las NEXT_PUBLIC_* se fijan al compilar.
4. Abre www.koptup.com en una ventana privada: debe aparecer el banner. Pulsa Aceptar y comprueba en el «Tiempo real» de GA4 que llega la visita.
5. Envía un formulario de prueba y busca generate_lead en GA4; márcalo como evento clave y configura las conversiones (sección 3.5).

El formulario con todos los datos llenos menos la autorización, después de pulsar «Enviar solicitud».

1. Casilla de autorización, sin marcar por defecto.
2. Enlace a la política (/privacy).
3. Error si no se marca: «Debes autorizar el tratamiento de tus datos para enviar la solicitud.»

La única información personal que pide la demo con documento propio es el email.

1. Casilla de autorización (obligatoria).
2. Enlace a la política de privacidad.
3. Email: «Es lo único que te pedimos».

Final del formulario de /contact después de pulsar «Enviar mensaje» sin marcar la casilla.

1. Casilla de autorización, sin marcar por defecto.
2. Enlace a la política de privacidad (/privacy).
3. Error junto a la casilla: «Marca la casilla de autorización para enviar el mensaje.» Arriba del formulario aparece «Revisa los campos marcados.»

Los errores que devuelve el servidor también se muestran junto al campo que falló (por ejemplo, «El nombre es muy largo (máximo 120 caracteres).»); el límite de envíos y la falta de conexión tienen su propio mensaje.

De punta a punta, la autorización de una solicitud de demo queda a la vista del equipo:

GIF: la persona autoriza y envía; el equipo ve la solicitud y, en el detalle, la fecha y la versión de la política.

Admin › Solicitudes de demo › detalle (persona y empresa ficticias).

1. Autorización de datos: «Autorizó el tratamiento de sus datos (Ley 1581 de 2012) el · política 2026-10».
2. Página de origen desde la que se envió.

Si la misma persona vuelve a enviar el formulario con una solicitud abierta de menos de 30 días, las demos se suman a esa solicitud y la prueba de la autorización se reemplaza por la nueva.

Cuando publiques una política nueva: actualiza el texto de /privacy (en apps/web/messages/es.json y en.json, claves privacyPage, incluida la versión que muestra la página), cambia PRIVACY_POLICY_VERSION en Railway (por ejemplo 2027-01) y redespliega los dos. Las autorizaciones nuevas quedarán con la versión nueva y las viejas conservan la suya. El backend siempre guarda su propia versión: la que envíe un formulario se ignora.

La IP nunca se guarda en claro en MongoDB: solo su hash. Cuánto tiempo se conserva cada dato y cómo se borra está en Flujos técnicos › 8.3; los campos de cada colección, en Modelos de datos.

Las tres comparten diseño (encabezado azul con la fecha, secciones numeradas y una nota final), tratan de «tú» como el resto del sitio, están en español y en inglés, su pie muestra el año en curso y sus textos viven en apps/web/messages/es.json y en.json (privacyPage, termsPage, cookiesPage). Describen solo lo que el sistema hace de verdad; no las ha revisado un abogado (es una acción pendiente del dueño, ver Estado y próximos pasos). Las capturas de cada una completa están en Páginas públicas › 13.

La sección «Tus derechos» de la política de privacidad.

1. Los derechos de la Ley 1581, entre ellos quejarse ante la Superintendencia de Industria y Comercio.
2. Cómo ejercerlos: escribiendo al email de contacto, con lo que se pide y cómo verificar que eres el titular.
3. Plazos de respuesta de la ley: 10 días hábiles para consultas y 15 para reclamos.

Cuando llega una solicitud, el admin la atiende en Admin › Privacidad: busca a la persona por su email, le entrega sus datos en un JSON o los suprime (ver Manual del administrador › Privacidad).

El banner y su panel de preferencias están en la sección 3.3. La tabla de /cookies lista lo que el sitio guarda de verdad en el navegador (revisado en el código), en tres categorías: esenciales (siempre activas), analítica y publicidad (opcionales). No hay cookies «funcionales» opcionales: la categoría se quitó de la página y se guarda apagada.

Las esenciales que lista la página.

1. accessToken y refreshToken: la sesión iniciada.
2. locale: el idioma; solo se crea si la persona cambia el idioma (por eso es esencial: guarda una elección que ella pidió).
3. cookie_preferences: la elección de cookies, en el almacenamiento local.
4. Claves de las demos (koptup…, demo:…): datos de ejemplo y llaves de dueño de los bots del chatbot.

Al guardar, la página confirma en el propio panel («Guardamos tus preferencias.»), sin ventanas emergentes del navegador.

• Páginas públicas: capturas completas de /privacy, /terms y /cookies.
• Flujos del visitante: banner y preferencias de cookies paso a paso, y qué mide cada flujo.
• Flujos técnicos › 8: recorrido de los datos personales y retención.
• Operación y despliegue: variables de entorno y cómo redesplegar.
• Modelos de datos · Glosario y preguntas
• Plan original: Comercial, marketing y legal, Legal y Landings SEO.