Skip to main content

Featured Post

Pamula Elegant Blogger Theme

Pamula  merupakan tema personal yang saya desain dengan beberapa referensi, Tema ini dibuat clean dan elegant untuk membuat lebeih fresh serta memaksimalkan fitur dari fungsi blogger agar dapat meminimalisir penggunaan javascript atau json blogger. Tema ini memiliki kecepatan super cepat seperti tema-tema yang saya share sebelumnya, tapi pada tema yang saya buat sekarang terus menggunakan fungsi javascript dan tidak ada jQuery di dalamnya. Kemungkinan kalian tidak akan paham karena terbiasa dengan jQuery. Pada tema ini kalian akan mendapatkan beberapa fitur menarik seperti : Kecepatan Loading Super Ngebut Dengan memiliki loading yang cepat pasti dapat membuat pengunjung menjadi lebih betah sebab tidak perlu cari Artikel serupa meskipun yang disebabkan oleh loading lambat. Saya sudah mencoba untuk mengetest kecepatan dengan bantuan dari GTmetrix dan Pagespeed. Untuk melihat hasilnya bisa cek gambar berikut: Kecepatan loading ini sudah saya test sendiri menggunak

Cara Membuat Halaman FAQ Page Schema di Blog



Belajar FAQ Json-ld di Blogger

Kali ini saya ngak share Tutorial dulu tapi belajar bareng saja dan pada kali ini saya akan membahas mengenai FAQ atau Frequently Asked Question yang biasanya digunakan untuk sebuah Halaman pertanyaan yang sering diajukan oleh user atau pengguna disebuah situs. Bagi kalian yang belum lihat bagaimana hasilnya dari mesin penelusuran di Google hasilnya seperti berikut.

Tampilan diatas hanya akan terlihat pada saat di mesin penelusuran dan pertanyaan yang akan saya berikan adalah Bagaimana Cara Membuat Itu? Pastinya kalian tidak tau kan? Oleh sebab itu saya membuat artikel ini agar belajar bareng.

Apa itu Schema FAQPage?

Schema.org memiliki info lebih lanjut tentang data terstruktur FAQ dan di acara Google Dance di Singapura di Juli 2018 Google mengumumkan bahwa mereka akan mulai menggunakan ini dalam pencarian. Anda dapat menemukan dokumentasi Google di sini .

Bagaimana saya bisa mendapatkan hasil penelusuran FAQ di Google?

Google telah mulai menampilkan halaman dengan markup data terstruktur FAQ (Microdata atau JSON-LD) dengan hasil yang kaya dalam SERPs (halaman hasil mesin pencari) dan juga membacakan jawaban Anda pada perangkat bertenaga asisten (terbatas untuk ponsel Android saat ini) dengan Tindakan Markup untuk Asisten Google.

Haruskah saya memilih versi Prettified atau Minified?

Ada dua versi kode Skema FAQPage JSON-LD. Salah satu harus bekerja tetapi versi yang diperkecil memiliki keuntungan kecil ketika datang ke kinerja situs web Anda. Itulah yang saya sarankan Anda gunakan.

Akankah emoji dan tag HTML berfungsi dengan Skema FAQPage?

Google tampaknya menerima hal-hal seperti emoji dan karakter unicode seperti dicoret teks tetapi menurut Google secara resmi bagian jawaban dapat berisi tag HTML ini:
  • heading - h1, h2, h3, h4, h5, h6
  • tautan - a
  • jeda baris - br
  • daftar - ol , ul, li
  • paragraf - p, div
  • tebal - b, kuat
  • miring - i, em

Apakah FAQ Snippet berfungsi di ponsel atau desktop?

Cuplikan FAQ akan bekerja dengan hasil pencarian desktop dan seluler di semua negara dan bahasa yang didukung Google.

Bagaimana saya bisa mendapatkan FAQPage untuk bekerja dengan perangkat bertenaga asisten Google?

Kode FAQPage yang dihasilkan oleh alat Generator Skema Halaman FAQ ini akan diambil oleh perangkat bertenaga Google Search dan Google Assistant.

Anda hanya perlu menginstalnya di halaman Anda, Anda dapat memeriksa apakah itu berfungsi seperti yang diharapkan dengan memvalidasi halaman dengan Google Rich Result TestingPengujian Hasil Kaya. Anda tidak perlu melakukan apa pun ekstra agar dapat diambil oleh perangkat bertenaga asisten Google.

Apa perbedaan antara FAQ dan FAQ Schema QA?

FAQ dan QA adalah dua markup data terstruktur berbeda yang dapat digunakan pada halaman Anda untuk mendapatkan hasil yang kaya dalam hasil pencarian Google. Walaupun terdengar mirip, mereka memiliki tujuan yang sedikit berbeda

Jika Anda menawarkan halaman di mana banyak pengguna dapat mengirimkan jawaban alternatif untuk pertanyaan seperti situs Quora, StackOverflow dll, maka Anda harus menggunakan Q A Skema.

Jika Anda memiliki halaman FAQ dengan pertanyaan dan jawaban spesifik untuk pertanyaan-pertanyaan di sekitar topik yang sama Anda harus menggunakan Skema FAQ. mis: halaman ini menggunakan FAQ Schema.

Apa perbedaan antara FAQ dan FAQPage untuk Schema Markup?

AFAIK mereka adalah hal yang sama. Schema.org menyebutnya FAQPage dan Google menyebutnya sebagai FAQ dan Halaman FAQ. Beberapa nama umum lainnya untuk ini adalah Skema FAQ, FAQ Data Terstruktur, FAQ JSON-LD, dll.

Mencari contoh markup Schema FAQ?

Berikut adalah markup Skema FAQ yang digunakan pada halaman ini, Anda juga dapat melihatnya di Google dengan mencari "Pintarsaurus".

Cara Membuat Halaman FAQ


Sebenarnya ada cara lain selain menggunakan json-ld ini yaitu dengan microdata tapi saya belum terbiasa dan biasanya pakai json-ld tersebut. Bagi yang ingin mencobanya mari kita belajar bareng.

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "Blog Apa Pintarsaurus?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Pintarsaurus adalah blog yang membahas beebagai tutorial berdasarkan pengalaman sendiri."
      }
    }
  ]
}
</script>

Kode diatas hasilnya hasilnya bagaimana yah? Artikel ini saya publish dulu dan nanti di edit lagi jika sudah ada saat di mesin penelusuran baru update 🤣

Artikel kembali saya update dan setelah saya teliti lagi ternyata untuk membuat sebuah FAQ jangan satu Q and A minimal itu harus dua pertanyaan jika satu ngak nampil seperti berikut :

Belajar FAQ Json-ld di Blogger

Jika diatas saya pakai 1 pertanyaan saja dan sedangkan untuk dibawah saya gunakan 2 pertanyaan dan hasilnya tampil.

Belajar FAQ Json-ld di Blogger

Kesimpulan yang bisa saya dapatkan adalah jangan gunakan Q & A hanya untuk satu pertanyaan saja buat lebih banyak pertanyaan agar dapat ter-index oleh mesin penelusuran. Sekarang bagaimana untuk memasang di blog kita ? saya sudah kasih kode diatas tapi tidak dengan petunjuk atau langkah pemasanganya pasti pusing buat sobat.

Cara Membuat Halaman FAQ Page di Blog


Menggunakan Json-ld


Pertama buka Blog > klik Post > klik Entry Baru

Kedua copy kode berikut > paste pada bagian "HTML" bukan Compose

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "Pertanyaan?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Jawabanya apa."
      }
    },    {
      "@type": "Question",
      "name": "Pertanyaan?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Jawabanya apa."
      }
    },Tambah kode disini
  ]
}
</script>

Untuk menambah kode FAQ nya tinggal sobat copy kode berikut dan paste tepat setelah kode yang saya tandai diatas

{
      "@type": "Question",
      "name": "Pertanyaan?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Jawabanya apa."
      }
    }

Ini masih menggunakan Json-ld dan akan saya update lagi dengan menggunakan Microdata nanti.

Menggunakan Microdata


Jika diatas menggunakan Json-ld sekarang kita akan menggunakan Microdata untuk membuat halaman faq page diblog dan menurut saya ini jauh lebih enak ketimbang menggunakan Json-ld karena tidak perlu menambah kode lagi hanya perlu menggunakan Schema.org FAQ PAGE saja.

Untuk penerapanya gimana ? untuk menerapkan kode ini cukup mudah saja seperti diatas pada saat membuat sebuah postingan / halaman yang akan ditambahkan FAQ PAGE.

<div itemscope='itemscope' itemtype='https://schema.org/FAQPage'>
<div itemprop='mainEntity' itemscope='itemscope' itemtype='https://schema.org/Question'>
<h3 itemprop='name'>Pertanyaan</h3>
<div itemprop='acceptedAnswer' itemscope='itemscope' itemtype='https://schema.org/Answer'>
<div itemprop='text'>Jawaban</div>
</div>
</div>

Untuk menambah Faq menggunakan microdata cukup tambahkan kode berikut setelah kode jawaban

<div itemprop='mainEntity' itemscope='itemscope' itemtype='https://schema.org/Question'>
<h3 itemprop='name'>Pertanyaan</h3>
<div itemprop='acceptedAnswer' itemscope='itemscope' itemtype='https://schema.org/Answer'>
<div itemprop='text'>Jawaban</div>
</div>

Setelah sobat pasang FAQ tersebut pastinya ingin tau bagaimana hasilnya nanti dimesin penelusuran kan ? nah sobat bisa langsung klik tombol dibawah ini dan masukan url yang sudah ada kode FAQ dari tutorial ini.


Hasilnya terlihat seperti ini

Belajar FAQ Json-ld di Blogger

Ohh iya sebelumnya bagi kalian yang ingin Re-write artikel ini silahkan asal dikasih sumbernya.

Semoga artikel ini bermanfaat bagi sobat semua :D

Comments

  1. Super sekali.. Sangat bermanfaat.. Kelak jika saya sempet bikin artikel tentang schema faq bakal saya kasih backlink kesini sebagai referensi..

    ReplyDelete
    Replies
    1. wah dikomen kurazone :3 jadi semangat nih, sip kalau bermanfaat sob.

      Delete

Post a Comment

To insert a code use <i rel="pre">code_here</i>To insert a quote use <b rel="quote">your_qoute</b>To insert a picture use <i rel="image">url_image_here</i>To insert a video use <i rel="video">video</i>Tinggalkan komentar sesuai topik tulisan, komentar dengan link aktif tidak akan ditampilkan. Admin dan penulis blog mempunyai hak untuk menampilkan, menghapus, menandai spam, pada komentar yang dikirim.

Popular posts from this blog

Dapatkan Template Material X2 Secara Gratis

Template Material X2 adalah template yang dibuat oleh Yasyah Elhakim dan beliau adalah admin dari  elcreativeacademy dan sudah banyak postingan berkaitan tentang Blogger dan Web Development tapi beliau juga merupakan pembuat template yang sangat handal karena dapat membuat template yang bagus yaitu Material X2 ini yang banyak akan kayak fitur tapi disini kita akan ngomongin versi gratisnya bukan yang premium. Yasyah Elhakim membagikan Material X2 Lite secara gratis alias cuma-cuman untuk sobat tapi dengan membedakan fitur pada yang premium karena ini gratis untuk tampilan dan beberapa hal masih sama saja hanya untuk fitur dihilangkan oleh author nya. Template Material X2 ini memiliki desain yang clean serta menggunakan material desain yang bagus bila disebut ini merupakan template yang mirip dengan Developer Goggle karena terinspirasi bisa dikatakan oleh saya. So tampilan yang bagus dan fitur yang keren ini sudah menanti untuk sobat loh jadi dicoba sekarang juga. Download Temp

Cara Buat Tombol Menu Dengan CSS

Membuat Tombol Menu hanya dengan CSS tanpa perlu bantuan dari Icon-icon seperti FontAwesome, Materialicon, Dashicon dll. Berbeda dengan menggunakan Icon kita mengharuskan untuk memasukan salah satu kode dari icon tersebut atau bisa disebut dipanggil kodenya. Jika dengan CSS kita hanya perlu menggunakan Fungsi dari Before dan After jadi dengan menggandalkan fungsi dari Css tersebut kita bisa membuat Tombol Menu atau Close sesuai dengan kreatifitas sendiri. Untuk membuat Menu dengan Css kalian bisa langsung praktekan caranya dibawah ini atau jika ingin disimpan untuk nanti bisa langsung download source kodenya. Cara Buat Tombol Menu Dengan CSS Sebelum ke Tutorialnya kalian harus menyiapkan bahan-bahan terlebih dahulu. Sublime (Sebagai Text Editor) Makanan Ringan Kopi Niat Pertama buka Sublime kalian bisa gunakan Text Editor apa saja seterah. Kedua buat file dengan nama "Index.html" lalu simpan file tersebut dimana saja. Ketiga buat struktur HTML atau HTML5

One Piece Pirate Warriors 3 Unlock All DLC

Bagi kalian yang memainkan game One Piece Pirate Warriors 3 pastinya bosan donk kalau Custome karakter yang kalian mainkan itu-itu saja dan tidak ada perubahan sama sekali meski sudah ada tampilan yang berbeda dari setiap karakter karena adanya Custome dari Normal sampai ke New World (Dunia Baru). Disini saya akan membagikan DLC One Piece Pirate Wrarriors 3 yang bisa kalian download secara gratis dan tentu saja DLC ini saya dapatkan dari beberapa Forum luar dan saya sudah saya jadikan satu Folder agar kalian lebih mudah dalam memasang DLC ini. Lantas siapa saja yang dapat DLC pada One Piece Pirate Warriors 3 ini ? DLC yang akan kalian dapatkan pada game ini adalah sebagai berikut : Characters DLC Luffy Samurai Zorro Kimono "Z" Final Battle Nami Wedding Dress Kunoichi Sun Shangxiang Dressrosa Usopp Kimono Sanji Kimono "Z" Final Battle Chopper Kimono Robin Xingcai Kaihime Dressrosa Hancock Diaochan Naotora Ii 3D2Y Tashig