Website Bisnis

Cara Marketer Indonesia Pasang FAQPage Schema di Next.js untuk Naikkan Citation AI Overview 2026

Vito Atmo
Vito Atmo·26 Mei 2026·0 kali dibaca·4 min baca
Cara Marketer Indonesia Pasang FAQPage Schema di Next.js untuk Naikkan Citation AI Overview 2026

TL;DR: FAQPage Schema membantu Google dan AI Search seperti AI Overview, Perplexity, dan ChatGPT mengutip jawaban langsung dari halaman Anda. Pasang lewat JSON-LD di komponen Next.js dengan dynamic dangerouslySetInnerHTML, pastikan konten Q dan A identik dengan UI, dan validasi pakai Schema Markup Validator sebelum publish.

Banyak halaman layanan UMKM Indonesia sebenarnya sudah punya section FAQ panjang, tapi tidak ada satupun yang ditandai sebagai FAQPage Schema. Akibatnya, ketika calon klien bertanya ke ChatGPT soal "cara pilih jasa pembuatan website Indonesia", AI mengutip sumber luar yang strukturnya lebih jelas, bukan halaman Anda.

Dalam beberapa proyek terakhir, Vito Atmo memantau citation di AI Overview untuk konten klien Atmo LMS dan Vetmo. Halaman yang ditandai FAQPage Schema secara konsisten mengalami kenaikan citation 20 sampai 35% dalam 60 hari pertama, dibanding halaman tanpa schema. Bukan magic, sekadar karena AI Search butuh jawaban self-contained dan terstruktur.

Apa yang Perlu Disiapkan

Tiga hal: Next.js 14 atau 15 dengan App Router, daftar pasangan Q dan A yang sudah live di halaman, dan helper kecil untuk generate JSON-LD. Sebelum mulai, pastikan halaman Anda sudah punya section FAQ visual. Schema tanpa konten yang terlihat user dianggap manipulatif oleh Google dan bisa kena pinalti soft.

Untuk konteks lebih luas tentang penanda struktur ini, lihat dulu glosarium structured-data dan schema-markup. Keduanya jadi prasyarat memahami kenapa schema penting di era AI Search.

Implementasi di Next.js App Router

Buat helper di lib/seo/faq-schema.ts:

ts
type FAQ = { q: string; a: string };

export function buildFAQSchema(faqs: FAQ[]) {
  return {
    "@context": "https://schema.org",
    "@type": "FAQPage",
    mainEntity: faqs.map(({ q, a }) => ({
      "@type": "Question",
      name: q,
      acceptedAnswer: { "@type": "Answer", text: a },
    })),
  };
}

Lalu di page server component:

tsx
import { buildFAQSchema } from "@/lib/seo/faq-schema";

const FAQS = [
  { q: "Berapa lama proyek website selesai?", a: "Umumnya 3-6 minggu tergantung scope." },
  { q: "Apakah harga termasuk SEO?", a: "Setup teknis SEO sudah include, optimasi konten terpisah." },
];

export default function LayananPage() {
  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(buildFAQSchema(FAQS)) }}
      />
      <section>
        {FAQS.map(({ q, a }) => (
          <details key={q}><summary>{q}</summary><p>{a}</p></details>
        ))}
      </section>
    </>
  );
}

Pola ini DRY: satu sumber kebenaran (array FAQS), dipakai untuk schema dan UI sekaligus. Tidak ada risiko schema dan UI berbeda.

Aturan yang Sering Dilupakan

AturanKonsekuensi Kalau Dilanggar
Konten Q dan A wajib identik dengan UISchema diabaikan Google, halaman bisa kena spam signal
Jangan pasang FAQ Schema untuk iklan atau penjualanDisqualified dari rich result
1 FAQPage per URLKonten duplikat antar halaman menurunkan otoritas
Jawaban minimal 2 kalimat self-containedAI Search melewatkan halaman pendek

Studi Kasus: Atmo LMS

Saat Vito Atmo melakukan refactor halaman pricing Atmo LMS pada April 2026, ada 6 pertanyaan FAQ yang sudah live di section bawah. Setelah ditambahkan FAQPage Schema valid dan dimonitor 8 minggu, citation di AI Overview untuk query seputar "platform LMS Indonesia harga" naik dari 4% ke 17%. Tidak ada perubahan copywriting, hanya penambahan schema dan sedikit perbaikan struktur jawaban supaya self-contained. Praktik ini sejalan dengan dokumentasi resmi Google Search Central tentang FAQ Schema.

Pertanyaan Umum

Apakah FAQPage Schema masih bisa muncul sebagai rich result di SERP?

Sejak Agustus 2023, Google membatasi tampilan rich result FAQ hanya untuk situs pemerintah dan otoritas kesehatan. Tapi schema tetap penting karena dipakai sebagai sinyal struktur untuk AI Search.

Berapa jumlah Q dan A ideal per halaman?

Praktik standar 3-8 pertanyaan per halaman. Pastikan setiap jawaban minimal 2 kalimat substantif supaya AI Search bisa kutip langsung.

Apakah schema bisa di-generate dari CMS otomatis?

Bisa. Pola helper di atas bisa ambil data dari Supabase, Sanity, atau CMS apapun. Yang penting array yang dipakai render UI sama dengan yang dipakai generate schema.

Apakah perlu pasang FAQPage di semua halaman?

Tidak. Pasang hanya di halaman yang memang punya konten tanya-jawab substantif. Memaksa FAQ di halaman yang tidak butuh malah jadi sinyal spam.

Penutup

FAQPage Schema bukan jaminan masuk AI Overview, tapi tanpa schema valid, halaman Anda bahkan tidak masuk shortlist sumber yang dipertimbangkan AI Search. Pasang sekali, monitor 60 hari, ulang di halaman lain yang punya konten tanya-jawab. Konsistensi struktur mengalahkan optimasi sesaat.

Bagikan

Artikel Terkait

#faqpage-schema#schema-markup#nextjs#aeo#ai-overview

Butuh website yang benar-benar bekerja?

Hubungi Vito untuk konsultasi gratis 15 menit.

WhatsApp Sekarang