ออกแบบเว็บไซต์ที่ขับเคลื่อนด้วย AJAX เพื่อให้เข้าถึงได้ง่าย

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

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

การออกแบบเพื่อการช่วยเหลือพิเศษ

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

หลีกเลี่ยง iframe หรือลิงก์ไปยังเนื้อหาแยกต่างหาก

เนื้อหาที่แสดงผ่าน iframe อาจไม่ได้รับการจัดทำดัชนีและไม่ปรากฏในผลการค้นหาของ Google เราขอแนะนำให้คุณหลีกเลี่ยงการใช้ iframe ในการแสดงเนื้อหา หากใช้ iframe คุณจะต้องระบุลิงก์ที่ใช้ข้อความเพิ่มเติมไปยังเนื้อหาที่แสดง เพื่อให้ Googlebot รวบรวมข้อมูลและจัดทำดัชนีของเนื้อหานี้ได้

พัฒนาด้วยการเพิ่มประสิทธิภาพแบบต่อเนื่อง

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

โดยปกติคุณจะมีลิงก์ที่ต้องใช้ JavaScript สำหรับการใช้งาน AJAX Jeremy Keith นักพัฒนาเว็บเรียกเทคนิคนี้ว่า Hijax ซึ่งเป็นวิธีที่ช่วยให้ AJAX และลิงก์แบบคงที่อยู่ร่วมกัน

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

<a href="ajax.htm?foo=32" onClick="navigate('ajax.html#foo=32');
 return false">foo 32</a>

โปรดทราบว่า URL ของลิงก์แบบคงที่จะมีพารามิเตอร์ (?foo=32) แทนส่วนย่อย (#foo=32) ซึ่งโค้ด AJAX ใช้ นี่คือสิ่งสำคัญเนื่องจากเครื่องมือค้นหานั้นเข้าใจพารามิเตอร์ของ URL แต่มักละเว้นส่วนย่อย เมื่อคุณนำเสนอลิงก์แบบคงที่ ผู้ใช้และเครื่องมือค้นหาสามารถเชื่อมโยงกับเนื้อหาที่ต้องการใช้งานร่วมกันหรืออ้างอิงได้

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

ปฏิบัติตามหลักเกณฑ์

นอกจากเคล็ดลับต่างๆ ที่ได้กล่าวถึงในที่นี้แล้ว เราขอแนะนำให้คุณอ่านหลักเกณฑ์สำหรับผู้ดูแลเว็บเพื่อดูข้อมูลเพิ่มเติมเกี่ยวกับสิ่งที่ทำให้เว็บไซต์ทำงานได้ดีสำหรับ Google และผู้ใช้ หลักเกณฑ์เหล่านี้ยังชี้แนะสิ่งที่ควรหลีกเลี่ยง ซึ่งรวมถึงการแอบเปลี่ยนเส้นทาง JavaScript กฎทั่วไปในการปฏิบัติคือ แม้ว่าคุณจะมอบประสบการณ์ที่แตกต่างแก่ผู้ใช้ได้ตามความสามารถในการใช้งาน แต่เนื้อหาควรจะเหมือนเดิม ตัวอย่างเช่น ลองจินตนาการว่าเราได้สร้างหน้าเว็บสำหรับ Wysz's Hamster Farm ด้านบนของหน้าเว็บจะมีส่วนหัว "Wysz's Hamster Farm" และด้านล่างเป็นสไลด์โชว์ที่ใช้ AJAX ซึ่งแสดงหนูแฮมสเตอร์ที่เป็นสมาชิกใหม่ การปิดใช้ JavaScript ในหน้าเดียวกันไม่ควรทำให้ผู้ใช้แปลกใจกับข้อความเพิ่มเติมต่อไปนี้

Wysz's Hamster Farm -- แฮมสเตอร์ แฮมสเตอร์ที่ดีที่สุด แฮมสเตอร์ราคาถูก แฮมสเตอร์ฟรี สัตว์เลี้ยง ฟาร์ม เจ้าของฟาร์มแฮมสเตอร์ แฮมสเตอร์เต้นระบำ สัตว์ฟันแทะ แฮมพ์สเตอร์ แฮมเซอร์ แหล่งแฮมสเตอร์ที่ดีที่สุด ของเล่นสัตว์เลี้ยง ชั้นเรียนการเต้น น่ารัก กลเม็ดสำหรับแฮมสเตอร์ อาหารสัตว์ ที่อยู่อาศัยของแฮมสเตอร์ โรงแรมแฮมสเตอร์ ไอเดียของขวัญวันเกิดแฮมสเตอร์ และอีกมากมาย

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