Hreflang adalah hal penting bagi web internasional karena dapat memastikan versi halaman yang tepat ditampilkan kepada pengguna yang sesuai. Ketahui selengkapnya di sini!
Jika situs web Anda memiliki konten dalam beberapa bahasa, maka Anda harus memahami dan menggunakan atribut hreflang. Hreflang adalah atribut HTML sederhana, tetapi dapat menjadi sulit untuk dipahami.
Maka, dalam postingan ini kita akan membahas banyak hal, mencakup segala sesuatu tentang hreflang mulai dari konsep dasar, implementasi, hingga daftar kode hreflang untuk penggunaannya.
Apa Itu Hreflang?
Hreflang adalah atribut HTML yang digunakan oleh Google untuk menentukan bahasa dan target geografis dari sebuah halaman web.
Ini memungkinkan para webmaster untuk membantu mesin pencari menyajikan versi yang tepat dari sebuah halaman dalam bahasa yang berbeda.
Selanjutnya sebagai contoh, jika Anda memiliki versi sebuah halaman dalam bahasa Inggris dan Spanyol, Anda dapat menunjukkan kepada Google halaman yang harus ditampilkan berdasarkan lokasi geografis dan bahasa yang disukai pengguna.
Nah untuk itu, atribut hreflang mungkin hanya penting bagi perusahaan internasional, tetapi masih merupakan konsep penting yang harus dipahami oleh semua SEO dan webmaster.
Seperti Apa Bentuk Atribut Hreflang?
Atribut hreflang menggunakan sintaks yang sederhana dan konsisten:
<link rel=”alternate” hreflang=”x” href=”https://contohweb.com/halaman-alternatif” />
Berikut ini adalah arti dari setiap bagian dari kode tersebut dalam bahasa Indonesia:
- link rel=“alternate”: Tautan dalam tag ini adalah versi alternatif dari halaman ini.
- hreflang=“x”: Halaman tersebut merupakan versi alternatif karena berbahasa yang berbeda, yaitu bahasa x.
- href=“https://contohweb.com/halaman-alternatif”: Halaman alternatif dapat ditemukan di URL ini.
Contoh Penggunaan Hreflang
Selanjutnya, berikut ini adalah contoh penggunaan atribut hreflang pada kode HTML sebuah halaman web:
<link rel=”alternate” hreflang=”en-US” href=”https://www.contohweb.com/en-us/page.html” />
<link rel=”alternate” hreflang=”en-GB” href=”https://www.contohweb.com/en-gb/page.html” />
<link rel=”alternate” hreflang=”es-ES” href=”https://www.contohweb.com/es-es/page.html” />
Di sini, atribut hreflang adalah menunjukkan bahwa terdapat versi halaman yang tersedia dalam bahasa Inggris Amerika Serikat, Inggris Britania, dan Spanyol, dengan tautan ke masing-masing versi tersebut.
Atribut ini membantu mesin pencari menentukan versi halaman yang tepat untuk ditampilkan kepada pengguna berdasarkan preferensi bahasa dan lokasi geografisnya.
Oleh kerena itu, harap diingat bahwa hreflang harus ditambahkan pada setiap versi halaman yang tersedia untuk memastikan bahwa mesin pencari dapat memahami jika terdapat versi lain dari halaman tersebut yang tersedia dalam bahasa atau lokasi yang berbeda.
Di Mana Tag Hreflang Ditempatkan?
Untuk menjawab pertanyaan ini, Google menyatakan bahwa tag ini dapat diimplementasikan dengan salah satu dari tiga cara (Anda hanya perlu memilih satu).
- Sebagai tautan di head HTML halaman.
- Di header HTTP (untuk file non-HTML seperti PDF).
- Pada sitemap XML.
1. Sebagai Tautan di <head> Halaman Atribut, Hreflang Terlihat Seperti:
- rel=”alternate” href=”(URL)” hreflang=”(kode bahasa dan negara)”.
- rel=”alternate” – Mirip dengan tag rel=”canonical”, ini adalah kode yang memberitahu mesin pencari bahwa terdapat versi lain dari halaman web ini.
- href= – URL yang mengikuti href= adalah lokasi halaman yang ditentukan.
- hreflang= – Atribut hreflang menentukan negara dan bahasa dari halaman alternatif. Gunakan kode bahasa dan negara untuk menentukan halaman yang akan ditampilkan.
Kode bahasa harus mengikuti gaya kode dua huruf ISO 639-1 saat ditulis dalam tag. Selanjutnya sebagai contoh, en (Inggris), es (Spanyol), zh (Cina).
Jika Anda hanya mentranslasikan halaman di negara yang sama, tidak perlu menggunakan kode negara.
Namun, jika Anda menggunakan kode negara, harus mengikuti format ISO 3166-1 Alpha 2 – seperti au (Australia), us (Amerika Serikat), sg (Singapura).
Selanjutnya saat menulis tag hreflang, selalu letakkan kode bahasa terlebih dahulu, diikuti oleh kode negara. Sebagai contoh, en-au, es-us, zh-sg.
Contoh:
Jika webmaster dari contohweb.com ingin menampilkan halaman depannya kepada pengguna yang berbicara bahasa Inggris dan Spanyol di Amerika Serikat, ia akan menggunakan anotasi berikut di <head> dari HTML situsnya:
<link rel=”alternate” href=”https://www.contohweb.com” hreflang=”en-us” />
<link rel=”alternate” href=”https://www.contohweb.com/es” hreflang=”es-us” />
Jika ia ingin menampilkan halaman depan kepada pengguna yang berbicara bahasa Spanyol di Venezuela dan Meksiko, anotasi hreflang akan terlihat seperti ini:
<link rel=”alternate” href=”https://www.contohweb.com/ve” hreflang=”es-ve” />
<link rel=”alternate” href=”https://www.contohweb.com/mx” hreflang=”es-mx” />
Tag ini dihasilkan menggunakan generator tag hreflang di aleydasolis.com. Coba sendiri jika Anda ingin bantuan tambahan untuk menggunakannya dengan benar.
2. Di Header HTTP (Jika Anda Mempublikasikan File Non-HTML Seperti PDF)
Header HTTP harus digunakan untuk mengimplementasikan hreflang untuk PDF dan konten non-HTML pada situs web Anda.
Meskipun namanya head, ini tidak berhubungan dengan tag HTML <head> atau <header> di halaman, tetapi diatur di backend sebuah situs.
Yoast menjelaskan bahwa masalah dengan menggunakan header HTTP dapat menambah overhead pada setiap permintaan yang dibuat pada situs Anda, sehingga potensial memperlambat pengalaman browsing pengguna.
Oleh karena itu, meskipun demikian, untuk mengidentifikasi dokumen PDF pada situs Anda dalam versi bahasa Inggris dan Perancis, tautan harus muncul di header HTTP seperti di bawah ini.
Link Contoh:
http://en.contohweb.com/document.pdf; rel=”alternate”; hreflang=”en”,
http://fr.contohweb.com/document.pdf; rel=”alternate”; hreflang=”fr”
3. Hreflang Pada Sitemap XML
Anda dapat menambahkan atribut hreflang ke sitemap XML dengan cara yang sama seperti menambahkannya pada tag tautan pada halaman web. Berikut ini adalah contoh penambahan atribut hreflang ke sitemap XML:
Di sini, setiap versi halaman yang tersedia dalam bahasa atau lokasi yang berbeda ditambahkan ke dalam sitemap XML menggunakan tag xhtml:link dengan atribut hreflang yang sesuai.
Ini membantu mesin pencari menentukan versi halaman yang tepat untuk ditampilkan kepada pengguna berdasarkan preferensi bahasa dan lokasi geografisnya.
Harap diingat bahwa hreflang adalah ditambahkan pada setiap versi halaman yang tersedia di sitemap XML untuk memastikan bahwa mesin pencari dapat memahami jika terdapat versi lain dari halaman tersebut yang tersedia dalam bahasa atau lokasi yang berbeda.
Cara Terbaik dalam Penerapan Hreflang
Meskipun beberapa SEO menganggap ini sebagai kebiasaan opsional, panduan Google menyatakan bahwa ini adalah hal yang harus dilakukan.
1. Cara Memasang Hreflang di WordPress dengan Polylang
Untuk memasang tag Hreflang di WordPress, pertama-tama pastikan bahwa Anda telah memiliki versi WordPress terbaru. Jika sudah, ikuti langkah-langkah berikut ini:
- Login ke dashboard WordPress Anda.
- Instal plugin polylang.
- Aktifkan plugin tersebut.
- Lalu, Anda bisa menambahkan bahasa yang dikehendaki.
- Ikuti tahapan mudah sesuai dengan petunjuk.
- Dan, pemasangan hreflang pun selesai.
Anda dapat memverifikasi bahwa tag hreflang sudah terpasang dengan menggunakan alat seperti Google Search Console atau dengan menggunakan ekstensi seperti Hreflang Tag Assistant di browser Chrome.
Sebagai tambahan, Anda juga dapat menambahkan tag hreflang secara manual dengan menambahkannya ke file header.php tema WordPress Anda.
2. Tutorial Umum
Untuk menerapkan atribut hreflang dengan cara yang paling efektif, berikut adalah beberapa langkah yang dapat Anda lakukan:
- Selalu gunakan atribut hreflang yang merujuk pada diri sendiri (halaman web).
- Setiap kali Anda menerapkan atribut hreflang pada sebuah halaman, pastikan bahwa Anda telah menambahkan tautan hreflang yang merujuk pada diri sendiri pada halaman tersebut.
- Sebagai contoh, situs Anda memiliki versi Inggris dan Italia dari sebuah halaman: https://contohweb.com/hello dan https://contohweb.com/ciao
- Selain itu gunakan:
<link rel=”alternate” hreflang=”it” href=”https://contohweb.com/ciao” />
- Versi Inggris juga harus merujuk pada diri sendiri:
<link rel=”alternate” hreflang=”en” href=”https://contohweb.com/hello” />
Meskipun beberapa pakar SEO menganggap ini sebagai kebiasaan opsional, panduan Google menyatakan bahwa ini adalah hal yang harus dilakukan.
3. Pastikan Kode Bahasa dan Wilayah yang Digunakan Benar
Googlebot mengidentifikasi nilai atribut hreflang adalah dengan bantuan kode bahasa dan wilayah. Format yang disetujui Google untuk kode bahasa adalah ISO 639-1 dan ISO 3166-1 Alpha 2 untuk kode wilayah.
Meskipun kode bahasa merupakan hal yang wajib, kode wilayah merupakan opsional dalam atribut hreflang.
Jadi, jika Anda hanya menyertakan satu kode, Google akan mempertimbangkannya sebagai kode bahasa secara default. Oleh karena itu, Anda harus menggunakan format yang benar untuk kode.
Sebagai contoh, jika Anda menargetkan Inggris, kode bahasa-lokasi yang digunakan harus en-gb, bukan en-uk.
4. Tambahkan Tag “X-Default” untuk Bahasa yang Tidak Cocok
Tag hreflang x-default memberitahu Google bahwa halaman tersebut untuk setiap bahasa lain yang tidak disebutkan dalam bagian hreflang.
Dengan kata lain, ini bertindak sebagai halaman cadangan yang akan ditampilkan kepada pengguna yang tidak cocok dengan kode bahasa yang ditentukan. Ini bukan kebiasaan yang wajib, tetapi Google menyarankannya.
Ini terlihat seperti ini:
<link rel=”alternate” hreflang=”x-default” href=”https://contohweb.com/” />
5. Set Atribut Hreflang Harus Sama Pada Semua Versi Halaman
Cara terbaik untuk memastikan keakuratan atribut hreflang adalah dengan memeriksa apakah tag sama di semua versi halaman.
Dengan kata lain, setiap halaman dalam kelompok tersebut harus memiliki set atribut hreflang yang sama persis.
Kembali ke contoh halaman depan blog ahrefs.com, terdapat enam versi bahasa, dan setiap versi terlokalisasi memiliki set atribut hreflang yang sama persis (6 bahasa + x-default).
Tabel Daftar Kode Bahasa Hreflang
Berikut adalah tabel daftar kode bahasa hreflang menurut ISO 639-1:
Kode Bahasa | Nama Bahasa | Kode Bahasa | Nama Bahasa |
af | Afrikaans | it | Italian |
sq | Albania | ja | Japanese |
ar | Arab | kn | Kannada |
hy | Armenia | ko | Korean |
az | Azerbaijan | lv | Latvian |
eu | Basque | lt | Lithuanian |
be | Belarusian | mk | Macedonian |
bg | Bulgarian | ms | Malay |
ca | Catalan | mt | Maltese |
zh | Chinese | no | Norwegian |
hr | Croatian | fa | Persian |
cs | Czech | pl | Polish |
da | Danish | pt | Portuguese |
nl | Dutch | ro | Romanian |
en | English | ru | Russian |
et | Estonian | sr | Serbian |
tl | Filipino | sk | Slovak |
fi | Finnish | sl | Slovenian |
fr | French | es | Spanish |
gl | Galician | sw | Swahili |
ka | Georgian | sv | Swedish |
de | German | ta | Tamil |
el | Greek | te | Telugu |
gu | Gujarati | th | Thai |
ht | Haitian Creole | tr | Turkish |
iw | Hebrew | uk | Ukrainian |
hi | Hindi | ur | Urdu |
hu | Hungarian | vi | Vietnamese |
is | Icelandic | cy | Welsh |
id | Indonesian | yi | Yiddish |
ga | Irish |
Jika Anda ingin menargetkan wilayah tertentu, Anda dapat menambahkan kode wilayah menurut ISO 3166-1 Alpha 2 setelah kode bahasa. Sebagai contoh, en-us menandakan bahasa Inggris yang ditargetkan ke Amerika Serikat.
Tips dalam Penerapan Hreflang
Hreflang adalah hal yang tidak bisa dilakukan secara asal-asalan. Di bawah ini akan kita bahas beberapa tips dalam penerapan hreflang:
1. Pastikan Bahwa Setiap Versi Halaman Diterjemahkan dengan Benar
Untuk mencapai tujuan tersebut, sangat penting memastikan bahwa versi halaman yang ditampilkan kepada pengguna sesuai dengan preferensi bahasa dan lokasi geografisnya, dan memastikan bahwa konten yang ditampilkan relevan dan andal bagi pengguna tersebut.
2. Tentukan Lokasi Geografis yang Tepat untuk Setiap Versi Halaman
Jika Anda memiliki versi halaman yang ditujukan untuk pengguna di negara atau wilayah yang berbeda, pastikan bahwa Anda menggunakan kode negara yang sesuai dengan format ISO 3166-1 Alpha 2.
Ini akan membantu mesin pencari menentukan versi halaman yang tepat untuk ditampilkan kepada pengguna di lokasi geografis yang berbeda.
3. Tentukan Bahasa yang Tepat untuk Setiap Versi Page
Pastikan bahwa Anda menggunakan kode bahasa yang sesuai dengan format ISO 639-1 untuk menunjukkan bahasa yang digunakan pada setiap versi halaman.
Ini akan membantu mesin pencari menentukan versi halaman yang tepat untuk ditampilkan kepada pengguna dengan preferensi bahasa yang sesuai.
4. Tambahkan Atribut Hreflang Pada Setiap Versi Halaman yang Tersedia
Pastikan bahwa Anda menambahkan atribut hreflang adalah pada setiap versi halaman yang tersedia di situs web Anda.
Ini akan membantu mesin pencari menentukan bahwa terdapat versi lain dari halaman tersebut yang tersedia dalam bahasa atau lokasi yang berbeda.
Selanjutnya, pastikan juga bahwa setiap versi halaman yang tersedia dihubungkan dengan benar dengan versi lainnya menggunakan atribut hreflang yang sesuai.
Ini akan membantu mesin pencari menentukan versi halaman yang tepat untuk ditampilkan kepada pengguna yang sesuai dengan preferensi bahasa dan lokasi geografisnya.
Pentingnya Penggunaan Hreflang
Berikut ini adalah lima poin penting mengenai penggunaan atribut hreflang:
1. Membantu Mesin Pencari
Membantu mesin pencari menentukan versi halaman yang tepat untuk ditampilkan kepada pengguna berdasarkan preferensi bahasa dan lokasi geografisnya.
Oleh karena itu, sangat disarankan untuk membuat versi situs web yang disesuaikan untuk setiap bahasa atau wilayah yang dituju, agar dapat memperluas jangkauan dan meningkatkan relevansi bagi pengguna di negara atau wilayah tersebut.
Baca Juga : Apa itu SERP? Mengapa Penting Bagi SEO?
2. Meningkatkan Relevansi Konten
Meningkatkan relevansi dan keandalan situs web Anda bagi mesin pencari. Dengan memastikan bahwa versi halaman yang tepat ditampilkan kepada pengguna yang sesuai dengan preferensi.
Baik itu preferensi bahasa dan lokasi geografisnya, Anda dapat membantu mesin pencari menentukan bahwa situs web Anda relevan dan andal untuk pengguna tersebut.
3. Meningkatkan Peringkat Situs Web di Hasil Pencarian
Namun, jika situs web Anda tidak dianggap relevan atau andal oleh mesin pencari, maka kemungkinan akan lebih rendah di peringkat di hasil pencarian.
Ini dapat meningkatkan lalu lintas situs web Anda dan meningkatkan potensi pendapatan. Pada poin ini, hreflang adalah bagian yang tidak boleh dilewatkan.
4. Membantu Menghindari Duplikasi Konten
Penggunaan atribut hreflang dapat membantu menghindari terjadinya duplikasi konten di situs web, karena akan memastikan bahwa hanya satu versi halaman yang ditampilkan untuk setiap preferensi bahasa dan lokasi geografis.
Namun, jika duplikasi konten tidak dihindari, hal ini dapat merugikan SEO situs web Anda karena dapat membingungkan mesin pencari dan menurunkan peringkat situs web.
Oleh karena itu, sebaiknya hindari duplikasi konten dengan menggunakan atribut hreflang pada situs web Anda.
Baca Juga : Apa itu Konten Plagiat? Begini Cara Menghindari Konten Plagiat
5. Menghemat Waktu dan Tenaga
Penggunaan atribut hreflang adalah membantu menghemat waktu dan tenaga yang dibutuhkan untuk memantau dan mengelola versi halaman yang tersedia dalam bahasa atau lokasi yang berbeda.
Dengan menggunakan atribut hreflang, Anda dapat dengan mudah mengatur versi halaman yang tersedia di situs web tanpa perlu memantau dan mengelolanya secara manual.
Penutup
Hreflang adalah hal yang dapat menghemat waktu dan tenaga yang dihabiskan untuk memastikan bahwa versi halaman yang tepat ditampilkan kepada pengguna yang sesuai dengan preferensi bahasa dan lokasi geografisnya.
Oleh karena itu, mulai sekarang, rencanakan web Anda untuk menggunakan hreflang! Jadi, ikuti beberapa cara dan tips di atas!