URL แบบแยก

ในการกำหนดค่าแบบนี้ หน้ารุ่นเดสก์ท็อปและรุ่นอุปกรณ์เคลื่อนที่จะมี URL ต่างกัน

การตั้งค่าทั่วไปจะเป็นการตั้งค่าหน้าเว็บที่ www.example.com ให้แสดงแก่ผู้ใช้เดสก์ท็อปโดยมีหน้าเว็บที่ตรงกันที่ m.example.com สำหรับแสดงแก่ผู้ใช้อุปกรณ์เคลื่อนที่ Google ไม่ได้ต้องการให้ใช้รูปแบบ URL รูปแบบใดเป็นพิเศษตราบใดที่ User Agent ทั้งหมดของ Googlebot เข้าถึง URL เหล่านั้นได้

TL;DR

  • ส่งสัญญาณแจ้งความสัมพันธ์ระหว่าง URL ทั้งสองโดยใช้แท็ก <link> พร้อมด้วยเอลิเมนต์ rel="canonical" และ rel="alternate"

  • ตรวจหาสตริง User Agent และเปลี่ยนเส้นทางสตริงอย่างถูกต้อง

คำอธิบายประกอบสำหรับ URL เดสก์ท็อปและอุปกรณ์เคลื่อนที่

ขอแนะนำให้คุณใช้คำอธิบายประกอบต่อไปนี้เพื่อช่วยให้อัลกอริทึมของเราเข้าใจ URL อุปกรณ์เคลื่อนที่ที่แยกต่างหาก

  1. ในหน้ารุ่นเดสก์ท็อป ให้เพิ่มแท็กลิงก์แบบพิเศษ rel="alternate" ที่ชี้ไปยัง URL อุปกรณ์เคลื่อนที่ที่ตรงกัน วิธีนี้ช่วยให้ Googlebot ค้นพบตำแหน่งหน้ารุ่นอุปกรณ์เคลื่อนที่ของเว็บไซต์คุณ
  2. ในหน้ารุ่นอุปกรณ์เคลื่อนที่ ให้เพิ่มแท็กลิงก์ rel="canonical" ที่ชี้ไปยัง URL เดสก์ท็อปที่ตรงกัน

เรารองรับวิธีใช้คำอธิบายประกอบนี้ 2 วิธี ได้แก่ ใน HTML ของหน้าเว็บเองและในแผนผังไซต์ ตัวอย่างเช่น สมมติว่า URL เดสก์ท็อปคือ http://example.com/page-1 และ URL อุปกรณ์เคลื่อนที่ที่ตรงกันคือ http://m.example.com/page-1 คำอธิบายประกอบในตัวอย่างนี้จะเป็นดังนี้

คำอธิบายประกอบใน HTML

ในหน้ารุ่นเดสก์ท็อป (http://www.example.com/page-1) ให้เพิ่มข้อมูลเสริมต่อไปนี้ลงในโค้ด

<link rel="alternate" media="only screen and (max-width: 640px)"
 href="http://m.example.com/page-1">

ในหน้ารุ่นอุปกรณ์เคลื่อนที่ (http://m.example.com/page-1) ข้อมูลเสริมที่จำเป็นในโค้ดมีดังนี้

<link rel="canonical" href="http://www.example.com/page-1">

คุณจำเป็นต้องใส่แท็ก rel="canonical" ข้างต้นนี้ใน URL อุปกรณ์เคลื่อนที่ซึ่งชี้ไปยังหน้ารุ่นเดสก์ท็อป

ข้อมูลเสริมในแผนผังไซต์

เรารองรับการใส่คำอธิบายประกอบ rel="alternate" สำหรับหน้ารุ่นเดสก์ท็อปในแผนผังไซต์ดังตัวอย่างต่อไปนี้

<?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>

คุณควรเพิ่มแท็ก rel="canonical" ที่จำเป็นใน URL อุปกรณ์เคลื่อนที่ไปยัง HTML ของหน้าในอุปกรณ์เคลื่อนที่อยู่ต่อไป

คำอธิบายประกอบอย่างละเอียด

โปรดสังเกตแอตทริบิวต์ของแท็กลิงก์ในหน้ารุ่นเดสก์ท็อปดังนี้

  • แอตทริบิวต์ rel="alternate" จะส่งสัญญาณแจ้งว่าแท็กนี้ระบุ URL ทางเลือกของหน้ารุ่นเดสก์ท็อป
  • ค่าของแอตทริบิวต์สื่อคือสตริงคำค้นหาสื่อ CSS ที่ระบุฟีเจอร์สื่อที่อธิบายว่าเมื่อใดที่ Google ควรใช้ URL ทางเลือก ในกรณีนี้เรากำลังใช้คำค้นหาสื่อที่โดยทั่วไปจะใช้เพื่อกำหนดเป้าหมายอุปกรณ์เคลื่อนที่
  • แอตทริบิวต์ href ระบุที่ตั้งของ URL ทางเลือก ซึ่งก็คือหน้าเว็บที่ m.example.com

คำอธิบายประกอบแบบ 2 ทาง ("2 ทิศทาง") นี้ช่วยให้ Googlebot ค้นพบเนื้อหาของคุณและช่วยให้อัลกอริทึมของเราเข้าใจความสัมพันธ์ระหว่างหน้ารุ่นเดสก์ท็อปและหน้ารุ่นอุปกรณ์เคลื่อนที่และดำเนินการกับหน้าทั้งสองตามนั้น เมื่อคุณใช้ URL ที่แตกต่างกันเพื่อแสดงเนื้อหาเดียวกันในรูปแบบที่ต่างกัน คำอธิบายประกอบจะบอกอัลกอริทึมของ Google ว่า URL ทั้งสองนั้นมีเนื้อหาเทียบเท่ากันและควรดำเนินการในแบบเอนทิตีเดียว แทนที่จะเป็น 2 เอนทิตี หากมีการดำเนินการกับหน้ารุ่นเดสก์ท็อปและรุ่นอุปกรณ์เคลื่อนเป็นแบบคนละเอนทิตีกัน ทั้ง URL ของเดสก์ท็อปและ URL ของอุปกรณ์เคลื่อนที่จะแสดงบนผลการค้นหาในเดสก์ท็อปได้ และอาจมีอันดับต่ำกว่าในกรณีที่ Google เข้าใจความสัมพันธ์ของทั้งคู่ ต่อไปนี้คือข้อผิดพลาดที่พบบ่อยในการกำหนดค่าแบบนี้

  • เมื่อใช้มาร์กอัป rel="alternate" และ rel="canonical" ให้คงอัตราส่วน 1 ต่อ 1 ระหว่างหน้ารุ่นอุปกรณ์เคลื่อนที่และหน้ารุ่นเดสก์ท็อปที่ตรงกันไว้ โดยเฉพาะอย่างยิ่ง ให้หลีกเลี่ยงการใส่ข้อมูลเสริมในหน้ารุ่นเดสก์ท็อปหลายหน้าที่อ้างถึงหน้ารุ่นอุปกรณ์เคลื่อนที่หน้าเดียว (หรือในทางกลับกัน)
  • ตรวจสอบการเปลี่ยนเส้นทางอย่างละเอียดรอบคอบ โดยดูว่าหน้ารุ่นเดสก์ท็อปไม่ได้เปลี่ยนเส้นทางไปยังหน้ารุ่นอุปกรณ์เคลื่อนที่หน้าเดียวที่ไม่เกี่ยวข้องโดยไม่ได้ตั้งใจ
หากคุณเลือกที่จะพัฒนาเว็บไซต์รุ่นอุปกรณ์เคลื่อนที่ขึ้นต่างหาก ให้ระวังข้อผิดพลาดทั่วไป เช่น การกำหนดค่าการเปลี่ยนเส้นทางที่ผิดพลาดสำหรับผู้ใช้อุปกรณ์เคลื่อนที่

การเปลี่ยนเส้นทางอัตโนมัติ

เมื่อกำหนดค่าเว็บไซต์ให้แสดงผลในเบราว์เซอร์บนเดสก์ท็อปและอุปกรณ์เคลื่อนที่โดยใช้ URL ที่แตกต่างกัน ผู้ดูแลเว็บอาจต้องการเปลี่ยนเส้นทางผู้ใช้ไปยัง URL ที่แสดงผลได้ดีที่สุดโดยอัตโนมัติ หากเว็บไซต์ใช้การเปลี่ยนเส้นทางอัตโนมัติ ให้ตรวจสอบว่าได้ดำเนินการกับ Googlebot ทั้งหมดเหมือนกับ User Agent อื่นๆ และเปลี่ยนเส้นทางให้เหมาะสม

เทคนิคการเปลี่ยนเส้นทางที่รองรับ

Googlebot รองรับการใช้งานการเปลี่ยนเส้นทาง 2 แบบต่อไปนี้

  • การเปลี่ยนเส้นทางด้วย HTTP
  • การเปลี่ยนเส้นทางด้วย JavaScript

ใช้การเปลี่ยนเส้นทางด้วย HTTP

การเปลี่ยนเส้นทางด้วย HTTP เป็นวิธีที่นิยมใช้ในการเปลี่ยนเส้นทางไคลเอ็นต์ไปยัง URL เฉพาะอุปกรณ์ โดยปกติแล้วการเปลี่ยนเส้นทางจะยึดตาม User Agent ในส่วนหัวของคำขอ HTTP สิ่งสำคัญคือต้องให้การเปลี่ยนเส้นทางสอดคล้องกับ URL ทางเลือกที่ระบุในแท็กลิงก์ rel="alternate" ของหน้าเว็บหรือในแผนผังไซต์

เพื่อให้เป็นไปตามจุดประสงค์นี้ เซิร์ฟเวอร์จะเปลี่ยนเส้นทางด้วยรหัสสถานะ HTTP 301 หรือ 302 ก็ได้ แต่ขอแนะนำให้ใช้ 302 เมื่อใดก็ตามที่เป็นไปได้

การเปลี่ยนเส้นทางด้วย JavaScript

หากการเปลี่ยนเส้นทางด้วย HTTP ทำได้ยาก คุณจะใช้ JavaScript เพื่อเปลี่ยนเส้นทางผู้ใช้ไปยัง URL ที่แท็ก link rel="alternate" ชี้ไปได้ หากคุณเลือกใช้เทคนิคนี้ โปรดระวังเรื่องเวลาในการตอบสนองที่เกิดจากฝั่งไคลเอ็นต์ของการเปลี่ยนเส้นทาง เนื่องจากมีความจำเป็นต้องดาวน์โหลดหน้าเว็บก่อน จากนั้นจึงแยกวิเคราะห์และเรียกใช้ JavaScript ก่อนที่จะทริกเกอร์การเปลี่ยนเส้นทาง

การเปลี่ยนเส้นทางด้วย JavaScript ทำได้หลายวิธี ตัวอย่างเช่น คุณใช้ JavaScript เพื่อเรียกใช้คำค้นหาสื่อที่เว็บไซต์ของคุณใช้อยู่แล้วในคำอธิบายประกอบลิงก์บนหน้าเว็บได้โดยใช้ฟังก์ชัน matchMedia() ของ JavaScript

การเปลี่ยนเส้นทางแบบ 5 ทิศทางกับแบบทิศทางเดียว

เว็บไซต์ต่างๆ ใช้นโยบายการเปลี่ยนเส้นทางที่แตกต่างกัน บางเว็บไซต์เพียงแต่เปลี่ยนเส้นทางผู้ใช้อุปกรณ์เคลื่อนที่ที่เข้าชมหน้ารุ่นเดสก์ท็อปไปยังหน้ารุ่นอุปกรณ์เคลื่อนที่ (เปลี่ยนเส้นทางแบบ "ทิศทางเดียว") และบางเว็บไซต์เปลี่ยนเส้นทางทั้งผู้ใช้อุปกรณ์เคลื่อนที่และผู้ใช้เดสก์ท็อป หากผู้ใช้ไปที่หน้าในเว็บไซต์รุ่นเดสก์ท็อปและเว็บไซต์รุ่นอุปกรณ์เคลื่อนที่ตามลำดับ (เปลี่ยนเส้นทางแบบ "2 ทิศทาง")

สำหรับ Googlebot เราไม่ได้ต้องการให้ใช้การเปลี่ยนเส้นทางแบบใดเป็นพิเศษ และขอแนะนำให้ผู้ดูแลเว็บคำนึงถึงผู้ใช้เมื่อตัดสินใจเกี่ยวกับนโยบายการเปลี่ยนเส้นทาง สิ่งที่สำคัญที่สุดคือการเปลี่ยนเส้นทางที่ถูกต้องและสอดคล้องกัน กล่าวคือ เปลี่ยนเส้นทางไปยังเนื้อหาที่เทียบเท่าในเว็บไซต์รุ่นเดสก์ท็อปหรือเว็บไซต์รุ่นอุปกรณ์เคลื่อนที่ หากคุณกำหนดค่าผิด ผู้ใช้บางส่วนอาจไม่เห็นเนื้อหาของคุณเลย

นอกจากนี้ ขอแนะนำให้คุณมีวิธีการที่ผู้ใช้จะลบล้างนโยบายการเปลี่ยนเส้นทางได้ กล่าวคือ อนุญาตให้ผู้ใช้อุปกรณ์เคลื่อนที่ดูหน้ารุ่นเดสก์ท็อป และอนุญาตให้ผู้ใช้เดสก์ท็อปดูหน้ารุ่นอุปกรณ์เคลื่อนที่ หากเขาต้องการ