Assalamu’alaikum Warahmatullahi Wabarakaatuh,
Halo Sobat Mas Rizky, berjumpa lagi ya di Website yang sama, dalam kesempatan kali ini admin Masrizky.web.id akan berbagi dengan judul pada postingan artikel ini
Mengetahui perbedaan rel=amphtml dan rel=canonical kegunaannya
Dalam dunia optimasi mesin pencari (SEO) dan pengembangan web, atribut rel
pada tag link HTML memainkan peran penting dalam memberikan informasi tambahan pada mesin pencari mengenai hubungan antara halaman web yang berbeda.
Dua atribut yang sering dibahas adalah rel=amphtml
dan rel=canonical
. Meskipun keduanya digunakan untuk tujuan SEO, mereka memiliki fungsi yang berbeda.
Atribut rel=amphtml
digunakan untuk menunjukkan bahwa ada versi Accelerated Mobile Pages (AMP) dari sebuah halaman web.
AMP adalah proyek dari Google yang bertujuan untuk mempercepat tampilan halaman web pada perangkat mobile.
Ketika sebuah halaman web memiliki versi AMP, tag link dengan atribut rel=amphtml
akan ditempatkan di dalam head HTML dari halaman asli untuk menunjukkan kepada mesin pencari bahwa versi AMP dari halaman tersebut tersedia.
Ini membantu mesin pencari seperti Google untuk mengarahkan pengguna ke versi AMP yang lebih cepat saat mereka mengakses halaman tersebut dari perangkat mobile.
Sementara itu, atribut rel=canonical
digunakan untuk membantu mengelola masalah konten duplikat dengan menunjukkan URL asli dari sebuah halaman web.
Dalam kasus di mana konten yang sama atau sangat mirip tersedia di beberapa URL, tag link dengan atribut rel=canonical
ditempatkan di dalam head HTML untuk menunjukkan URL utama atau asli yang seharusnya diindeks oleh mesin pencari.
Ini membantu memastikan bahwa nilai SEO tidak tersebar di antara beberapa URL dan bahwa halaman yang benar mendapatkan peringkat yang lebih tinggi di hasil pencarian.
Secara ringkas, rel=amphtml
digunakan untuk mengarahkan mesin pencari ke versi AMP dari sebuah halaman web, sementara rel=canonical
digunakan untuk menunjukkan URL utama dari konten yang mungkin tersedia di beberapa URL.
Keduanya sangat penting dalam strategi SEO untuk memastikan bahwa pengguna mendapatkan pengalaman terbaik dan bahwa halaman web diindeks secara efektif oleh mesin pencari.
Tergesa-gesa adalah perbuatan Iblis. Itulah ungkapan awal dari kata kata saya, karena artikel ini merupakan perbaikan dari artikel sebelumnya (baca: Anda Ingin Menampilkan Logo AMP di Mesin Pencarian). Karena saya ingin cepat mendapatkan logo “petir” akhirnya saya melakukan ujicoba lagi. Ya.. tapi dibalik semua ada hikmahnya pastinya.. ambil pelajarannya saja.
rel=”amphtml” vs rel=”canonical”
Pada postingan sebelumnya, saya menganjurkan pada tempelate html gunakan atribut rel='amphtml'
, dan ternyata ada perbedaan yang mendasar antara atribut rel='amphtml'
dan rel='canonical'
. Walau pun pada intinya sama saja untuk menunjukan URL kanonis sebuah website.
Kode atribut rel='amphtml'
dan rel='canonical'
keduanya digunakan, hanya apabila web / blog kamu mempunyai 2 (dua) versi yaitu AMP dan Non-AMPHTML. Kode atribut rel='amphtml'
digunakan pada halaman Non-AMP untuk menunjukan mana link versi AMPHTML dari halaman tersebut.
Jadi sobat, pada halaman Non-AMP pasang code yang menunjukan mana versi AMP nya, misalkan seperti contoh dibawah ini :
<link rel='amphtml' href='http://masrizky.web.id/amp/contoh-artikel.html'/>
Pada halaman AMPnya, tunjukan mana versi Non-AMP dengan atribut rel='canonical'
,contohnya seperti ini :
Bagaimana dengan Blogger / Blogspot? di karenakan Blogger hanya mempunyai 1 versi (kalau sobat sudah pake template AMP), maka cukup gunakan rel='canonical'
saja. Cukup dengan kode ini saja :
<link expr:href='data:blog.url' rel='canonical'/>
Bagi sobat yang sudah menerapkan atau menggunakan template AMP yang sudah Ready, silahkan hapus (kalau masih ada) kode seperti ini:
<link expr:href='data:blog.url' rel='amphtml'/>
Apakah akan langsung dapat “Petir”
Untuk mendapatkan amp atau dibilang petir, tentunya ada beberapa syarat, diantaranya sebagai berikut ini :
- Wajib menggunakan Template Valid AMPHTML
- Dalam penulisan artikel harus mengikuti pedoman AMPHTML (misal dalam penulisan tag image, video, iframe, dll)
- Harus menggunakan Markup Data yang terstruktur
- dll (lebih jelasnya akan saya buat artikel terpisah nantinya ya)