Structured Data Overview

Seluruh metadata yang kita tulis sejauh ini berbentuk pasangan datar: satu nama menunjuk satu nilai teks. Halaman yang lebih kaya — judul, penulis, tanggal, harga, peringkat ulasan — sulit digambarkan dengan pasangan tunggal semacam itu. Structured data menutup celahnya: data bermesin yang tertanam pada halaman dan mendeskripsikan isinya dengan kosakata baku. Pada Chapter ini kita memakai format yang paling disarankan, JSON-LD, untuk mendeskripsikan satu artikel lengkap.

Rich Results dan Data Bermesin #

Mesin pencari membaca structured data untuk memahami entitas pada halaman: sebuah artikel, sebuah produk, atau jejak navigasi. Pemahaman itu membuka akses ke rich results, tampilan hasil pencarian yang lebih kaya daripada tautan biru biasa: gambar, jejak breadcrumb, harga, hingga bintang ulasan. Google menyediakan Rich Results Test untuk menguji rich results apa yang dapat dihasilkan suatu halaman, dan Schema Markup Validator untuk memeriksa markup schema.org secara umum. Perlu ditegaskan: structured data membantu mesin memahami halaman, tetapi tidak menjamin peringkat.

Format JSON-LD #

JSON-LD (JavaScript Object Notation for Linked Data) ditulis sebagai satu blok JSON di dalam elemen <script type="application/ld+json">. Blok ini tidak dieksekusi sebagai JavaScript dan tidak tampil di halaman; tugasnya murni membawa data bagi mesin. Format inilah yang kini paling disarankan, dan penempatannya bebas di head maupun body. Karena isinya JSON murni, satu koma yang salah membuat seluruh blok gagal terbaca; validator HTML tidak memeriksa sintaks JSON, sehingga pemeriksaan JSON terpisah tetap perlu dilakukan.

Kosakata schema.org #

Isi blok mengikuti kosakata schema.org, kamus jenis dan properti data yang disepakati lintas mesin pencari. Kunci @context menyatakan kosakatanya, sedangkan @type memilih jenis entitas seperti Article, Product, atau BreadcrumbList. Setiap jenis membawa properti khasnya: Article memiliki headline, author, datePublished, dan image. Properti boleh bertingkat, misalnya nilai author berupa objek Person lengkap dengan namanya.

Contoh JSON-LD Artikel #

File berikut menempelkan data artikel pada halaman tulisan Dapur Siti:

<!doctype html>
<html lang="id">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Tiga Kesalahan Umum Saat Meracik Sambal</title>
  <script type="application/ld+json">
  {
    "@context": "schema.org",
    "@type": "Article",
    "headline": "Tiga Kesalahan Umum Saat Meracik Sambal",
    "author": { "@type": "Person", "name": "Siti" },
    "publisher": { "@type": "Organization", "name": "Dapur Siti" },
    "datePublished": "2025-03-12",
    "image": "www.example.com/gambar/sambal.jpg"
  }
  </script>
</head>
<body>
  <article>
    <h1>Tiga Kesalahan Umum Saat Meracik Sambal</h1>
    <p>Artikel dengan data bermesin yang siap dibaca mesin pencari.</p>
  </article>
</body>
</html>

Output yang Dihasilkan:

Jendela browser menampilkan:
  - Artikel berjudul "Tiga Kesalahan Umum Saat Meracik Sambal"
  - Blok JSON-LD tidak tampil; strukturnya terbaca pada DOM di DevTools
  - Mesin pencari dapat membaca data artikel untuk penilaian rich results

Mari kita telaah peran setiap baris penting di atas:

1. Baris 7 (<script>): wadah JSON-LD; type application/ld+json membuat isinya tidak dieksekusi dan tidak tampil.
2. Baris 9 (@context): kosakata yang dipakai; pada contoh ditulis ringkas, dan saat dipakai sungguhan alamat kosakata ditulis lengkap.
3. Baris 10 (@type): jenis entitas; Article untuk halaman artikel.
4. Baris 12-13 (author, publisher): properti bertingkat berupa objek Person dan Organization.
5. Baris 14-15 (datePublished, image): tanggal terbit berformat ISO dan gambar perwakilan artikel.

Perbandingan meta dan Structured Data #

Structured data melengkapi deretan metadata pada section ini. Chapter penutup merangkum mana yang benar-benar berdampak dan mana yang sebaiknya kita tinggalkan di head final.

Referensi resmi untuk pendalaman:

• schema.org
• Google Search Central — Structured data
• MDN Web Docs — Elemen script

<!doctype html>
<html lang="id">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Tiga Kesalahan Umum Saat Meracik Sambal</title>
  <script type="application/ld+json">
  {
    "@context": "schema.org",
    "@type": "Article",
    "headline": "Tiga Kesalahan Umum Saat Meracik Sambal",
    "author": { "@type": "Person", "name": "Siti" },
    "publisher": { "@type": "Organization", "name": "Dapur Siti" },
    "datePublished": "2025-03-12",
    "image": "www.example.com/gambar/sambal.jpg"
  }
  </script>
</head>
<body>
  <article>
    <h1>Tiga Kesalahan Umum Saat Meracik Sambal</h1>
    <p>Artikel dengan data bermesin yang siap dibaca mesin pencari.</p>
  </article>
</body>
</html>