Penjelasan Schema Markup Venesyt Media

Penjelasan dan Cara Membuat Schema Markup

Untuk hari ini, kita akan belajar tentang schema. Saya ingin membahas tentang schema ini karena menurut saya schema penting untuk dipelajari dan berguna untuk website anda performa SEO yang lebih baik untuk kedepannya. 

Mungkin anda pernah mendengar Schema atau mungkin anda sama sekali tidak pernah mendengarnya. Schema adalah salah satu bagian dalam optimisasi website yang berguna untuk meningkatnya rasio klik ke website anda karena hasil pencarian yang menuju website tersebut terlihat lebih menarik dari yang lain.

Bagaimana bisa lebih menarik? Semua itu akan dibahas lebih lanjut di artikel ini beserta cara pembuatan Schema Markup. Hal ini tidak akan menyita banyak waktu anda dan bisa dibuat sekarang juga.

Tujuan dari pembuatan artikel ini adalah agar para pemilik bisnis lokal mengerti tentang fungsi schema di website mereka yang dapat meningkatkan performa SEO website mereka. Saya juga sudah membuat artikel tentang apa itu seo untuk yang belum mengerti tentang arti seo secara garis besar.

Penjelasan Schema Markup

Schema (Schema.org) Markup adalah sebuah sebuah tipe microdata (data mikro) yang digunakan untuk berkomunikasi dengan mesin pencari yang bertujuan untuk membantu mesin pencari mengerti akan informasi di sebuah halaman.

Dan inilah penjelasan yang dimiliki oleh Schema.org:

"Most webmasters are familiar with HTML tags on their pages. Usually, HTML tags tell the browser how to display the information included in the tag. For example, <h1>Avatar</h1> tells the browser to display the text string "Avatar" in a heading 1 format. However, the HTML tag doesn't give any information about what that text string means—"Avatar" could refer to the hugely successful 3D movie, or it could refer to a type of profile picture—and this can make it more difficult for search engines to intelligently display relevant content to a user.


Schema.org provides a collection of shared vocabularies webmasters can use to mark up their pages in ways that can be understood by the major search engines: Google, Microsoft, Yandex and Yahoo!"

Artinya seperti ini:

'Kebanyakan webmasters (admin/pemilik website) tidak asing dengan penggunaan tag HTML di halaman website mereka. Biasanya, tag HTML memberitahu browser cara untuk menampilkan informasi yang terdapat di dalam tag. Seperti contoh: <h1>Avatar</h1> memberitahu ke browser untuk menampilkan tulisan "Avatar" dalam format heading 1. Namun, tag HTML tidak memberi informasi tentang apa arti dari tulisan itu—"Avatar" bisa jadi merujuk ke film 3D yang sangat populer, atau mungkin bisa berarti sebuah gambar profile—dan ini membuat mesin pencari lebih sulit untuk menampilkan konten yang relevan ke pengguna.

Schema.org menyediakan sebuah kumpulan yang berisi bahasa yang bisa digunakan untuk webmaster untuk mark up halaman mereka dengan cara-cara yang dapat dimengerti oleh mesin pencari yang besar yaitu Google, Microsoft, Yandex, dan Yahoo!"

Penjelasannya mungkin cukup sulit dimengerti, tetapi jangan khawatir, setelah membaca artikel ini semua orang juga akan mengerti. Karena akan lebih mudah jika melihatnya secara langsung.

Apa itu Microdata?

Microdata digunakan untuk memberitahu mesin pencari tentang sebuah elemen di halaman. Dengan kata lain, microdata memberikan label atas sebagian konten. Penggunaan Microdata diibaratkan seperti anda berkata kepada Google, “Hei, Google, tulisan ini adalah nama bisnis ini” atau “Kalimat berikut ini adalah alamat bisnis ini”.

Mesin pencari yang besar seperti Google memang bisa melakukannya sendiri. Tetapi dikarenakan oleh banyaknya variasi desain halaman dan cara penulisan yang berbeda di internet, mesin pencari tidak bisa menentukannya sendiri dan penggunaan microdata akan sangat membantu.

Sejarah dari schema ini dimulai dari tahun 2011 terdiri dari kumpulan perusahaan-perusahaan Search Engine yang terkenal yaitu: Google, Bing, Yahoo, dan yang ikutan setelah beberapa bulan, Yandex. Mereka bekerja sama untuk menentukan suatu cara agar informasi di sebuah halaman dapat lebih mudah diproses oleh mesin pencari. Dan caranya adalah dengan memberikan tanda/tag/label kepada data di halaman-halaman internet tersebut.

Bagaimana cara menandainya? Pertanyaan bagus, semua akan dibahas di bawah, untuk sekarang diikuti saja tahapannya. 

Yang tidak pernah mengerti tentang schema sekarang mungkin bertanya-tanya, bagaimana sih bentuk hasil dari schema tersebut? Para pencari kalau mencari sesuatu di Google biasanya sering menemukan hal-hal berikut:

1. Resep

Contoh resep rich snippet

2. Event

3. Artikel

4. Review suatu produk

Dan lain-lain. Seperti yang bisa dilihat di contoh gambar diatas. Dibanding hasil pencarian biasa, hasil pencarian diatas mempunyai elemen-elemen tambahan seperti tanggal, jumlah rating, nilai rating, harga, dll. Dan contoh diatas hanya meliputi sebagian saja.

Dan hasil seperti contoh diatas ini dinamakan rich snippet. Kalau hasil pencarian normal dinamakan snippet. Pencarian yang mempunyai tambahan-tambahan selain yang normal dinamakan rich snippet. Dan rich snippet ini hanya dapat ditampilkan jika website tersebut telah menambahkan schema kedalam halaman mereka.

Kenapa Harus Menambahkan Schema?

Karena dengan menggunakan schema akan menghasilkan hal-hal berikut:

  • Menampilkan hasil pencarian dalam bentuk yang lebih menarik
  • Meningkatkan potensi untuk di klik oleh pencari sebesar 10-25%
  • Mesin pencari dan bisnis lainnya menggunakan informasi dari schema ini untuk membuat program baru, seperti Google Recipe Search.
  • Ketika anda menambahkan schema markup kedalam halaman-halaman website, anda memberikan mesin pencari informasi yang lebih jelas mengenai konten website perusahaan anda. Dengan begitu mesin pencari akan lebih yakin untuk menempatkan website tersebut di keyword-keyword relevan.

Apa iya schema akan meningkatkan ranking situs saya di keyword ABC?

Jawabannya singkatnya adalah ya. Google selalu mementingkan user experience dalam menjalankan pencarian melalui mesin pencarinya. Schema markup membantu google untuk memberikan kualitas hasil pencarian yang lebih baik berupa penambahan gambar dan info-info yang relevan seperti rating, review, dan lain-lain.

Mungkin untuk sekarang tidak akan terlalu berefek secara langsung terhadap ranking anda, tapi di untuk kedepannya kemungkinannya adalah Google akan membuat schema menjadi salah satu ranking factor. Tahukah anda bahwa cara riset keyword yang benar dan tepat adalah hal yang cukup penting dalam meningkatkan jumlah pengunjung?

Tipe Tipe Kode Schema Markup

Terdapat 3 format kode yang dapat dimengerti oleh mesin pencari dan digunakan untuk mengaplikasikan schema, yaitu:

  • 1
    Microdata
  • 2
    RDFa
  • 3
    JSON-LD (Rekomendasi Google)
Tipe Kode Schema Google Venesyt Media

Apa perbedaan dari ketiga format itu? 

Sebenarnya tidak banyak yang berubah. Hanya saja dahulu sebelum JSON-LD banyak yang support, para pemilik website menggunakan microdata yang lebih bisa diproses oleh banyak perusahaan. Pada saat itu banyak yang lebih mensupport microdata. Yang akan dibahas disini adalah JSON-LD karena direkomendasikan oleh Google. 

Dan menurut saya juga JSON-LD adalah yang paling mudah karena tidak dibutuhkannya pengeditan tulisan yang ada di halaman tetapi hanya tinggal menambahkan beberapa line saja. 

Fakta tentang Microdata dan JSON-LD

Dibawah ini adalah fakta-fakta seputar microdata dan JSON-LD.

Microdata:

  • Microdata ditulis didalam kode html itu sendiri. Jadi, jika terdapat perubahan dalam layout halaman, terdapat kemungkinan kode microdata akan terhapus
  • Lebih susah untuk dilakukan karena harus mencari dan mengedit bagian-bagian yang perlu di markup secara manual
  • Google berangsur-angsur akan menggunakan JSON-LD dibanding Microdata di masa depan. Dan Bing dan Yahoo pada saat ini masih menggunakan Microdata, tetapi tidak ada yang tahu sampai kapan mereka akan terus menggunakan Microdata.

Dan JSON-LD:

  • JSON-LD ditulis di satu bagian halaman website (di header yang berada di paling atas) sehingga lebih mudah dilihat data apa saja yang di markup
  • Lebih cepat dan lebih jelas untuk mengimplementasikan Schema.
  • Direkomendasikan oleh Google untuk hasil pencarian dalam bentuk rich snippet.

Untuk contoh dari Google sendiri, lihat gambar di bawah ini:

Resep Schema Google

Terlihat menarik bukan? Hal itu disebabkan website tersebut telah menambahkan Schema Markup kedalam halaman. Dibawah inilah contoh schema yang akan dapat menghasilkan snippet seperti yang diatas:

  • JSON-lD
  • Microdata

<script type="application/ld+json">
{
     "@context": "https://schema.org/",
     "@type": "Recipe",
     "name": "Grandma's Holiday Apple Pie",
     "author": "Elaine Smith",
     "image": "http://images.edge-generalmills.com/56459281-6fe6-4d9d-984f-385c9488d824.jpg",
     "description": "A classic apple pie.",
     "aggregateRating": {
         "@type": "AggregateRating",
         "ratingValue": "4",
         "reviewCount": "276",
         "bestRating": "5",
         "worstRating": "1"

},
"prepTime": "PT30M",
"totalTime": "PT1H",
"recipeYield": "8",
"nutrition": {
    "@type": "NutritionInformation",
    "servingSize": "1 medium slice",
    "calories": "230 calories",
    "fatContent": "1 g",
    "carbohydrateContent": "43 g",
},
"recipeIngredient": [
    "1 box refrigerated pie crusts, softened as directed on box",
    "6 cups thinly sliced, peeled apples (6 medium)",
    "..."
],
"recipeInstructions": [
    "1...",
    "2..."
]
}
</script>

Bisa dilihat dari kedua contoh diatas antara JSON-LD dan Microdata untuk hasil yang sama. Microdata memerlukan kehadiran data (yang dapat anda lihat) di halaman anda, sedangkan JSON-LD tidak membutuhkan kehadiran data tersebut di halaman yang sama untuk dapat membuatnya.

Microdata juga hanya bisa dibuat mengikuti tulisan yang tertera di halaman website, sehingga cukup sulit untuk menemukan markup apa saja yang telah diimplementasikan di halaman website.

Kalo begitu kenapa google merekomendasikan JSON-LD sebagai pilihan mereka? Karena bisa dilihat contoh diatas, penggunaan JSON-LD mempunyai beberapa keuntungan seperti, menurut Google:

  • Schema Markup tidak terikat dengan teks yang dapat dilihat oleh para pengunjung, yang membuat lebih banyak data yang dapat ditambahkan, seperti Country(negara) dari PostalAddress (alamat) dari MusicVenue (lokasi konser) dari sebuah Event. Contohnya anda biasanya hanya menuliskan nama kota dan lokasi untuk suatu event, tetapi dengan Schema informasi yang lebih detail seperti negara dan provinsi juga bisa ditambahkan.
  • Google dapat membaca data JSON-LD yang dimasukkan secara dinamis kedalam halaman, seperti melalui Javascript atau melalui widget di dalam CMS(Content Management System) website tersebut.

Cara Membuat Schema Markup

Setelah ditunggu-tunggu, akhirnya sampai juga di bagian ini.

Sejauh ini, terdapat tiga cara untuk menambahkan schema:

1. Google Highlighter

Yang termudah adalah dengan menggunakan Google Highlighter. Highlighter (link) terletak di Google Search Console versi lama. Caranya cukup mudah, anda hanya perlu menentukan halaman yang ingin di markup dengan mengklik "start highlighting". Setelah itu masukkan URL halaman yang ingin di tag. Selanjutnya akan ditampilkan halaman website anda dan anda tinggal memblok tulisan di halaman tersebut dan tinggal memilih tag yang tepat untuk tulisan yang di blok tersebut.

Kelebihan: Mudah, Cepat, Tidak ribet
Kekurangan: Hasil markup hanya bisa dilihat oleh Google saja karena markup yang dibuat di highlighter tidak akan dibagikan ke mesin pencari yang lain, pilihan markup yang terbatas (tidak semua tersedia)

2. Google Tag Manager

Google tag manager awalnya dibuat untuk membantu Google Analytics dalam memberikan tag kepada aktivitas yang dilakukan pengunjung di website anda seperti melihat berapa banyak orang yang mengklik link di homepage dan sebagainya.

Karena itu pula schema juga dapat ditambahkan dengan Google Tag Manager, caranya adalah dengan memberikan tag setiap kali halaman tersebut dibuka yang berisi file html JSON-LD.

Kelebihan: Tidak ada
Kekurangan: Repot, Perlu belajar lagi.

Saya tidak akan menjelaskannya secara panjang karena fungsi dari Google Tag Manager itu sendiri bukanlah untuk Schema dan mempelajarinya untuk Schema akan menghabiskan waktu yang cukup lama. Selain itu Google juga tidak merekomendasikan markup dengan Google Tag Manager. Ini hanya untuk pengetahuan saja.

3. Secara Manual

Secara manual, penambahan Schema Markup dengan manual tidak mudah namun juga tidak terlalu sulit. Untuk secara manual melakukannya, anda perlu belajar sendiri sejumlah property yang ada dengan mengunjungi website Schema.org.

Untung saja sekarang sudah terdapat Schema generator (klik untuk pencarian google) yang dapat anda isi dan tinggal anda copy paste saja ke header halaman website anda.

Kelebihan: Bisa menentukan properti apa saja yang dimasukkan.
Kekurangan: Perlu pengetahuan dasar tentang Schema dan website.

Properti Schema Markup Apa Saja Yang Sebaiknya Didahulukan

Ok, saya sudah mengerti kurang lebih tentang Schema, tapi harus dimulai darimana? Jawabannya tentu saja adalah homepage anda. Untuk bisnis lokal (bisnis yang menyediakan produk atau jasa di suatu kota), terdapat beberapa poin yang paling tidak harus ada. 

Poin-poin tersebut adalah: Name; description; url; logo; sameAs; openingHours; Address: streetAddress, postalCode, addressCountry; contactPoint: contactType, telephone, email, areaServed, availableLanguage.

Misalkan saya mempunyai bisnis bernama ABC Business yang menjual berbagai macam barang. Lokasi websitenya adalah ABC.com. Usaha tersebut juga mempunya akun twitter dan facebook. Usaha kami buka dari hari senin sampai jumat pukul 08:00 sampai 17:00 dan pada hari sabtu dan minggu pukul 10:00 sampai 15:00. Kurang lebih hasilnya akan seperti ini:

<script type=”application/ld+json”>
    “@context”: “http://schema.org”,
    “@type”: “Organization
”, ​
    “name”: “ABC Best Business”,
    “url”: “http://abc.com”,
    “description”: “ABC Business adalah bisnis terhebat yang menyediakan semua barang yang diinginkan oleh pembeli. Anda ingin, kami punya”,
    “logo”: “https://abc.com/logo.png”,
    “SameAs”: “https://facebook.com/abc-business”,
    “SameAs”: “https://twitter.com/abcbusiness”,
    “OpeningHours”: “Mo-Fr 08:00-17:00”, “Sa-Su 10:00-15:00”,
    “Address”: 
{
        “@type”: “PostalAddress”,
        “addressCountry”: “Indonesia”,
        “postalCode”: “123456”,
        “streetAddress”: “Jalan Jendral Sudirman nomor 100”,
}
    “contactPoint”: 
[
        “@type”: “ContactPoint”.
        “telephone”: “+62823190123”,
        “contactType”: “customer service”,
        “contactOption”: “TollFree”,
        “email”: “hello@abc.com
        “areaServed”: “ID”,
        “availableLanguage”: “Indonesia,English”
]

</script>

Saya juga memastikan semua keterangan di Schema Markup ini dapat terlihat juga di dalam halaman website entah di footer ataupun di body.

Keterangan dari data-data berikut:

Property

Penjelasan

 @context dan script type

Akan selalu sama, kode ini hanya untuk menandakan penulisan schema markup

@type

properti dari bagian ini, bisa organization, bisa LocalBusiness, ataupun yang lebih spesifik seperti restoran. Untuk lebih detail kunjungi https://schema.org/Organization

description

deskripsi singkat tentang properti yang anda masukkan

logo

link menuju logo website

sameAs

link menuju url akun anda di medsos atau wikipedia atau sejenisnya. Anda bisa menambahkan beberapa sameAs sekaligus

address

alamat (link)

addressCountry

negara

postalCode

kode pos

Streetaddress

alamat lokasi

ContactPoint

kontak poin untuk sebuah organisasi atau orang (link

ContactType

tipe dari kontak poin ini, seperti informasi kontak untuk support, penjualan, customer service, dan lain-lain.

ContactOption

 opsi yang tersedia dari kontak poin ini,.

areaServed

wilayah cakupan bisnis anda.

Sisanya bisa dilogikakan sendiri berdasarkan contoh yang saya berikan. Perlu diingat bahwa data yang anda isi harus dapat ditemui di halaman website yang akan diberi markup, dalam hal ini homepage. Maka dari itu untuk dapat mengisi data Schema diatas, pemilik website biasanya akan menyisipkan data-data yang dibutuhkan di satu bagian halaman website.

Cara Menambahkan Schema Untuk WordPress

Khusus wordpress, dikarenakan repotnya menggunakan microdata untuk markup, anda dapat menggunakan JSON-LD melalui plugin yang telah tersedia. Terdapat berbagai macam plugin schema, dan yang saya gunakan saat ini adalah plugin Markup (JSON-LD).

Anda hanya perlu masuk ke dalam settingannya dan pilih property markup yang ingin dipakai, dan diisi sesuai dengan kolomnya.

FAQ Tentang Schema (Buatan sendiri)

1. Bagaimana cara memastikan kalau schema telah terbentuk dengan benar?

Anda dapat menggunakan tools oleh Google yaitu Structured Data Testing Tool.  Disana akan diberi tahu jika Schema yang anda buat salah atau benar dan anda bisa memperbaikinya dengan mudah jika salah

2. Properti apa yang harus dipakai untuk website saya?

Tergantung website anda sendiri. Jika anda mempunyai bisnis lokal, maka gunakan LocalBusiness. LocalBusiness ini mempunyai kategori yang lebih spesifik lagi di dalamnya. Dan LocalBusiness adalah sebuah kategori cabang dari Organization. Untuk lebih jelasnya kunjungi Schema.org

3. Apa saya perlu menambahkan schema untuk setiap halaman yang ada?

Sebaiknya Schema Markup dibuat per halaman yang penting saja, seperti Organization atau LocalBusiness untuk homepage. Anda tidak perlu menambahkan Organization atau LocalBusiness di semua page yang ada karena hal itu malah dapat Pengecualian jika website anda memuat banyak konten yang mempunyai tipe yang sama seperti artikel, resep, dan sejenisnya.

4. Halaman mana saja yang perlu diberi Schema?

Rekomendasi saya tentu saja yang pertama adalah homepage, setelah itu diikuti dengan Contact dan About. Untuk melakukan schema di Contact dan About, anda harus menambahkan sendiri dengan menggunakan plugin header jika anda adalah pengguna WordPress.

5. Apakah saya perlu menambahkan Markup untuk setiap properti yang bisa ditambahkan?

Tidak perlu. Tentu saja semakin banyak yang ditambahkan akan semakin bagus. Melakukan hal itu akan menghabiskan waktu yang cukup banyak karena harus mencari lagi properti properti apa saja yang harus dimasukkan dan harus sedikit mempelajarinya. Jika anda belum bisa menghabiskan waktu seharian untuk ini, anda bisa hanya menambahkan yang penting-penting saja seperti Name, URL, dan lain-lain.

6. Bagaimana jika suatu saat halaman saya membutuhkan 2 properti yang sama dengan informasi berbeda (seperti author)?

Tidak apa apa, masukkan saja dengan properti sesuai dengan informasi masing-masing.

Kesimpulan

Schema digunakan untuk memberikan label atas sebuah informasi yang berada di halaman web. Google sebenarnya juga bisa untuk memberikan label sendiri, tetapi karena banyaknya jumlah halaman yang terdapat di internet, Google mengalami kesulitan untuk menerka secara tepat informasi seperti apakah yang terdapat di suatu halaman. Alhasil, hanya halaman yang lebih tinggi ranknya saja (mempunyai banyak traffic) yang akan diprioritaskan untuk dimengerti oleh mesin pencari.

Maka dari itu Schema yang dilakukan oleh webmaster (pemilik website) akan membantu mesin pencari seperti Google untuk mengenal informasi yang terdapat di suatu halaman secara tepat dan secara tidak langsung membantu website tersebut dan akan mempunyai rank yang lebih tinggi. 

Meskipun di saat ini Google belum membuat schema ini sebagai salah satu ranking factor yang signifikan, tetapi di masa depan kemungkinan besar akan menjadi sesuatu yang cukup penting. Lebih baik dilakukan sekarang juga, melihat tidak sulit untuk melakukannya. 

Bagaimana penjelasan Schemanya? Apakah cukup dimengerti? Apakah anda saat ini menggunakan schema untuk bisnis anda atau tidak? Jika ada pertanyaan, atau mungkin anda mempunyai tips lain seputar pembuatan Schema markup ini, silahkan bertanya dengan berkomentar dibawah.

Kalau masih tidak mengerti, mohon berikan feedback dan saya akan memperbaikinya.

Leave a Reply 0 comments