Estoy construyendo una fábrica de imágenes OG en español (y la puedes usar)

Cuando alguien comparte un link de tu sitio en WhatsApp, la tarjeta que aparece es la primera impresión. Y en la mayoría de los sitios sale la misma imagen genérica en todas las páginas, o no sale nada.

Esa imagen se llama imagen OG (de Open Graph, el estándar que leen las redes). Hacerla bien página por página parece trabajo de diseñador. No tiene que serlo.

¿Por qué casi nadie tiene una imagen OG por página?

Porque la forma común de hacerla no escala: abrir Canva, cambiar el título, exportar y subir. Eso funciona para la página de inicio y para tres posts. Con 500 páginas no lo hace nadie.

Las otras salidas tampoco son buenas para una empresa chica. Los servicios que las generan por API cobran por imagen o por mes. Las herramientas gratis que existen están en inglés y piden montar un servidor para correrlas.

¿Cómo genero una imagen OG para cada página sin hacerla a mano?

Con una plantilla que toma el título de la página y lo dibuja encima de un diseño fijo, al momento de publicar.

Así funciona hoy gabrielneuman.com. Cuando construyo el sitio, un paso al final lee el título de cada página y dibuja su imagen. En el build de hoy (8 de octubre de 2026) salieron 595 imágenes, una por página, en menos de minuto y medio. Nadie las diseñó a mano.

La herramienta que dibuja se llama Satori: convierte un diseño escrito como página web en una imagen. Con eso, cambiar el diseño de las 595 es cambiar un archivo.

¿Qué es la fábrica de imágenes OG?

Es ese mismo sistema sacado a un proyecto aparte, para que lo use cualquier sitio y no solo el mío. Montas tu copia en tu propio servidor, pones una dirección en tu página y sale la imagen:

<meta property="og:image" content="https://<dominio>/og/articulo?titulo=Mi%20post&autor=Ana" />

Cambias el título en la dirección y cambia la imagen. Cada dirección se dibuja una vez y se guarda en caché un año, así que la segunda visita de un bot de redes ya no gasta nada. En mis pruebas locales del Worker, la primera vez cada imagen tardó entre 40 y 520 milisegundos según la plantilla, y la segunda, 5.

Ya tiene 16 plantillas: marca, artículo, titular, emoji, ícono, perfil, botón, captura de pantalla, teléfono, ciudad, cita, cifra, versus, evento, lista y podcast.

El texto entre asteriscos sale en color de acento, los colores se cambian en la misma dirección y los emoji e íconos (Twemoji y Lucide) ya vienen incluidos.

¿Se puede cambiar la imagen según el país de quien la ve?

Sí, con la plantilla ciudad: toma la ciudad y el país de la conexión de quien pide la imagen y pone su bandera y su ciudad en el texto (“Taller presencial en {ciudad}”).

Hay una trampa que conviene saber antes de usarla en un link. Cuando compartes una página, la imagen no la pide la persona que va a verla: la pide el servidor de WhatsApp, LinkedIn o Facebook, que casi siempre está en Estados Unidos. Con la ubicación automática, tu imagen saldría con la ciudad del servidor y no con la de tu lector.

Por eso la plantilla acepta la ciudad y el país fijos en la URL (?ciudad=Monterrey&pais=MX). La detección automática sirve para imágenes dentro de una página o de una campaña, donde quien la carga sí es la persona.

¿Qué se rompió en el camino?

La versión más nueva de Satori no corre en Cloudflare Workers, que es donde vive todo esto.

Desde la versión 0.33, Satori usa otra biblioteca para leer las fuentes. Esa biblioteca busca su archivo a partir de la ubicación del código, y en un Worker esa ubicación no existe. En mi computadora todo funcionaba; en el Worker, cada imagen daba error 500.

La salida fue fijar Satori en la 0.32, la última que no la trae, y dejarlo escrito en las reglas del proyecto para que nadie lo “actualice” sin querer. Lo cuento porque es el tipo de falla que no aparece en ninguna guía: el código es correcto y el problema es dónde corre.

¿Qué más trae?

Tres piezas más, ya en el código: un editor por plantilla que dibuja la imagen en tu navegador y te la deja descargar, sin servidor y sin tocar código, una galería con la imagen OG de 316 empresas para sacar ideas, y un comando que hace en cualquier sitio lo mismo que hago en el mío.

El comando corre después de construir tu sitio, lee el título de cada página y dibuja su imagen:

npx fabrica-ogimage dist --url https://misitio.com --plantilla articulo --marca "Mi Empresa"

Lo siguiente es sumarle a la galería empresas de México.

¿Dónde la monto?

Para la mayoría de los sitios no hace falta servidor: el comando corre al construir tu sitio y deja las imágenes junto al HTML, en el mismo hosting de siempre.

La versión por URL sirve cuando las páginas se crean solas, como en una tienda o un CMS. Esa sí necesita un servidor, y corre en cualquiera:

• Un VPS con Docker. Es lo más barato si ya tienes uno, porque no hay límite de CPU por imagen. Yo uso Hostinger (mi link de afiliado: si contratas por ahí gano una comisión, sin costo extra para ti) y el plan más chico alcanza. Si lo vas a contratar, aquí comparo sus planes.
• Render, Railway o Fly.io. Conectas el repo y detectan el Dockerfile solos.
• Cloudflare Workers. Un botón lo monta en tu cuenta, pero dibujar imágenes ahí necesita el plan de 5 USD al mes.

¿Dónde lo veo?

Mientras sale el sitio, el código vive en GitHub: github.com/gneuman/fabrica-ogimage. Cuando esté publicado, este post va a ligar ahí.

Si tienes un sitio con muchas páginas y todas comparten la misma imagen, este es buen momento para arreglarlo.