ListingOK v2 — sitio de marketing

El reto

La primera versión de listingok.com nació como puerta de la app: home, login y poco más. Suficiente para los primeros clientes — insuficiente para crecer por orgánico. El sitio no contaba la propuesta, no segmentaba por tipo de usuario (property manager vs. hotel vs. gestor independiente), y todo el SEO descansaba en un puñado de páginas estáticas que competían entre sí.

El encargo de la v2 fue tratar el sitio como un producto de adquisición, no como una landing. Eso significa tres cosas: (1) capa editorial viva — blog, recursos, casos — que dé razones para volver y para enlazar; (2) páginas por mercado generadas programáticamente para cubrir el long-tail "Airbnb occupancy {ciudad}" en EN y ES; y (3) un funnel medible desde la primera visita hasta el alta, con CTAs distintos para cada segmento y cada bloque.

Lo que construimos

• Rediseño completo del sitio público: nueva home, páginas de producto por capacidad (pricing, channel manager, market insights, analyzer), páginas por segmento (property managers, hoteles, partners) y un sistema de componentes reutilizables que permite armar landings nuevas en horas.
• SEO programático por mercado: páginas autogeneradas con ocupación, ADR y RevPAR por ciudad, alimentadas por los mismos pipelines que dan datos al producto. Una base por idioma, indexable y enlazada desde el blog.
• Hub editorial bilingüe: blog y recursos en EN y ES con rutas separadas (/en/..., /es/...), hreflang completo y sitemaps por idioma (sitemap-en.xml, sitemap-es.xml) — no traducción automática, contenido localizado por mercado.
• Analyzer como puerta de entrada: la herramienta gratuita pegada al sitio en hero y en footer, con su propio embudo medido — del clic al resultado al registro.
• CTAs instrumentados desde el día uno: cada botón lleva data-event y data-source para distinguir "registro desde hero", "registro desde precios" y "registro desde caso de uso". El equipo de marketing decide dónde poner el siguiente euro con datos, no con intuición.
• Páginas de precios y comparativas públicas: política deliberada para acortar el ciclo de venta — el lead que llega a una llamada ya ha visto los rangos.
• Schema.org y metadatos consistentes en cada plantilla (SoftwareApplication, Article, FAQPage donde corresponde) para alimentar resultados enriquecidos.

Decisiones técnicas que importaron

1. SPA en React con SEO real, no "SPA y a rezar"

Mantuvimos la base técnica de la app (React + Vite, servida por Express) pero tratamos el sitio público como un caso de uso aparte: rutas pre-renderizadas para el contenido indexable, fallback al index para deep-links, y un build separado que no arrastra el bundle de la aplicación. Resultado: el bot de Google ve HTML completo, el usuario carga solo lo que necesita.

2. SEO programático compartiendo datos con el producto

Las páginas de mercado por ciudad no son una verticalización de marketing: usan los mismos pipelines de ingesta que alimentan el dashboard de Market Insights dentro de la app. Una sola fuente de verdad, dos consumidores. Cuando se añade un mercado nuevo al producto, el sitio gana páginas indexables sin trabajo adicional.

3. Bilingüe de verdad, no Google Translate

Cada página vive en EN y ES con URLs localizadas (/es/precios/ vs. /en/pricing-revenue-management-software/), hreflang recíproco y sitemaps separados. El blog y los recursos se escriben — no se traducen — para cada mercado. La consecuencia: cada artículo dobla la superficie SEO sin doblar el equipo de contenido.

4. CTAs como métrica de primera, no de tercera

Cada botón "Empieza gratis", "Ver precios", "Probar el Analyzer" lleva atributos data-event="cta_signup" / data-source="hero_home". Eso permite responder a la pregunta que importa — ¿qué bloque de qué página convierte cada euro de tráfico? — sin reconstruirlo después con heatmaps. Regla: si una métrica influye en el roadmap, se mide desde la primera versión.

5. Sistema de componentes para escalar landings

Hero, ficha de capacidad, bloque de testimonio, comparativa, FAQ, CTA strip — todo encapsulado. Una landing nueva (un caso de uso, un partner, una campaña) se monta en horas, no en días, y mantiene tipografía, espaciado y CTAs idénticos al resto del sitio. La consistencia visual deja de depender de la disciplina del que monta la página.

Resultado

La v2 de listingok.com deja de ser una puerta y pasa a ser un motor de adquisición: el sitio publica contenido editorial cada semana, el long-tail por mercado entra en Google con páginas que no existen en la competencia, y el embudo desde la primera visita hasta el alta está medido botón a botón. Internamente, montar una landing nueva es cuestión de componer componentes existentes — el coste marginal de probar un mensaje nuevo es bajo, y por eso se prueban más.

La decisión más infravalorada con perspectiva: compartir datos entre producto y SEO. Las páginas de mercado no son una capa de marketing pegada por encima — son la misma capa que ya alimenta el dashboard del usuario. Esa única decisión convierte cada mejora de producto en mejora de SEO sin coste añadido.