Parte 6 de 22

Datos estructurados: el JSON-LD que da rich results

Datos estructurados: el JSON-LD que da rich results

Los datos estructurados pueden facilitar a los sistemas de búsqueda la interpretación de las páginas elegibles y respaldar elementos como las estrellas de valoración, las migas de pan o las tarjetas de artículo. También dan a los sistemas de IA un contexto legible por máquinas, pero no garantizan la cita. En el App Router, renderice JSON-LD como una etiqueta script desde un componente de servidor (tipado con schema-dts):

import type { WithContext, BlogPosting } from "schema-dts";

export default async function PostPage({ params }) {
  const post = await getPost(params.slug);

  const jsonLd: WithContext<BlogPosting> = {
    "@context": "https://schema.org",
    "@type": "BlogPosting",
    headline: post.title,
    description: post.excerpt,
    datePublished: post.publishedAt,
    dateModified: post.updatedAt,
    author: {
      "@type": "Person",
      name: "Vlad Sedenko",
      url: "https://example.com/about",
    },
    image: post.ogImage,
  };

  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
      />
      <article>{/* ... */}</article>
    </>
  );
}

Tipos habituales a considerar, según la página:

  1. Organization / Person: para todo el sitio, en el layout principal. Alimenta el panel de conocimiento.
  2. BlogPosting / Article: cada entrada.
  3. BreadcrumbList: sustituye la URL en los resultados por una ruta legible.
  4. FAQPage: para páginas con preguntas y respuestas reales.
  5. Product + Offer + AggregateRating: comercio electrónico; de aquí salen las estrellas.
  6. Service + LocalBusiness: agencias y negocios locales.

Valide con el Rich Results Test de Google: el validador de schema.org comprueba la sintaxis, pero solo la herramienta de Google le dirá si es elegible para rich results.

Checklist:

  • JSON-LD renderizado en el servidor (nunca inyectado en el cliente tras la carga)
  • Article/BlogPosting en todas las entradas con fechas reales
  • BreadcrumbList en todo el sitio
  • Los datos del marcado coinciden con la página visible (las discrepancias arriesgan una sanción manual)

¿Prefiere que se lo haga otra persona?

Audito y corrijo el SEO técnico de webs en Next.js: indexación, velocidad, hreflang y visibilidad en IA.

Servicio de SEO técnico