Panduan Menulis Script JSON-LD Untuk Structured Data Schema.org
·
2 min read
·
Label
BlogSite
Schema.org adalah aktivitas komunitas kolaboratif dengan misi untuk membuat, memelihara, dan mempromosikan skema untuk data terstruktur di Internet, di halaman web, dalam pesan email, dan seterusnya. Sedangkan JSON-LD adalah format data tertaut berbasis JSON yang mudah digunakan yang mendefinisikan konsep konteks untuk menentukan kosakata untuk tipe dan properti.
Data terstruktur dalam konteks SEO adalah cara standar dalam memberikan informasi tentang konten halaman web. Katakanlah Anda adalah pengecer online yang menjual kartu ulang tahun. Anda dapat menggunakan data terstruktur untuk memberikan informasi tentang nama produk, harga, ukuran, penilaian pelanggan, gambar, dan lainnya.
JSON-LD adalah format yang direkomendasikan Google untuk data terstruktur. JSON-LD diimplementasikan melalui tag <script> di kepala halaman atau badan halaman web HTML dan ada secara terpisah dari tag HTML lainnya. Panduan ini akan fokus pada sintaks JSON-LD.
1. Beberapa Istilah JSON LD untuk Blog Site
Sebelum kita mempelajari sintaksis JSON-LD dan menulis data terstruktur dengan schema.org, ada beberapa istilah penting yang perlu Anda ketahui. Istilah-istilah yang sering Anda dengar setiap kali data terstruktur menjadi topik pembicaraan, jadi ada baiknya Anda memahaminya sebelum memplejari cara menulis script JSON LD.
Untuk tujuan panduan ini, kita akan melihat contoh data terstruktur BlogPosting sederhana dan menguraikan elemen-elemen yang berbeda.
a. Key dan Value
Data di JSON-LD diwakili oleh pasangan nama-nilai atau nilai kunci. Sintaks data ini berisi dua grup terkait yang dihubungkan bersama dengan mendefinisikan “kunci” dan mendeklarasikan “nilai”.
b. Properties
Properti adalah nama yang diberikan kepada pasangan nilai kunci. Contoh di bawah menunjukkan properti “nama”, yang terdiri dari pasangan nilai kunci yang sama seperti di atas. Properti diberi nama berdasarkan kuncinya.
Dalam data terstruktur, properti tertentu mungkin diperlukan atau direkomendasikan bergantung pada jenis skema yang anda tulis. Properti yang diperlukan harus digunakan. Properti yang direkomendasikan bersifat opsional, namun sangat disarankan sesuai dengan data terstruktur yang anda buat.
2. Cara Membaca Sintaks JSON-LD
Untuk menggunakan JSON-LD, Anda sebenarnya tidak perlu memahami inti cara kerjanya. Yang perlu Anda ketahui hanyalah cara membacanya agar Anda dapat melakukan penyesuaian pada template yang ada agar sesuai dengan halaman Anda sendiri. Markup dasar JSON-LD terlihat seperti ini:
Keterangan Gambar:
- The Script Type: Format yang digunakan data terstruktur schema.org yaitu JSON-LD.
- The Context: Dari mana bahasa yang Anda gunakan berasal (schema.org).
- The Type: Jenis data yang dapat dilihat oleh mesin pencari, dalam hal ini mesin pencari melihat sebuah gambar.
- The Property: Kualitas seperti apa yang akan anda jelaskan mengenai jenis ini (dokumen lisensi).
- The Value: URL atau alamat website dari property. URL ini akan menjelaskan, apa yang sebenarnya Anda sampaikan kepada mesin pencari tentang properti ini (URL tempat lisensi dapat ditemukan).
a. Kurung kurawal { }
Hal pertama yang akan Anda perhatikan setelah tag <script> pembuka adalah tanda kurung kurawal terbuka. Dan, tepat sebelum tag </script> penutup, ada tanda kurung kurawal tertutup. Lebih jelasnya Kurung kurawal digunakan untuk memulai dan mengakhiri penulisan script JSON.
gambar
b. Tanda kutip "
Hal berikutnya yang perlu anda perhatikan adalah tanda kutip. Setiap kali kita memanggil tipe Skema, atau properti, atau mengisi kolom, kita akan menggabungkan informasi dalam tanda kutip.
c. Koma dan Titik Dua
Dalam bahasa JSON, Koma dan titik dua bertindak sebagai pemisah dalam script. Koma digunakan untuk mengakhiri satu baris sscript. Bila anda menggunakan dua object, koma digunakan untuk mengakhiri satu buah object.
Sedangkan titik dua digunaakn untuk memisahkan nilai "key" dan "value".
d. Tanda kurung siku [ ]
Tanda kurung siku digunakan di JSON-LD ketika ada beberapa nilai untuk properti yang sama atau digunakan untuk menulis nilai yang memiliki "array".
e. @context
Properti ini menjelaskan bahwa struktur data di tulis dengan kosa kata yang berasal dari https://schema.org.
f. @type
Menjelaskan tipe struktur data atau skema yang digunakan. Ada banyak sekali skema yang dapat anda gunakan, biasanya pada Blogspot yang umum digunakan adalah skema Blogposting, WebSite, Article, FAQPage, Breadcrumb dan lainnya.
g. Bersarang (Nesting)
Dalam data terstruktur JSON-LD banyak sekali objek yang ditulis bersarang “bersarang” di dalam objek lain. Pada dasarnya, ini berarti Anda dapat menambahkan lapisan tambahan ke data Anda untuk memberikan informasi yang lebih detail.
3. Cara Menulis Struktur Data Schema.org dengan JSON-LD
Kami anggap, anda sudah memiliki pemahaman yang baik tentang komponen inti data terstruktur JSON-LD, termasuk elemen yang diperlukan dan aturan sintaksis yang digunakan. Artinya, anda sudah dapat menafsirkan dan membaca tiap script dari data terstruktur JSON-LD. di bawah ini kami berikan satu buah contoh data terstruktur Organisasi yang biasa digunakan pada tempalte Blogger.
<b:includable id='postMetadataJSONOrganization'><script type='application/ld+json'>{"@context": "http://schema.org","@type": "Organization","@id": "<data:view.url.canonical.jsonEscaped/>#organization","url": "<data:post.url.jsonEscaped/>","name": "Inchimediatama Nusantara","foundingDate": "2009","legalName" : "Inchimediatama Nusantara","logo": "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz6JYLaq1_DkQMs0yJBpGZZve00P5m-7HPxrRIYhDdVng6kHfmZc4x9EW_vI0DyspmFsWtcMenBJzfaummNCefFmTdZr5c8M1IL9l2sufVKbaSVEQs-0feAUpmCkDu4Eo-1rCR60XZ66Ym5BFLYe2dnPHWRHqRp4-OpmJE56J9Z-zhvg/s1600/logo%20unixwinbsd.png","sameAs": ["https://www.youtube.com/@unixbsdshell","https://www.facebook.com/unixlesson","https://x.com/iwanset96143401","httpss://www.github.com/unixbsdshell"],"contactPoint": {"@type": "ContactPoint","telephone": "+62 812 8906 5249","email": "datainchi@gmail.com","contactType": "Administrator"},"founders": [{"@type": "Person","name": "<data:post.author.jsonEscaped/>"},{"@type": "Person","name": "Siti Umaroh"}
],"address": {"@type": "PostalAddress","addressLocality": "Bekasi","addressRegion": "Jawa Barat - Indonesia","postalCode": "17841","telephone": "+62 812 8906 5249","email": "datainchi.com","streetAddress": "Kp. Warung Bongkok Desa Telagamurni Kecamatan Cikarang Barat, Kabupaten Bekasi, Jawa Barat. HP: 0812-8906-5249, Indonesia"}}</script></b:includable>
Pada contoh struktur data Organisasi di atas sengaja kami berikan warna, agar anda dapat mudah membacanya. Yang perlu anda perhatikan adalah.
a. Tanda kurung kurawal { } warna biru. Tanda kurung berwarna biru tersebut menjelaskan awal dan akhir dari object Organisasi.
b. Tanda koma
Tiap akhir satu baris script harus diberi tanda koma. Dan juga pada tiap satu property harus di tutup dengan tanda kurung dan diberikan tanda koma. Perhatikan tanda tutup kurung kurung warna bitu yang terkahir, jagnan gunakan koma. Artinya, akhir dari struktur data Organisasi.
c. Pada contoh di atas kami memberikan dua contoh nilai yang memiliki array (warna merah), seperti object founders (pendiri). Artinya organisasi "Inchimediatama Nusantara" didirikan oleh dua orang, yaitu
- <data:post.author.jsonEscaped/> dan
- Siti Umaroh
Script di atas bila kita terjemahkan kurang lebih dibaca sebagai berikut;
DATA Organisasi Inchimediatama Nusantara:
Nama Organisasi : Inchimediatama Nusantara
ID Organisasi : https://www.inchimediatama.org/#organization
Tanggal pendirian : 2009
Alamat website : https://www.inchimediatama.org/
Nama resmi organisasi : Inchimediatama Nusantara
Logo organisasi :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz6JYLaq1_DkQMs0yJBpGZZve00P5m-7HPxrRIYhDdVng6kHfmZc4x9EW_vI0DyspmFsWtcMenBJzfaummNCefFmTdZr5c8M1IL9l2sufVKbaSVEQs-0feAUpmCkDu4Eo-1rCR60XZ66Ym5BFLYe2dnPHWRHqRp4-OpmJE56J9Z-zhvg/s1600/logo%20unixwinbsd.png
Media Sosial atau situs yang dimiliki organisasi :
https://www.youtube.com/@unixbsdshell
https://www.facebook.com/unixlesson
https://x.com/iwanset96143401
httpss://www.github.com/unixbsdshell
Nomor kontak yang dapat dihubungi :
Telepon: 0812 8906 5249
Email: datainchi.com
Pendiri :
1. Iwan Setiawan
2. Siti Umaroh
Alamat :
Kabupaten: Bekasi
Provinsi: Jawa Barat - Indonesia
Kode Post: 17841
Telephone: +62 812 8906 5249
email: datainchi.com
Alamat lengkap: Kp. Warung Bongkok Desa Telagamurni Kecamatan Cikarang Barat, Kabupaten Bekasi, Jawa Barat. HP: 0812-8906-5249, Indonesia.
Sekarang bagaimana?, apakah anda sudah jelas dan dapat membaca script JSON LD. Baiklah kami akan contohkan lagi cara penulisan JSON LD secara bersarang. Perhatikan contoh di bawah ini.
<script type='application/ld+json'>
{
"@context":"https://schema.org",
"@type":"BlogPosting",
"mainEntityOfPage":
{
"@type":"WebPage",
"@id":"<data:post.url.canonical.jsonEscaped/>"
},
"headline":"<data:post.title.jsonEscaped/>",
"description":"<data:view.description.jsonEscaped/>",
"publisher":
{
"@context": "http://schema.org",
"@type": "Organization",
"@id": "<data:view.url.canonical.jsonEscaped/>#organization",
"url": "<data:post.url.jsonEscaped/>",
"name": "Inchimediatama Nusantara",
"foundingDate": "2009"
},
"author":
{
"@type": "Person",
"name": "<data:post.author.name.jsonEscaped/>",
"url": "
<b:if cond='data:post.author.profileUrl'><data:post.author.profileUrl.jsonEscaped/>
<b:else/><data:view.isHomepage.jsonEscaped/></b:if>",
<b:if cond='data:post.author.authorPhoto'>
"image": "<data:post.author.authorPhoto.image.jsonEscaped/>",</b:if>
"address": {
"@type": "PostalAddress",
"addressLocality": "Jawa Barat, Indonesia",
"postalCode": "17841",
"streetAddress": "Jl. Imam Bonjol No. 86"
}
}
}
</script>Contoh script JSON LD di atas adalah struktur data dari BlogPosting, pada object BlogPosting terdapat beberapa object lainnya, seperti "author", "publisher" dan "WebPage".
Script di atas sengaja saya kasih warna, agar anda dapat mudah membacanya.
Yang perlu anda perhatikan secara seksama dari contoh script di atas adalah
a. Penulisan tanda koma
b. Penulisan tanda kurung kurawal
c. Tiap object yang ada di struktur data BlogPosting.
Salah satu tujuan utama mempelajari cara menambahkan skema ke halaman Anda adalah memanfaatkan cuplikan kaya di SERP Google. Cuplikan kaya ini juga merupakan tempat yang bagus untuk mempelajari cara menggunakan skema karena cuplikan tersebut memiliki tujuan yang jelas terkait dengan satu halaman, sehingga memudahkan orang untuk memahami aspek SEO teknis ini.
Silahkan Berkomentar, Kakak...! Bunda...!
Posting Komentar