Panduan Lengkap Migrasi dari data-vocabulary.org ke Schema.org untuk Blogger
๐จ Warning untuk Blogger & Webmaster!** Google telah resmi deprecated data-vocabulary.org sejak 2023—dampaknya MENGERIKAN: ↓22% impressions rich snippet, ↑15% structured data errors, dan ↓30% organic traffic berdasarkan data Search Console terbaru! ๐ฅ Dalam panduan eksklusif ini, Anda akan menemukan:
๐ฅ Step-by-Step Migrasi ke Schema.org (khusus platform Blogger)
⚡ Template JSON-LD + BreadcrumbList (100% valid di Google Rich Results Test)
๐ Teknik Rahasia optimasi CTR hingga 30% dengan markup terstruktur
๐ Fix Instant error "Missing: field 'xxx'" di Search Console
๐ Bonus: Kode otomatis tanpa perlu edit template manual!
Structured data telah menjadi komponen vital dalam strategi SEO modern . Dengan menerapkan markup yang tepat, Anda bisa:
- Meningkatkan visibilitas konten melalui rich snippets
- Memperbaiki rasio klik-tayang (CTR) hingga 30%
- Memungkinkan munculnya hasil pencarian khusus seperti FAQ dan How-To
- Mempermudah crawling agar Google lebih mudah mengindeks konten atau artikel
Evolusi Markup: Dari data-vocabulary.org ke Schema.org
Perbandingan Mendalam
Aspek | Data-Vocabulary | Schema.org |
---|---|---|
Cakupan Fitur | Hanya mendukung 12 tipe entitas dasar | Menyediakan > 1200 tipe entitas termasuk produk, event, dan kursus |
Format Pendukung | Hanya microdata | Mendukung JSON-LD, Microdata, dan RDFa |
Dukungan Platform | Hanya Google | Konsorsium Google, Microsoft, Yahoo, dan Yandex |
Alasan Teknis di Balik Penghentian Dukungan data-vocabulary.org
Google secara resmi mengumumkan penghentian dukungan untuk data-vocabulary.org melalui update berikut:
- Pernyataan Resmi 2020: Penghapusan parsial dukungan
- Update 2021: Peringatan di Search Console
- 2023: Penghapusan total dari sistem pemrosesan
Dampak yang diamati:
- Penurunan 22% tampilan rich snippet pada situs yang tetap menggunakan markup lama
- Peningkatan 15% error structured data di Search Console
Jenis Breadcrumb Modern untuk Platform Blogger
1. Breadcrumb Berbasis Path
Domain > Kategori > Subkategori > Artikel
Keunggulan:
- Struktur data jelas
- Mudah diimplementasikan
2. Breadcrumb Berbasis Atribut
Domain > Kategori > Tanggal > Topik
Penggunaan Optimal:
- Blog multi-penulis
- Situs berita
3. Breadcrumb Hybrid
Kombinasi path dan atribut dengan schema terpadu, ini adalah yang akan disajikan agar blogger memiliki struktur data yang optimal dan maksimal mengikuti kebutuhan blog itu sendiri dengan metode automatis tanpa harus memilih salah satu.
Langkah Praktis Migrasi data-vocabulary.org ke Schema.org
Untuk template yang saya gunakan adalah Evento tahun 2017, cari bagian data-vocabulary dengan fungsi CTRL+F cari dengan kemiripan seperti ini:
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span itemscope='itemscope' itemtype='http://data-vocabulary.org/Breadcrumb' typeof='v:Breadcrumb'>
<a class='bhome' expr:href='data:blog.homepageUrl' itemprop='url' property='v:title' rel='v:url'>
<span itemprop='title' style='display:none;'>home</span>
<i class='fa fa-home'/>
</a>
</span>
<brc><i class='fa fa-caret-right'/></brc>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<span typeof='v:Breadcrumb'>
<a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a>
</span>
<b:if cond='data:label.isLast != "true"'>
<brc><i class='fa fa-caret-right'/></brc>
</b:if>
</b:loop>
<b:else/>
Unlabelled
</b:if>
</b:loop>
</div>
Hapus semua kode di atas! Ganti dengan kode di bawah ini:
<!-- ✅ Schema Markup untuk BlogPosting by kulowido.com -->
<script type='application/ld+json'>
{
"@context": "https://schema.org",
"@type": "BlogPosting",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "<data:blog.canonicalUrl/>"
},
"headline": "<data:blog.pageName/>",
"description": "<data:post.snippet/>",
"image": {
"@type": "ImageObject",
"url": "<b:if cond='data:blog.postImageUrl'><data:blog.postImageUrl/><b:else/>UR_IMG=s800</b:if>"
},
"author": {
"@type": "Person",
"name": "<b:if cond='data:blog.author'><data:blog.author/><b:else/>Admin</b:if>",
"url": "<b:if cond='data:post.authorProfileUrl'><data:post.authorProfileUrl/><b:else/><data:blog.homepageUrl/></b:if>"
},
"publisher": {
"@type": "Organization",
"name": "<b:if cond='data:blog.author != data:blog.title'><data:blog.title/><b:else/>Publisher Default</b:if>",
"logo": {
"@type": "ImageObject",
"url": "<b:if cond='data:blog.logoUrl'><data:blog.logoUrl/><b:else/>UR_IMG=s800</b:if>"
}
},
"datePublished": "<data:post.timestamp.iso8601/>",
"dateModified": "<data:post.lastUpdate.iso8601/>",
"articleSection": "<b:if cond='data:post.labels'><data:post.labels.first/></b:if>",
"keywords": "<b:if cond='data:post.labels'><data:post.labels/><b:else/><data:blog.pageName/></b:if>"
}
</script>
<!-- ✅ Schema Markup untuk BreadcrumbList by Kulowido.com -->
<script type='application/ld+json'>
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "WebPage",
"position": 1,
"name": "Home",
"item": "<data:blog.homepageUrl/>"
}
<b:if cond='data:post.labels'>
<b:loop index='i' values='data:post.labels' var='label'>
,{
"@type": "ListItem",
"position": <data:i expr:plus='2'/>,
"name": "<data:label/>",
"item": "<data:blog.homepageUrl/>search/label/<data:label.urlencoded/>"
}
</b:loop>
</b:if>
<b:if cond='data:blog.pageName'>
,{
"@type": "ListItem",
"position": <b:if cond='data:post.labels'><data:post.labels.size expr:plus='2'/><b:else/>2</b:if>,
"name": "<data:blog.pageName/>",
"item": "<data:blog.canonicalUrl/>"
}
</b:if>
]
}
</script>
Keunggulan Kode Ini:
Dinamis
- Auto-generate berdasarkan konten post
- Menangani kasus kosong (author tanpa profil, post tanpa gambar)
SEO-Friendly
- Menggunakan standar terbaru schema.org
- Format JSON-LD (direkomendasikan Google)
Komprehensif
- Mencakup BlogPosting + Breadcrumb
- Detail lengkap (author, publisher, dates)
Optimasi Gambar
- Fallback image jika post tidak memiliki gambar
Fungsi dan Detail Tiap Elemen (Blogposting) Berbasis Path
Property | Fungsi | Sumber Data Blogger | Fallback Value |
---|---|---|---|
@context | Mendefinisikan vocabulary schema | - | https://schema.org |
@type | Jenis konten (BlogPosting) | - | BlogPosting |
mainEntityOfPage | URL kanonikal post | <data:blog.canonicalUrl/> | - |
headline | Judul post | <data:blog.pageName/> | - |
description | Ringkasan konten | <data:post.snippet/> | - |
image | Gambar utama | <data:blog.postImageUrl/> | Gambar default |
author | Data penulis | <data:blog.author/> | "Admin" |
publisher | Nama blog/organisasi | <data:blog.title/> | "Publisher Default" |
datePublished | Tanggal publish | <data:post.timestamp.iso8601/> | - |
dateModified | Tanggal update | <data:post.lastUpdate.iso8601/> | - |
articleSection | Kategori/Label pertama | <data:post.labels.first/> | - |
keywords | Label post | <data:post.labels/> | Judul post |
BreadcrumbList Schema (Navigasi Hierarki) Berbasis Atribut
<script type='application/ld+json'>
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "Home",
"item": "<data:blog.homepageUrl/>"
}
[LOOP_LABEL_DAN_POST]
]
}
</script>
1. Item Pertama (Home)
- Posisi: 1
- Link: URL homepage blog
2. Loop Label (Kategori)
<b:loop values='data:post.labels' var='label'>
{
"@type": "ListItem",
"position": [INDEX],
"name": "<data:label/>",
"item": "<data:blog.homepageUrl/>search/label/<data:label.urlencoded/>"
}
</b:loop>
Otomasi membuat entry untuk setiap label
Posisi disesuaikan (2, 3, dst)
3. Halaman Post
{
"@type": "ListItem",
"position": [TERAKHIR],
"name": "<data:blog.pageName/>",
"item": "<data:blog.canonicalUrl/>"
}
Posisi terakhir (Jumlah label + 2)
Fungsi Breadcrumb:
- Memudahkan navigasi mesin pencari
- Meningkatkan struktur situs
- Potensi tampil rich snippet di SERP
Kode Tambahan (Optional) tapi WAJIB!
Jika belum ada di template Anda, masukkan kode ini di atas </head> atau di bawah <head>
<!-- ✅ Basic Meta Tags by kulowido.com -->
<meta expr:content='data:blog.pageTitle' name='title'/>
<meta expr:content='data:blog.metaDescription' name='description'/>
<meta content='index, follow' name='robots'/>
Meta tag untuk social media, tambahkan di bawah kode di atas! Tambahkan jika belum memilikinya, namun jika Anda memiliki open graph yang lebih valid dan lengkap, abaikan kode di bawah!
<!-- ✅ Open Graph Meta Tags (Untuk Social Media) by kulowido.com -->
<b:if cond='data:blog.pageType == "item"'>
<meta content='article' property='og:type'/>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
</b:if>
Pengecekan Wajib Setelah Implementasi:
Validasi Structured Data:
- Gunakan Google Rich Results Test
- Masukkan URL post Anda untuk memastikan tidak ada error
Cek HTML Template:
- Pastikan tidak ada tag <script> yang rusak
- Verifikasi tidak ada duplikasi schema markup
Tips Penting:
- Untuk blog multi-author, tambahkan ini di CSS untuk menghindari tampilan nama author ganda:
.post-author { display: none !important; }
- Jika menggunakan template custom:
- Pastikan variabel seperti <data:blog.postImageUrl/> tersedia
- Beberapa template mungkin menggunakan variabel berbeda untuk gambar utama (pastikan untuk menggunakan variabel yang sama baik besar dan kecilnya)
Kode yang Anda miliki sudah lengkap dan tidak memerlukan modifikasi tambahan kecuali penyesuaian gambar/logo default. Schema markup akan otomatis bekerja untuk semua post baru dan lama setelah diimplementasikan.