E-commerce · Servicios · SEO local

Rolo ElectronicsTienda, blog y páginas de servicio con panel propio y SEO medido

Plataforma completa para un negocio de seguridad electrónica en Connecticut y Nueva York: tienda online, blog, páginas de servicio y de ciudad, agendamiento de inspecciones y un panel con analítica propia, Search Console y GA4.

Tecnologías

  • Next.js 16
  • React 19
  • TypeScript
  • Supabase (PostgreSQL + Auth + RLS)
  • Tailwind CSS v4
  • shadcn/ui
  • next-intl
  • Recharts
  • TipTap
  • Resend
  • SheetJS
  • Search Console API
  • GA4 Data API
Sitio de Rolo Electronics, ecommerce de equipos de seguridad e instalación
  • 136

    URLs en el sitemap

  • 35

    páginas locales

  • 30

    artículos de blog

  • ~58

    productos

  • 18

    módulos del panel

  • 3

    idiomas

Mi rol

Desarrollo full stack de la plataforma - tienda, contenido y panel de administración -, más la estrategia SEO/GEO y toda la instrumentación de medición. Entregado a través de NM Tech Studio y en mejora continua desde entonces.

El problema

El negocio vendía equipos de seguridad y además los instalaba, pero son dos cosas que se compran de forma distinta: un producto se mete al carrito, una instalación se cotiza y muchas veces empieza con una inspección en el domicilio. A eso se sumaba un problema más caro: no había forma de saber qué página traía llamadas. Los formularios morían en correos sueltos, no existía ningún evento de conversión, y el sitio competía consigo mismo en varias ciudades.

Qué construí

  • Tienda online con catálogo de ~58 productos, filtros por categoría, marca y rango de precio, ficha de producto, carrito y checkout tanto para invitado como para usuario registrado.
  • Blog de 30 artículos largos organizados por temas: costos de instalación, comparativas de equipos, guías por ciudad y normativa local de permisos de alarma.
  • Páginas de servicio separadas por intención: cámaras, alarmas, domótica, redes, audio multiroom y control de acceso.
  • 35 páginas locales de ciudad - Greenwich, Stamford, Norwalk, Port Chester, Queens, White Plains, Rye y el resto del área - con FAQ propia, zonas cercanas y enlazado entre vecinas.
  • Módulo de agendamiento de inspecciones con horario de atención, fechas bloqueadas y franjas que se ocupan al reservarse.
  • Panel de administración con 18 módulos, agrupados en resumen, comercio, catálogo, operaciones y sistema.
  • Analítica propia de primera parte - sesiones, visitantes, páginas vistas, origen de tráfico, países, clics de contacto por canal - junto a los datos de Search Console y GA4 dentro del mismo panel.
  • Resumen semanal automático por correo: sesiones, visitantes, mensajes, citas, pedidos, ingresos y las búsquedas, páginas y productos más vistos, comparados contra la semana anterior.
  • CMS para navegación, imágenes de sección y páginas editables, para que el cliente cambie contenido sin tocar código.
  • Sitio en tres idiomas (español, inglés y francés) con roles y permisos para el equipo interno.

SEO trabajado con datos, no con intuición

La estrategia salió de auditar el export de Search Console de tres meses - 98 páginas, 217 clics, 54.845 impresiones - cruzado con GA4. Cada cluster con impresiones reales recibió una URL dueña, y el resto pasó a enlazar hacia ella en lugar de competirle.

  • Clusters priorizados por impresiones y posición ponderada: alarmas en Port Chester, domótica en Greenwich, cámaras en Stamford y Queens, audio Sonos.
  • Un solo H1 por página: /services renderizaba dos y /products no tenía ninguno antes de los filtros.
  • Mapa de dueño de palabra clave y enlazado interno para cortar la canibalización entre páginas de la misma ciudad.
  • Cada producto enlaza a la página de servicio que corresponde a su intención: la consulta de modelo va a la ficha, la de instalación a la de servicio.
  • Eventos de GA4 donde antes no había ninguno: clic a teléfono, clic a agendar, envío de formulario y lead confirmado.
  • Captura de gclid, gbraid, wbraid, msclkid, fbclid y todos los utm_* en la primera página de la sesión, para que un lead que convierte tres páginas después conserve el clic que lo trajo.

Agendamiento que termina con un técnico yendo al sitio

El formulario de cita no es un correo suelto: coordina al cliente, al calendario y al equipo técnico en una sola operación.

  • El visitante elige tipo de servicio, día y franja horaria; el calendario respeta el horario de atención, las fechas bloqueadas y las franjas ya reservadas.
  • Al confirmar salen dos correos. Al cliente, el resumen de su cita con un enlace para añadirla a Google Calendar.
  • Al equipo, el aviso con nombre, teléfono, dirección, tipo de servicio y notas: exactamente lo que el técnico necesita para ir a hacer la inspección del lugar y volver con una cotización real.
  • La cita se guarda en base de datos, la franja queda ocupada y aparece en el panel con estado pendiente, confirmada o cancelada.
  • La misma solicitud se copia a la bandeja de leads con su origen y dispara una notificación interna.
  • Horarios de atención, tipos de servicio y fechas bloqueadas se configuran desde el panel, sin tocar código.

El contenido hace el trabajo pesado

La tienda sola no traía consultas: las traen los artículos y las páginas de servicio y de ciudad, que responden lo que la gente busca antes de decidir a quién llamar.

  • 30 artículos largos sobre consultas reales: costos de instalación en Westchester y Greenwich, NVR frente a nube, Ring frente a Hikvision, cableado oculto en casas terminadas, permisos de alarma, Wi-Fi 7 y cámaras sin cuota mensual.
  • 35 páginas de ciudad, cada una con su FAQ, sus zonas y sus enlaces a las localidades vecinas.
  • Páginas de servicio por intención, separadas del catálogo, para que la búsqueda de instalación no aterrice en una ficha de producto.
  • Las FAQ visibles y su JSON-LD salen del mismo arreglo de datos, así lo que se lee y lo que se marca nunca se contradicen.

GEO: que los buscadores con IA también puedan citarlo

Además del SEO clásico, el sitio está preparado para que los motores generativos lo lean, lo entiendan y lo citen con datos correctos.

  • llms.txt y llms-full.txt generados desde los mismos módulos de datos que renderizan el sitio, así nunca se desincronizan del contenido publicado.
  • robots.txt permite explícitamente a GPTBot, ChatGPT-User, PerplexityBot, ClaudeBot, anthropic-ai y Google-Extended, y bloquea CCBot, que solo recolecta para entrenamiento.
  • Datos estructurados en profundidad: LocalBusiness con sus zonas de servicio, Service, Product con su Offer, FAQPage, BreadcrumbList, Organization y Person en los artículos.
  • Un sitemap de 136 URLs sin parámetros, con fechas de actualización reales y no un simple retoque de timestamp.

El panel de administración

Cada módulo resuelve una parte de la operación diaria del negocio, sin salir del panel.

  • Resumen

    Ventas, pedidos pendientes, citas por confirmar y últimos leads en una sola pantalla de entrada.

  • Analítica

    Métricas propias, Search Console y GA4 en el mismo panel, con ventanas de 7 a 90 días y comparación contra el período anterior.

  • Visitantes

    Registro visita a visita con origen, país y páginas recorridas, y un interruptor para excluir bots del conteo.

  • Productos

    Alta, edición y baja con importación y exportación en Excel, imágenes, precios y estado de publicación.

  • Inventario

    Existencias gestionadas aparte del catálogo, con eliminación reversible y restauración.

  • Pedidos

    Gestión y cambio de estado de cada pedido, con contador de pendientes visible en la navegación.

  • Clientes

    Listado de compradores con su historial, direcciones y pedidos asociados.

  • Categorías y marcas

    Taxonomía del catálogo, que alimenta los filtros de la tienda y el enlazado interno.

  • Cupones

    Descuentos con sus reglas de uso, aplicables en el checkout.

  • Leads

    Bandeja unificada de oportunidades: cada una llega etiquetada con su origen - cita, contacto o campaña.

  • Citas

    Solicitudes con estado pendiente, confirmada o cancelada, más la configuración de horarios, tipos de servicio y fechas bloqueadas.

  • Contactos

    Mensajes del formulario público, con su respuesta y seguimiento.

  • Envíos y pagos

    Zonas de envío y métodos de pago habilitados, incluidos efectivo y transferencia bancaria.

  • CMS

    Navegación del encabezado, imágenes de cada sección y páginas de contenido, editables sin desplegar código.

  • Reseñas

    Moderación de reseñas reales de producto, las únicas que se muestran y se marcan como datos estructurados.

  • Ajustes

    Nombre, logo, colores y metadatos SEO del sitio, gestionados desde el panel.

  • Usuarios y roles

    Acceso por rol al panel, con las rutas protegidas desde el middleware.

  • Notificaciones

    Avisos internos cuando entra una cita o un pedido, más el resumen semanal que sale por correo.

Decisiones técnicas

  • Dos recorridos separados en la misma plataforma: compra directa para producto, cotización o cita para instalación. Forzar todo a un carrito habría roto la venta de servicios.
  • Todos los leads - agendamiento, contacto y formularios de campaña - caen en una sola tabla con su fuente. Antes cada formulario terminaba en un correo distinto y nadie sabía cuántas oportunidades entraban al mes.
  • La cita se escribe en base de datos antes de responderle al visitante, para que la franja quede ocupada y dos personas no reserven la misma hora.
  • GA4 dispara generate_lead solo después de una confirmación real del servidor, nunca de forma optimista: un formulario que falla no puede contarse como lead.
  • Search Console y GA4 se consultan por API desde el propio panel, en ventanas de 7, 14, 30 y 90 días, para que el cliente vea consultas, impresiones, CTR y posición sin abrir otra herramienta.
  • Quité las valoraciones y reseñas sintéticas que el catálogo generaba a partir del id de cada producto y que se emitían como JSON-LD de tipo Review en todas las fichas. Era marcado de reseñas fabricado - incumple la política de Google - y las estrellas ahora solo aparecen cuando existe una reseña real.
  • Títulos y H1 reescritos con un presupuesto de ~60 caracteres a partir de los clusters que ya tenían impresiones, en lugar de escribir lo que sonaba bien: varias páginas locales llegaban a 78-84 caracteres y se cortaban en el resultado de búsqueda.
  • Next.js con renderizado en servidor, para que fichas de producto, artículos y páginas de servicio sean rastreables y citables sin depender de JavaScript.

Retos

  • Combinar venta de producto y venta de servicio sin que la web se sienta como dos sitios pegados.
  • Atender a la vez a un cliente doméstico y a uno corporativo, con expectativas y presupuestos distintos.
  • Cortar la canibalización entre las páginas de Greenwich, que competían entre sí por la misma consulta: hubo que asignar una URL dueña por intención y reenlazar el resto hacia ella.
  • Escribir 30 artículos y 35 páginas de ciudad sin caer en la plantilla repetida y sin inventar datos del negocio: donde el cliente no pudo verificar un dato - número de proyectos, certificaciones, tiempos de respuesta - la sección simplemente no se publicó.
  • Diferenciar fichas de producto muy plantilladas, que arrastraban un CTR de 0,10% en el resultado enriquecido, sin recurrir a datos que no existían.

Resultado

El sitio opera hoy como tienda, como blog y como red de páginas locales, con una sola bandeja de leads y un panel donde se ve qué consulta trae impresiones y qué página trae llamadas. El negocio reporta haber triplicado las solicitudes de servicio desde que el SEO se trabaja de forma continua, con contactos que entran por teléfono, formulario, agendamiento y WhatsApp. La auditoría inicial - 98 páginas, 217 clics y 54.845 impresiones en tres meses - quedó como línea base contra la que se compara cada iteración.

Ver el proyecto

¿Necesitas algo parecido?

Cuéntame qué estás construyendo y te respondo con alcance, stack y una fecha realista.