in

Schema Markup Dan Struktur Data

TokoDaring.Com – Tentang Schema Markup Dan Struktur Data. Artikel tentang schema markup dan struktur data. Apa itu schema markup ? Bagaimana menyematkannya ? dan bagaimana hasil implementasinya ?

Apa itu schema markup (structured data)

Schema markup adalah berupa kosakata atau kode semantik yang di tempatkan di situs website untuk membantu mesin pencari menampilkan hasil pencarian yang informatif bagi pengguna.

Skema markup, juga biasa di kenal sebagai structured data (struktur data). Pada akhirnya, itu akan membantu memberikan informasi yang lebih baik dan akurat kepada orang-orang yang menggunakan mesin pencari untuk mendapatkan hasil informasi pencarian.

Schema structured data untuk hasil pencarian yang lebih ‘kaya’

Website desainer atau kita sudah sangat akrab dengan tag-tag HTML yang di gunakan untuk mendesain halaman website. Dengan tag HTML, browser akan menampilkan informasi yang disertakan dalam tag tersebut.

Misalnya, tag h1 yang di gunakan sebagai judul pada sebuah halaman, <h1>Resep Madu Murni</h1>. Secara desain konten, kata Resep Madu Murni akan di terjemahkan oleh browser sebagai judul dan biasanya di tampilkan dengan huruf berukuran lebih besar (heading1) di awal konten.

Namun secara arti, judul resep madu murni dalam bahasa indonesia mungkin akan memberikan dua arti yang berbeda, resep obat kesehatan yang terbuat dari madu atau resep makanan dan minuman berbahan madu.

Ini karena TAG HTML tidak memberikan informasi apapun tentang arti dari <h1>Resep Madu Murni</h1> tersebut. Kesehatan dan makanan tentu saja dua hal yang sangat berbeda.

Tanpa schema markup tentang Resep Madu Murni, informasi yang di sajikan oleh mesin pencari bisa saja menjadi salah dan tidak relevan.

Namun dengan schema markup yang di sematkan pada website, mesin pencari akan lebih faham dalam menampilkan hasil pencarian dengan snippet-snippet yang relevan.

Ilustrasi penerapan schema structured data pada konten memasak (Recipe)

Kami ilustrasikan seperti potongan kode berikut. Ini adalah sebuah konten memasak dengan judul ‘Resep Madu Murni’. Di dalamnya di tambahkan properti schema dari Recipe, Di antaranya :

  • Prep Time –> prepTime.
  • Cook time –> cookTime.
  • Yield –> recipeYield.
  • Tags –> suitableForDiet –> https://schema.org/HalalDiet.
  • nutrition –> https://schema.org/NutritionInformation.

Dengan demikian, mesin pencari akan memahami tentang konten tersebut secara keseluruhan. Dan akan menampilkan snippet yang esensial untuk di lihat oleh pengguna, seperti lama waktu memasak, kandungan nutrisi dan lainnya.

Schema property lengkap dari Recipe, bisa di cek di https://schema.org/Recipe.

<div itemscope itemtype="https://schema.org/Recipe">

<h1 itemprop="name">Resep Madu Murni</h1>
By <span itemprop="author">Chef Daring</span>, <meta itemprop="datePublished" content="2021-07-12">July 12, 2021

<img itemprop="image" src="kue-berbahan-madu.jpg" alt="Resep Kue Berbahan Madu" />

<span itemprop="description">Resep membuat kue berbahan madu murni yang sudah turun temurun di keluarga saya.</span>

Prep Time: <meta itemprop="prepTime" content="PT15M">15 menit
Cook time: <meta itemprop="cookTime" content="PT1H">1 jam
Yield: <span itemprop="recipeYield">1 loaf</span>
Tags: <link itemprop="suitableForDiet" href="https://schema.org/HalalDiet" />Makanan Halal

<div itemprop="nutrition" itemscope itemtype="https://schema.org/NutritionInformation">
Nutrition facts:
<span itemprop="calories">240 calories</span>,
<span itemprop="fatContent">12 gram lemak</span>
</div>

Sekilas tentang Schema.org

Membicarakan tentang schema struktur data, pasti sangat berkaitan dengan organisasi Schema.org. Schema.org adalah komunitas kolaborasi yang memiliki tujuan untuk membuat, memelihara, dan mempromosikan skema untuk data terstruktur di Internet.

Terdiri dari orang-orang perwakilan dari perusahaan-perusahaan pendirinya (Google, Microsoft, Yahoo dan Yandex), dan partisipasi dari komunitas website.

Schema.org menyediakan kumpulan kosakata bersama yang dapat digunakan webmaster untuk menandai halaman mereka dengan cara yang dapat dipahami oleh mesin pencari utama: Google, Microsoft, Yandex, dan Yahoo!

Kenapa anda harus menerapkan skema markup ?

Menerapkan schema structured data ke dalam halaman website bisa menjadi hal yang sangat detil dan sulit. Tapi anda harus melakukannya, apapun jenis website yang anda buat.

Terlebih ketika anda ada pada sebuah project membuat toko online untuk menjual produk-produk secara daring.

Masalahnya adalah ketika kompetitor menerapkan struktur data di dalam websitenya dan anda tidak. Padahal anda berada pada bidang usaha yang sama.

Pengguna akan lebih mendapatkan banyak informasi yang essential dari website yang menerapkan schema struktur data secara benar.

Informasi tersebut dapat membantu posisi pemeringkatan situs website menjadi lebih baik. Dan tentu saja akan mendekatkan kepada tujuan anda agar orang mau berkunjung dan pada akhirnya, mendapatkan lebih banyak klik.

Tipe skema struktur data dan propertinya ?

Mungkin ada lebih dari ratusan tipe schema data dan property. Tepatnya, saat ini terdiri dari 792 Types, 1447 Properties 15 Datatypes, 83 Enumerations dan 445 Enumeration member.

Schema.org menjelaskan berbagai jenis tipe lainnya secara detil. Yang masing-masing tipe memiliki beberapa propertinya sendiri dan dapat digunakan untuk mendeskripsikan tipe tersebut.

Tipe item yang paling luas adalah Thing, yang memiliki empat properti: description, image, name dan url. Tipe yang lebih spesifik memiliki properti yang sama dengan tipe yang lebih luas.

Misalnya, Place adalah tipe yang lebih spesifik dari Thing, dan LocalBusiness adalah tipe lebih spesifik dari Place. Dan item yang lebih spesifik mewarisi properti induknya.

Misalnya, LocalBusiness adalah tipe spesifik dari Place dan juga Organization, jadi LocalBusiness mewarisi properti dari kedua jenis induk tersebut (Place dan juga Organization).

Thing > Organization > LocalBusiness
Thing > Place > LocalBusiness

Bagaimana cara menerapkan schema structured data ?

Secara tradisional, berikut kira-kira (ilustrasi) perbandingan sebuah halaman produk yang tidak dan di sematkan schema structured data markup dengan format Microdata.

Halaman produk tanpa schema markup yang ditambahkan.

<h1>TokoDaring Apron Barista With Extra Pocket</h1>

<img src="tdr-extra-pocket-apron.jpg" alt='TokoDaring Apron Barista' />

<span>Rated 4/5 berdasarkan review dari 12 customer</span>

<span>Rp.155,000</span>
<span>In stock</span>

<h3>Product description:</h3>
<p>Tersedia dalam ukuran M, L dan XL. Terbuat dari bahan kulit berkualitas dengan 3 kantong di depan.</p>

Halaman produk dengan schema markup (Microdata).

<div itemscope itemtype="https://schema.org/Product">

<h1 itemprop="name">TokoDaring Apron Barista With Extra Pocket</h1>
  
<img itemprop="image" src="tdr-extra-pocket-apron.jpg" alt='TokoDaring Apron Barista' />

<div itemprop="aggregateRating"
 itemscope itemtype="https://schema.org/AggregateRating">

Rated <span itemprop="ratingValue">4</span>/5
 berdasarkan review dari <span itemprop="reviewCount">12</span> customer </div>

<div itemprop="offers" itemscope itemtype="https://schema.org/Offer">

<span itemprop="priceCurrency" content="IDR">Rp</span><span
 itemprop="price" content="155000.00">155,000.00</span>

<link itemprop="availability" href="https://schema.org/InStock" />In stock </div>

<h3>Product description:
</h3>
<p itemprop="description">
Tersedia dalam ukuran M, L dan XL. Terbuat dari bahan kulit berkualitas dengan 3 kantong di depan.</p>

Jika di lihat pada contoh snippet di atas ada perbedaan antara sebelah kiri dan kanan.

Atribut global itemtype menentukan URL schema yang akan digunakan untuk mendefinisikan (properti item) itemprop dalam struktur data, dalah hal ini adalah Product ( https://schema.org/Product).

itemscope digunakan untuk mengatur ruang lingkup di mana dalam struktur data schema yang di atur oleh itemtype akan aktif

Cara menerapkan schema structured data pada website eCommerce WordPress

Untuk website eCommerce atau toko online yang di buat menggunakan WordPress dan WooCommerce, kami menyarankan anda untuk menggunakan atau menginstall plugin.

Plugin seperti : Schema atau plugin SEO seperti Rankmath, akan menambahkan schema data yang lengkap untuk website eCommerce anda secara keseluruhan dalam format JSON-LD. Mulai dari Organization, Article, FAQ, HowTo, Product dan semua schema property yang perlu untuk di sematkan.

Selain Microdata dan JSON-LD, juga terdapat format RDFa (Resource Description Framework in Attributes).

{"@context":"https://schema.org","@graph":[{"@type":"Place","@id":"https://tokodaring.com/#place","geo":{"@type":"GeoCoordinates","latitude":"-6.281351117068154","longitude":"106.76257722614938"},"hasMap":"https://www.google.com/maps/search/?api=1&amp;query=-6.281351117068154,106.76257722614938","address":{"@type":"PostalAddress","streetAddress":"Jalan H. Djabir No. 34, Bintaro","addressLocality":"Pesanggrahan","addressRegion":"DKI Jakarta","postalCode":"12330","addressCountry":"Indonesia"}},{"@type":"Organization","@id":"https://tokodaring.com/#organization","name":"TokoDaring.Com","url":"https://tokodaring.com","email":"hello@tokodaring.com","address":{"@type":"PostalAddress","streetAddress":"Jalan H. Djabir No. 34, Bintaro","addressLocality":"Pesanggrahan","addressRegion":"DKI Jakarta","postalCode":"12330","addressCountry":"Indonesia"},"logo":{"@type":"ImageObject","@id":"https://tokodaring.com/#logo","url":"https://tokodaring.com/wp-content/uploads/2021/07/TokoDaring-Google-Logo.jpg","caption":"TokoDaring.Com","inLanguage":"en-US","width":"1920","height":"1080"},"contactPoint":[{"@type":"ContactPoint","telephone":"+628161664189","contactType":"technical support"},{"@type":"ContactPoint","telephone":"+6281289519668","contactType":"customer support"}],"location":{"@id":"https://tokodaring.com/#place"}},{"@type":"WebSite","@id":"https://tokodaring.com/#website","url":"https://tokodaring.com","name":"TokoDaring.Com","publisher":{"@id":"https://tokodaring.com/#organization"},"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https://tokodaring.com/wp-content/uploads/2021/09/Masker-Medis.jpg","url":"https://tokodaring.com/wp-content/uploads/2021/09/Masker-Medis.jpg","width":"600","height":"600","caption":"Masker Medis","inLanguage":"en-US"},{"@type":"Person","@id":"https://tokodaring.com/admin/tokodaring/","name":"TokoDaring","url":"https://tokodaring.com/admin/tokodaring/","image":{"@type":"ImageObject","@id":"https://tokodaring.com/wp-content/litespeed/avatar/cc137dbcb525a12eaf924bef0a0477fa.jpg","url":"https://tokodaring.com/wp-content/litespeed/avatar/cc137dbcb525a12eaf924bef0a0477fa.jpg","caption":"TokoDaring","inLanguage":"en-US"},"sameAs":["https://tokodaring.com","https://web.facebook.com/warungproduktifjakarta","https://twitter.com/https://twitter.com/plus62_network"],"worksFor":{"@id":"https://tokodaring.com/#organization"}},{"@type":"ItemPage","@id":"https://tokodaring.com/beli/aksesoris/masker-medis/#webpage","url":"https://tokodaring.com/beli/aksesoris/masker-medis/","name":"Masker Medis | TokoDaring.Com 2021","datePublished":"2021-09-04T14:22:14+07:00","dateModified":"2021-12-04T21:59:02+07:00","author":{"@id":"https://tokodaring.com/admin/tokodaring/"},"isPartOf":{"@id":"https://tokodaring.com/#website"},"primaryImageOfPage":{"@id":"https://tokodaring.com/wp-content/uploads/2021/09/Masker-Medis.jpg"},"inLanguage":"en-US"},{"@type":"Product","brand":{"@type":"Brand","name":"Non Food"},"name":"Masker Medis","description":"Item : Masker Medis 50's. Kondisi : Bagus. Harga : Harga yang tertera adalah per pack / box isi 50 pcs. Minimum Order : Order dalam satuan qty pcs. Minimum Order 1 pack / box. Penagihan : Total harga di hitung berdasarkan qty pengiriman.","sku":"8994100200041","category":"Aksesoris","mainEntityOfPage":{"@id":"https://tokodaring.com/beli/aksesoris/masker-medis/#webpage"},"offers":{"@type":"Offer","price":"23650","priceCurrency":"IDR","priceValidUntil":"2022-12-31","availability":"https://schema.org/InStock","itemCondition":"NewCondition","url":"https://tokodaring.com/beli/aksesoris/masker-medis/","seller":{"@type":"Organization","@id":"https://tokodaring.com/","name":"TokoDaring.Com","url":"https://tokodaring.com","logo":"https://tokodaring.com/wp-content/uploads/2021/07/TokoDaring-Google-Logo.jpg"},"priceSpecification":{"price":"23650","priceCurrency":"IDR","valueAddedTaxIncluded":"false"}},"gtin13":"8994100200041","@id":"https://tokodaring.com/beli/aksesoris/masker-medis/#richSnippet","image":{"@id":"https://tokodaring.com/wp-content/uploads/2021/09/Masker-Medis.jpg"}}]}

Apakah schema struktur data bisa membantu meningkatkan visibilitas website eCommerce anda

Dengan contoh kode di atas, maka tanpa ragu kami menjawabnya ” ‘Ya…’ Schema struktur data markup akan membantu visibilitas website anda di mesin pencari “.

Karena faktanya mesin pencari memang bergantung pada setiap kode dan property yang di sematkan.

Meskipun menerapkan schema struktur data bukan satu-satunya cara dan instan untuk meningkatkan hal tersebut. Penerapan schema struktur data markup harus di padukan pada optimisasi SEO di website anda.

Cek penerapan schema struktur data di website eCommercce anda

Anda mungkin menjual hingga ratusan produk via website toko online anda sendiri. Juga dukungan dari sekitar ribuan artikel blog yang anda terbitkan, plus halaman landing page yang cantik.

Namun anda berfikir bahwa klik (trafik) ke website anda hanya sedikit dan tidak sebanding dengan usaha yang anda keluarkan.

Coba cek, jika penerapan schema markup di website anda mungkin salah, atau bahkan tidak ada sama sekali.

Alat (tools) google ini bisa di gunakan untuk melakukan test penerapan structured data di website eCommerce anda, google rich results test.

Artikel lainnya untuk optimisasi eCommerce

Lihat artikel kategori dan sub-kategori eCommerce kami. Kami banyak menulis tentang bagaimana membuat website eCommerce sendiri menggunakan WordPress dan WooCommerce. Untuk membantu anda menjalankan bisnis eCommerce tanpa harus menguasai bahasa pemrograman.

Written by TokoDaring

TokoDaring.Com - 'Majalah' online (online publishing),  sumber dan referensi teknis untuk membangun dan memaksimalkan performa bisnis toko online. Optimizing your store!

8999909028234

Beli Rokok Online Gratis Ongkir [21+]

cara menambahkan kode html di wordpress

Cara Menambahkan Kode HTML di Website eCommerce WordPress