Guides / json-ld structured data

Comment ajouter des données structurées JSON-LD

Les données structurées JSON-LD aident les agents IA à comprendre votre produit, vos tarifs et votre organisation. Voici comment les ajouter.

What is JSON-LD?

JSON-LD (JavaScript Object Notation for Linked Data) is structured data embedded in your HTML that tells machines what your page is about. AI agents use it to understand your product type, pricing, organization details, and API availability.

Search engines have used JSON-LD for years (it powers rich results in Google). Now AI agents use the same data to evaluate and compare tools.

Product/WebApplication schema

Add this to your homepage <head> to describe your product:

html

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "WebApplication",
  "name": "Your Product",
  "description": "What your product does.",
  "url": "https://your-domain.com",
  "applicationCategory": "DeveloperApplication",
  "operatingSystem": "Web",
  "offers": {
    "@type": "Offer",
    "price": "0",
    "priceCurrency": "USD",
    "description": "Free tier with 1,000 API calls/month"
  },
  "provider": {
    "@type": "Organization",
    "name": "Your Company",
    "url": "https://your-domain.com"
  }
}
</script>

Pricing schema (on your pricing page)

Add Offer schemas to your pricing page so agents can evaluate cost:

html

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "WebApplication",
  "name": "Your Product",
  "offers": [
    {
      "@type": "Offer",
      "name": "Free",
      "price": "0",
      "priceCurrency": "USD",
      "description": "1,000 API calls/month"
    },
    {
      "@type": "Offer",
      "name": "Pro",
      "price": "49",
      "priceCurrency": "USD",
      "billingIncrement": "Monthly",
      "description": "50,000 API calls/month"
    }
  ]
}
</script>

Implementation

In Next.js, add JSON-LD to your page metadata:

`tsx
export default function Page() {
return (
<>
<script
type="application/ld+json"
dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
/>
{/* page content */}
</>
)
}
`

In other frameworks, add the <script type="application/ld+json"> tag to the <head> or <body> of your page.

Validate

Use Google's Rich Results Test (search.google.com/test/rich-results) to validate your markup
Check that the JSON parses correctly — no trailing commas, proper escaping
Compare the markup with the visible page. Only describe real entities and offers; structured data does not guarantee search features or ad placement.

Prêt à préparer votre campagne ChatGPT ?

Commencez par votre site. Serge vous aide à vérifier votre profil d’entreprise, votre plan et votre création avant de décider du budget publicitaire.

Découvrir Serge