Rey Guerrero: la marca y la web de un restaurante afropacífico, construidas para que Google y la IA sepan quién es el chef

¿Qué problema resolvía?

La autoridad de Rey Guerrero ya existía, pero vivía fuera de su web. El chef y su casa han sido cubiertos por The New York Times —con enlace activo y seguible—, Der Spiegel, El Tiempo, Semana, Caracol y Blu Radio, entre otros; su libro ganó el Gourmand World Cookbook Awards al mejor libro de cultura afroamericana, y ha representado a Colombia en misiones gastronómicas oficiales con embajadas y cancillería (según la página de prensa del propio sitio y la auditoría de backlinks del proyecto). Nada de eso estaba conectado: ninguna máquina podía deducir que el chef del Times, el autor premiado y el embajador gastronómico eran la misma persona.

El problema de marca era gemelo. Una cocina con siglos de historia detrás —el encuentro africano con el Pacífico colombiano— sin un símbolo a su altura: sin un signo propio, el restaurante competía en la misma bolsa visual que cualquier marisquería. Y sin una web que sostuviera ese signo, la marca se quedaba en el letrero de la puerta.

Qué construimos

Un proyecto de dos frentes que se sostienen entre sí: la identidad y el sitio. La web es reyguerrero.co: 38 páginas en HTML5, CSS3 y JavaScript vanilla —sin frameworks de cliente— con un backend PHP para el único formulario del sitio. Antes de escribir una sola página montamos el sistema de plantillas: _template/header.html, _template/footer.html y un esqueleto de página nueva que un script propaga a cualquier archivo marcado, resolviendo la profundidad de cada URL para que el sitio funcione igual en la raíz del dominio o dentro de una subcarpeta.

• Un hero con fuego realFotografía de una cocinera junto al fuego de leña —nada de banco de imágenes ni ilustración generada—, con paralaje de dos capas y 60 chispas dibujadas en un canvas 2D escrito a mano, con resplandor y deriva senoidal para que parezcan brasas y no puntos.
• El libro, hojeable en 3D«Sabores de Resistencia», el libro del chef premiado con el Gourmand World Cookbook Awards, se abre dentro de la web y se pasa página a página con transformaciones CSS 3D puras: sin librerías de flipbook, con navegación por teclado, puntos generados en JavaScript, swipe táctil con umbral y detección de eje, y atrapado de foco dentro del modal.
• Un press kit que se usa, no que se miraLa página de prensa entrega lo que un periodista necesita a las once de la noche: logos en variante clara y oscura, fotos, portada del libro, paquetes pesados, la cobertura ya publicada y una rejilla de datos copiables al portapapeles con un clic por campo.
• Cinco experiencias con página propiaCena privada, conferencia sobre la diáspora, consultoría cultural, expedición al Pacífico y taller de cocina ancestral: el lado B2B del restaurante deja de ser un párrafo y pasa a ser cinco páginas indexables, cada una con su FAQ real y visible.
• 16 páginas de diplomacia gastronómicaUna por país visitado en misión oficial, con fondo geométrico generado en SVG inline —sin una sola petición extra—, enlaces cruzados entre los países de la misma gira y el mismo grafo de datos estructurados apuntando siempre a la misma persona.
• La carta como subsistema propioLa carta tiene su CSS y su JavaScript, navegación por categorías con scroll-spy que arrastra la pestaña activa al centro del carril, fondos que solo se descargan al entrar en pantalla y su propia implementación de brasas, esta sí respetando prefers-reduced-motion y pausándose cuando la pestaña deja de estar visible.
• Un formulario, siete conversacionesReserva, invitar al chef, invitar al investigador, experiencia, prensa, alianza o libro: el mismo endpoint cambia titular, campos visibles y botón según el asunto, muestra solo los campos que ese caso necesita, filtra bots con un honeypot colocado fuera de pantalla —no oculto con display:none, para que el bot que lo detecte lo rellene igual— y recoge el consentimiento con referencia explícita a la Ley 1581 de 2012.

La marca: lo que el emblema esconde

La identidad no ilustra un plato: codifica una cultura. El símbolo central se lee de dos maneras a la vez, y ninguna de las dos es decorativa. De frente es una máscara, con la frontalidad y la simetría de la talla ritual africana. Un segundo después es una jaiba: las tenazas abiertas a los lados, el caparazón marcado por debajo con las muescas del cangrejo de manglar. Rito y producto en el mismo trazo — que es exactamente lo que pasa en esa cocina.

De ahí hacia abajo todo es Pacífico. La banda de espirales que sostiene el emblema es oleaje y es bejuco al mismo tiempo, resuelta con la voluta larga de la forja colonial, y se abre en hojas de monte en las cuatro puntas. Arriba, dos tallos rematan en hoja y en tres esferas: son ojos de cangrejo y son huevas. El conjunto, abierto de brazos y coronado por esos tallos, tiene el porte del rey guerrero que da nombre a la casa.

Y hay una capa que la marca no explica en ninguna parte, porque no se explica: la fertilidad y la sensualidad que la cultura afropacífica nunca separó de la comida. El cuerpo central admite una lectura femenina evidente para quien la busca, y las huevas de los tallos la refuerzan sin nombrarla. Es la misma economía del doble sentido que hay en la música y en el habla del Pacífico: quien solo mira ve un emblema elegante; quien se queda mirando encuentra lo demás. El cierre lo ponen dos detalles de tres milímetros: la regla que flanquea la bajada empieza en tenedor y termina en cuchillo, y bajo ella corre una franja en rojo, verde y oro —los colores panafricanos—. África y cocina, dicho sin una sola palabra.

El sistema que la sostiene es corto a propósito: dos tipografías y no más —una display con serifas para los titulares y una de palo seco para el cuerpo—, tres acentos de color sobre un marrón cálido casi negro, radio de 4 píxeles y botones en píldora. Cero sombras en todo el sitio: no hay una sola box-shadow. La jerarquía se construye con color, escala y espacio, que es como se construye en imprenta. El elemento de firma es minúsculo y aparece en cada página: una palabra en cursiva dorada por titular, siempre una, siempre la que carga el significado.

Bajo el capó

El sitio es HTML estático servido desde cPanel. El núcleo de datos estructurados —WebSite y Organization— se declara una sola vez con @id estables, y cada página añade su propio nodo (Restaurant, Person, Book, Menu, FAQPage, BreadcrumbList) dentro del mismo @graph, referenciando el núcleo en lugar de redeclararlo. Suena obvio y no lo es: en la auditoría del proyecto aparecieron divergencias reales —un mismo @id de Restaurant con tres teléfonos distintos según la página— y se corrigieron una por una, porque un parser que fusiona por @id recibe datos que se contradicen.

• HTML5 + CSS3 + JS vanilla
• Canvas 2D (partículas propias)
• CSS 3D transforms (libro)
• PHP (formulario de contacto)
• schema.org · patrón @graph
• sharp (WebP)
• clean-css + terser
• axe-core (WCAG 2.2 AA)
• cPanel

Este caso combina nuestro servicio de diseño web UX/UI con SEO + GEO integrado desde el primer commit: la marca y la arquitectura de entidad se diseñan a la vez, no una después de la otra.

Qué cambió

Rey Guerrero pasó de tener autoridad dispersa a tener una entidad. Hoy el chef, el restaurante, el libro y las 16 misiones diplomáticas se declaran como un solo grafo con identificadores estables, y el sitio explicita en robots.txt y en llms.txt qué puede hacer cada crawler y en qué temas es fuente autorizada. Es la diferencia entre que una IA encuentre páginas sueltas y que sepa quién es el sujeto de esas páginas.

El ejemplo más concreto es de fidelidad, no de tráfico. En el baseline de citación, ChatGPT afirmaba que el arroz putiao es un plato chino-peruano. Hoy la página del plato abre diciendo, en 43 palabras y sin necesitar contexto previo, que es un arroz tradicional del Pacífico colombiano, originario del Chocó y plato símbolo de Buenaventura — y lo sostiene con la lista de lo que lleva, una cita del chef atribuida a su libro «Sabores de Resistencia» con número de página, y el dato de que lo cocinó en Pekín en octubre de 2019 dentro del Plan de Promoción de Colombia en el Exterior de la Cancillería, y que el People's Daily lo publicó en su edición en español. No prometemos que el motor cambie de opinión mañana: publicamos la corrección donde el motor puede leerla, con la fuente al lado, y la medimos.

Del resto preferimos hablar en cualitativo, que es lo honesto: hay marca donde no la había, un sitio propio y rápido donde antes solo había prensa ajena, y un press kit que responde solo. No publicamos métricas de negocio que no podamos demostrar con fuente.