Next.js SEO
Cómo crear páginas de SEO programático con Next.js: calidad, escala y control del rastreo
Diseña y despliega páginas de SEO programático con rutas dinámicas de Next.js, contenido único, parámetros estáticos, caché, mapas del sitio e invalidación segura.
El SEO programático funciona cuando un modelo de datos repetible produce una respuesta útil para cada URL. Falla cuando una plantilla solo sustituye una ciudad, categoría o nombre de producto en la misma página con poco contenido.
Demuestra que cada URL merece existir
Empieza por una tabla de preguntas de los usuarios y los datos necesarios para responderlas. Una página de integración útil puede incluir operaciones compatibles, pasos de configuración, limitaciones, detalles de autenticación y un ejemplo desarrollado. Una página que solo cambia el nombre de la integración no tiene una razón propia para existir.
Define una regla de integridad mínima antes de publicar. Si un registro carece de los campos necesarios para ofrecer una respuesta útil, mantenlo como borrador en lugar de generar una página vacía indexable. La escala del contenido debe seguir a la calidad de los datos, no precederla.
- —Una clara intención y respuesta.
- —Datos o análisis únicos basados en la entidad.
- —Una URL canónica duradera.
- —Páginas relacionadas que ayudan al lector a continuar.
Modela el contenido por separado de la presentación
Guarda la entidad, las afirmaciones, las pruebas, la fecha de actualización y el estado de publicación en un modelo de contenido tipado. La ruta debe transformar ese registro en una página, sin deducir hechos importantes del slug. Así se hace visible la falta de pruebas y los editores pueden mejorar los datos sin cambiar la lógica del componente.
Utiliza identificadores estables detrás de slugs legibles. Los slugs pueden cambiar para ganar claridad, mientras el ID estable conserva las relaciones y el historial de redirecciones. Limita el texto generado a los hechos del registro. Una plantilla no debe inventar disponibilidad, compatibilidad ni afirmaciones sobre rendimiento.
Crea la ruta dinámica
Un segmento [slug] gestiona la URL pública. Espera params, busca el registro publicado y llama a notFound si no existe. Renderiza el contenido principal en un Server Component para que la primera respuesta contenga la información buscada. Añade Client Components solo para filtros, calculadoras u otras interacciones necesarias.
Utiliza generateStaticParams para el conjunto que merezca preparar durante la compilación. Para un catálogo muy grande, genera previamente las páginas más valiosas y permite que el resto se renderice bajo demanda. El reparto adecuado depende del tiempo de compilación, la frecuencia de cambios, el volumen de solicitudes y el comportamiento de la caché de la plataforma.
export async function generateStaticParams() {
const pages = await getPriorityPages();
return pages.map(({ slug }) => ({ slug }));
}
export default async function Page({ params }) {
const { slug } = await params;
const entry = await getPublishedEntry(slug);
if (!entry) notFound();
return <LandingPage entry={entry} />;
}Mantén los metadatos tan únicos como la página
Genera el título y la descripción a partir de la propuesta de valor real de la entidad, en lugar de sustituir una palabra en la misma frase. Construye la URL canónica a partir del registro resuelto, no de la entrada sin procesar. Añade datos estructurados solo si la página representa un tipo compatible y contiene visiblemente los valores marcados.
Las solicitudes duplicadas de un mismo registro pueden unificarse con cache de React durante el renderizado. Si los registros se guardan en caché entre solicitudes, etiquétalos con un ID estable para que los flujos de publicación y corrección puedan invalidar la página afectada sin vaciar todo el catálogo.
Control de descubrimiento y volumen de rastreo
Genera entradas en los mapas del sitio solo para páginas publicadas y canónicas que cumplan la regla de integridad. Divide los mapas grandes por familias de contenido o particiones y utiliza fechas de modificación significativas. Los enlaces internos deben mostrar las secciones centrales importantes y las entidades relacionadas para que las páginas puedan descubrirse por otras vías además del mapa del sitio.
No expongas combinaciones ilimitadas de consultas como páginas rastreables. Normaliza, redirige, aplica noindex o bloquea los patrones que no representen recursos duraderos. Supervisa los registros del servidor y las herramientas de búsqueda para detectar rastreos inútiles, parámetros inesperados, soft 404 y un conjunto creciente de páginas descubiertas pero sin indexar.
const indexable = entries.filter(
(entry) => entry.published && entry.completeness === "ready",
);
return indexable.map((entry) => ({
url: SITE_URL + "/integrations/" + entry.slug,
lastModified: entry.updatedAt,
}));Diseña juntos la publicación y la invalidación
Una edición de contenido no termina hasta que el resultado anterior en caché deja de servirse según el plazo previsto. Con Cache Components de Next.js 16 habilitado, etiqueta los datos en caché por entidad y utiliza updateTag cuando el editor deba leer inmediatamente el valor nuevo después de publicar. Utiliza revalidateTag con un perfil adecuado cuando se admita el comportamiento stale-while-revalidate.
Mantén la vista previa del borrador separada de la clave de caché pública y protégela con autorización. Prueba una actualización, una eliminación, un cambio de slug y una reversión. Una importación masiva debe informar de los registros rechazados, en lugar de publicar páginas incompletas para que un contador de importación parezca indicar éxito.
Mide la calidad, no el número de URL
Supervisa la cobertura por familia de contenido: páginas indexadas correctamente, impresiones, visitas relevantes, conversiones y registros obsoletos o incompletos. El número de URL por sí solo premia lo más fácil de producir, en lugar de las páginas útiles. Revisa muestras de las páginas menos frecuentes porque los defectos de plantilla suelen ocultarse fuera de los ejemplos más visitados.
Añade comprobaciones automáticas de títulos únicos, coherencia canónica, campos de contenido obligatorios, códigos de estado correctos y presencia en el mapa del sitio. Combínalas con una revisión editorial de la precisión y utilidad. Una página con una estructura válida puede seguir sin aportar información valiosa.
Despliega un catálogo sin ocultar su entorno de ejecución
Los sitios programáticos ponen a prueba las compilaciones, el acceso a datos, la invalidación de caché y las rutas para registros inexistentes. Adios ejecuta el servidor Next.js como un proceso persistente y mantiene juntos el resultado de la compilación, los registros de ejecución, la ruta de estado, los secretos y la versión promovida. Esto aporta pruebas al equipo cuando un registro rompe la generación o una fuente de datos ralentiza el renderizado.
Despliega una vista previa, toma muestras de páginas con volumen alto, medio y bajo, solicita un slug desconocido y comprueba el mapa del sitio. Promueve la versión cuando la comprobación de estado pase. Si un cambio masivo de contenido revela un defecto, la versión operativa anterior sigue siendo el destino claro para revertir mientras el código fuente y los registros permanecen disponibles para el diagnóstico.
name: integration-catalog
build_cmd: npm ci && npm run build
start_cmd: npm start
runtime:
name: node@24
port: 3000
health_path: /api/health
env:
DATABASE_URL: secret://DATABASE_URL