Dalam konfigurasi ini, halaman desktop dan seluler memiliki URL yang berbeda.
Penyiapan umum akan berupa halaman di www.example.com
yang ditayangkan bagi pengguna desktop, dengan
halaman terkait yang ditayangkan di m.example.com
bagi pengguna seluler. Google tidak
mengutamakan format URL tertentu asalkan bisa diakses oleh semua
agen-pengguna Googlebot.
TL;DR
Memberitahukan hubungan antara dua URL melalui tag
<link>
dengan elemenrel="canonical"
danrel="alternate"
.Mendeteksi string agen-pengguna dan mengalihkannya dengan benar.
Anotasi untuk URL desktop dan seluler
Untuk membantu algoritme kami memahami URL seluler terpisah, sebaiknya gunakan anotasi berikut:
- Di halaman desktop, tambahkan tag
rel="alternate"
yang mengarah ke URL seluler terkait. Hal ini membantu Googlebot menemukan lokasi halaman seluler situs Anda. - Di halaman seluler, tambahkan tag
rel="canonical"
yang mengarah ke URL desktop terkait.
Kami mendukung dua metode untuk menyertakan anotasi ini: dalam HTML
halaman sendiri dan di peta situs. Misalnya, anggap saja URL desktopnya
adalah http://example.com/page-1
dan URL seluler terkaitnya adalah
http://m.example.com/page-1
. Anotasi untuk contoh ini akan seperti
berikut:
Anotasi dalam HTML
Di halaman desktop (http://www.example.com/page-1
), tambahkan anotasi berikut:
<link rel="alternate" media="only screen and (max-width: 640px)"
href="http://m.example.com/page-1">
Di halaman seluler (http://m.example.com/page-1
), anotasi yang diperlukan
adalah:
<link rel="canonical" href="http://www.example.com/page-1">
Tag rel="canonical"
pada URL seluler yang mengarah ke halaman desktop
harus ada.
Anotasi di peta situs
Kami mendukung penyertaan anotasi rel="alternate"
untuk halaman desktop di
peta situs seperti ini:
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>http://www.example.com/page-1/</loc>
<xhtml:link rel="alternate" media="only screen and (max-width: 640px)"
href="http://m.example.com/page-1" />
</url>
</urlset>
Tag rel="canonical"
yang diperlukan pada URL seluler harus tetap ditambahkan ke
HTML halaman seluler.
Anotasi secara mendetail
Perhatikan atribut tag link pada halaman desktop:
- Atribut
rel="alternate"
memberitahukan bahwa tag ini menentukan URL alternatif ke halaman desktop. - Nilai atribut medianya adalah string kueri media CSS yang menentukan fitur media yang menjelaskan kapan Google harus menggunakan URL alternatif. Dalam hal ini, kami menggunakan kueri media yang biasanya digunakan untuk menargetkan perangkat seluler.
- Atribut href menentukan lokasi URL alternatif, yaitu
halaman di
m.example.com
.
Anotasi dua arah ("bidireksional") ini membantu Googlebot menemukan konten dan membantu algoritme kami memahami hubungan antara halaman desktop dan seluler Anda, serta memperlakukannya sebagaimana mestinya. Saat Anda menggunakan URL yang berbeda untuk menayangkan konten yang sama dalam format berbeda, anotasi memberi tahu algoritme Google bahwa kedua URL tersebut memiliki konten yang sama dan harus diperlakukan sebagai satu kesatuan, bukan dua. Jika halaman versi desktop dan seluler diperlakukan secara terpisah, baik URL desktop maupun seluler bisa ditampilkan dalam hasil penelusuran desktop, dan peringkatnya mungkin lebih rendah dibandingkan jika Google memahami hubungan keduanya. Berikut adalah beberapa kesalahan umum dalam konfigurasi ini:
- Saat menggunakan markup
rel="alternate"
danrel="canonical"
, pertahankan rasio 1 banding 1 antara halaman seluler dan halaman desktop yang terkait. Secara khusus, hindari pemberian anotasi pada banyak halaman desktop yang merujuk ke satu halaman seluler (atau sebaliknya). - Periksa kembali pengalihan Anda, pastikan halaman desktop tidak tiba-tiba mengalihkan ke satu halaman seluler yang tidak terkait.

Pengalihan otomatis
Saat situs web dikonfigurasikan untuk menyajikan browser desktop dan seluler menggunakan URL yang berbeda, webmaster mungkin ingin mengalihkan pengguna ke URL yang paling baik bagi mereka secara otomatis. Apabila situs web Anda menggunakan pengalihan otomatis, pastikan untuk memperlakukan semua Googlebot layaknya agen pengguna yang lain dan lakukan pengalihan dengan sesuai.
Teknik pengalihan yang didukung
Googlebot mendukung dua penerapan pengalihan berikut:
- Pengalihan HTTP
- Pengalihan JavaScript
Menggunakan pengalihan HTTP
Pengalihan HTTP umumnya digunakan untuk mengalihkan klien ke URL spesifik perangkat.
Biasanya, pengalihan dilakukan berdasarkan agen-pengguna dalam header
permintaan HTTP. Sangat penting untuk menjaga konsistensi pengalihan dengan URL alternatif
yang ditentukan dalam tag rel="alternate"
halaman atau di Peta Situs.
Untuk tujuan ini, tidak masalah apakah server mengalihkan dengan kode status HTTP 301 atau 302, tetapi sebaiknya gunakan 302 jika memungkinkan.
Pengalihan JavaScript
Jika pengalihan HTTP sulit diimplementasikan, Anda bisa menggunakan JavaScript untuk
mengalihkan pengguna ke URL yang ditunjukan dengan tag rel="alternate"
. Jika memilih untuk menggunakan teknik ini, berhati-hatilah dengan
latensi yang disebabkan oleh pengalihan sisi klien karena diperlukan download halaman
terlebih dahulu lalu mengurai dan menjalankan JavaScript sebelum memicu pengalihan.
Ada banyak pendekatan untuk mengimplementasikan pengalihan berbasis JavaScript. Misalnya,
Anda dapat menggunakan JavaScript untuk menjalankan kueri media yang telah
digunakan situs Anda di anotasi link pada halaman menggunakan fungsi
JavaScript matchMedia()
.
Pengalihan dua arah vs satu arah
Setiap situs mengimplementasikan kebijakan pengalihan yang berbeda. Beberapa situs hanya mengalihkan pengguna seluler yang mengunjungi halaman desktop ke halaman seluler (pengalihan "satu arah"), dan beberapa situs mengalihkan kedua pengguna jika mereka secara berkebalikan mengunjungi situs desktop dan seluler (pengalihan "dua arah").
Untuk Googlebot, kami tidak memiliki preferensi apa pun dan menyarankan agar webmaster mempertimbangkan penggunanya saat menentukan kebijakan pengalihan. Hal yang paling penting adalah menayangkan pengalihan yang benar dan konsisten, atau dengan kata lain, mengalihkan ke konten yang setara di situs desktop atau seluler. Jika konfigurasi Anda salah, beberapa pengguna mungkin tidak akan bisa melihat konten Anda sama sekali.
Selain itu, sebaiknya beri pengguna cara untuk mengganti kebijakan pengalihan tersebut atau, dengan kata lain, mungkinkan pengguna seluler melihat halaman desktop dan mungkinkan pengguna desktop melihat halaman seluler jika menginginkannya.