ความท้าทายของ PWA SEO: อะไรที่ทำให้ไซต์ PWA ของคุณไม่สามารถจัดอันดับได้?

เผยแพร่แล้ว: 2022-08-24

สารบัญ

ด้วยความเร็วที่เร็วขึ้น & UI & UX ที่ดีขึ้น PWA สามารถเพิ่ม Google Core Web Vitals ของคุณ ดังนั้นจึงช่วยปรับปรุง SEO ของคุณ บล็อกและข่าวเทคโนโลยีจำนวนมาก (รวมถึง SimiCart) ได้อ้างสิทธิ์ในสิ่งนี้

อย่างไรก็ตาม นี่ไม่ใช่ภาพรวมทั้งหมด ในความเป็นจริง ในบางกรณี กปภ. อาจส่งผลเสียต่อ SEO ของเว็บไซต์ของคุณ

กว่า 10 ปีของการพัฒนาเว็บไซต์ กปภ. เราพบหลายกรณีที่ประสิทธิภาพ SEO นั้นได้รับผลกระทบจาก PWA

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

ปัญหาหลักของ กปภ. SEO

กลับไปที่ความรู้พื้นฐานในการพัฒนาเว็บไซต์: HTML & Javascript เราพนันได้เลยว่าแม้ว่าคุณจะไม่เชี่ยวชาญด้านเทคโนโลยีเลย แต่คุณเคยได้ยินภาษาเขียนโค้ดสองภาษานี้มาก่อน

กล่าวโดยย่อ HTML เป็นภาษาเขียนโค้ดที่ง่ายที่สุด ซึ่งใช้สำหรับสร้างโครงสร้างเว็บไซต์

ในขณะเดียวกัน Javascript นั้นล้ำหน้ากว่าซึ่งมีหน้าที่ในเอฟเฟกต์พิเศษเพิ่มเติม

ดังนั้น หากคุณเห็นหน้าเว็บที่มีเนื้อหาไดนามิกจำนวนมาก เอฟเฟกต์การเลื่อนแบบแฟนซี หรือตัวเลื่อนสุดเจ๋ง แสดงว่าหน้าเว็บนั้นใช้ Javascript ได้อย่างเหมาะสม

html กับ javascript

(เครดิต: Reddit)

PWA ซึ่งมีชื่อเสียงในด้านประสบการณ์ UI/UX ที่มีชีวิตชีวา อย่างที่คุณอาจเดาได้ ว่าใช้ Javascript เป็นจำนวนมาก

นี่คือปัญหา: Google และเครื่องมือค้นหาอื่น ๆ ไม่ได้แสดงเว็บไซต์ Javascript เป็นอย่างดี เว็บไซต์ที่ใช้ Javascript มักจะซับซ้อนและหนักกว่าในการประมวลผลมากกว่าเว็บไซต์ HTML อันที่จริง ไม่ใช่แค่เสิร์ชเอ็นจิ้น โซเชียลมีเดียอย่าง Twitter หรือ Facebook ก็ไม่ชอบ Javascript เหมือนกัน

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

จึงต้องอาศัยผู้เชี่ยวชาญที่เชี่ยวชาญที่เข้าใจ กปภ. อย่างลึกซึ้งเพื่อเพิ่มประสิทธิภาพเว็บไซต์ให้เป็นมิตรกับ SEO

6 อุปสรรคในการเพิ่มประสิทธิภาพ PWA สำหรับ SEO

1. ปัญหาด้านประสิทธิภาพ

“แต่ กปภ. ควรจะเร็วดีไหม?” - คุณอาจจะถาม

ได้ แต่ก็ไม่ได้หมายความว่าการประปาส่วนภูมิภาคไม่มีปัญหาด้านประสิทธิภาพบางประการ

ยังคงมีปัญหาเกี่ยวกับความเร็วที่ชัดเจนเกี่ยวกับการ กปภ. อย่างไรก็ตาม การประปาส่วนภูมิภาคสามารถทำได้อย่างรวดเร็วหากได้รับการปรับให้เหมาะสม

เช่นเดียวกับ Usain Bolt แม้ว่าเขาจะเกิดมาเป็นซุปเปอร์ดูเปอร์ แต่เขาไม่สามารถเป็นแชมป์ได้หากเขาไม่มีโค้ชที่เข้าใจความสามารถของเขาและฝึกฝนเขามาอย่างดี

มาดูรายละเอียดแต่ละประเด็นกันดีกว่า:

ปัญหา

ไฟล์ Javascript ใช้ทรัพยากรจำนวนมากสำหรับการแยกวิเคราะห์ รวบรวม และดำเนินการ นอกจากนี้ เนื่องจากประสิทธิภาพของเซิร์ฟเวอร์ไม่ดี บั๊กของเครื่องมือค้นหาจึงไม่สามารถแสดงไฟล์ Javascript ได้อย่างรวดเร็ว

ด้วยเหตุนี้ จึงอาจส่งผลต่อเมตริกความเร็วหน้าเว็บบางรายการ เช่น First Meaningful Paint & First Contentful Paint เนื่องจากเมตริกทั้งสองนี้เป็นปัจจัยในการจัดอันดับที่สำคัญ จึงไม่เป็นผลดีต่อ SEO นอกจากนี้ ไซต์ที่ล้าหลังก็ไม่อาจส่งผลดีต่อประสบการณ์ของผู้ใช้ได้เช่นกัน

ยิ่งไปกว่านั้น เนื่องจากพนักงานบริการของ PWA ต้องใช้ใบรับรอง HTTPS และ SSL จึงจะสามารถทำให้เว็บไซต์ของคุณทำงานช้ากว่าเวอร์ชัน HTTP ได้

โซลูชั่น

แนวทางปฏิบัติทั่วไปบางประการในการปรับปรุงความเร็วคือการนำ AMP (หน้าอุปกรณ์เคลื่อนที่แบบเร่ง) ไปใช้กับ PWA ตลอดจนการใช้ HTTP/2 กับ HTTP

เนื่องจาก PWA เป็นเทคโนโลยีขั้นสูงและเฉพาะในแนวอีคอมเมิร์ซ ควรมีนักพัฒนา PWA ที่มีประสบการณ์ปรับความเร็วไซต์ของคุณให้เหมาะสม

2. ข้อผิดพลาดของจาวาสคริปต์

ปัญหา

เมื่อแยกวิเคราะห์ เบราว์เซอร์เช่น Google Chrome สามารถแก้ไขไวยากรณ์ HTML ได้โดยอัตโนมัติ เช่น ปิดแท็ก อย่างไรก็ตาม สิ่งนี้ไม่เหมือนกับข้อผิดพลาดของ Javascript

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

โซลูชั่น

สิ่งสำคัญคือต้องให้นักพัฒนาเขียนโค้ด Javascript ที่สะอาดและมีโครงสร้างที่ดีสำหรับไซต์ของคุณ เพื่อหลีกเลี่ยงการแก้ไขที่ใช้เวลานานในภายหลัง

หากไซต์พบข้อผิดพลาด Javascript นักพัฒนาซอฟต์แวร์จะต้องทำความสะอาดด้วยตนเองและแจ้งเครื่องมือค้นหาหลังจากแก้ไขแล้ว

3. ไฮเปอร์ลิงก์/ รูปภาพไม่ได้รับการรวบรวมข้อมูลเนื่องจากเนื้อหาที่ปิดบัง

เนื้อหาที่ปิดบัง
(ภาพ: Sitechecker.com)

เนื้อหาการปิดบังเป็นสิ่งที่มนุษย์มองเห็น แต่ไม่ใช่โดยเครื่องมือค้นหา ตัวอย่างเช่น ข้อความที่ซ่อนอยู่หลังปุ่ม "แสดงเพิ่มเติม" หรือลิงก์เมนูโหลดแบบ Lazy Loading สิ่งเหล่านี้มักเป็นเนื้อหาและลิงก์แบบไดนามิกที่เขียนด้วย Javascript

ปัญหา

เนื่องจาก Google ยังมีปัญหาในการทำความเข้าใจ Javascript จึงอาจมีเนื้อหา Javascript ของ PWA ที่ Google จะไม่สามารถเข้าถึงได้

หากเนื้อหาของคุณ (เช่น ลิงก์สำคัญ รูปภาพผลิตภัณฑ์) ไม่ปรากฏแก่เครื่องมือค้นหา จะไม่สามารถจัดทำดัชนีได้ ซึ่งจะส่งผลเสียต่อการจัดอันดับ SEO ของคุณ

วิธีการแก้

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

4. ความเข้ากันได้ของโมดูล

ปัญหา

ในฐานะที่เป็นเทคโนโลยีที่ค่อนข้างใหม่ กปภ. มักจะใช้ประโยชน์จากโมดูลล่าสุด ซึ่งอาจขัดแย้งกับ Google หรือเบราว์เซอร์อื่นๆ ซึ่งมักใช้โมดูลที่ไม่ค่อยทันสมัย ตัวอย่างที่โดดเด่นของสิ่งนี้ ได้แก่ ES6, Fetch API หรือไวยากรณ์หรือวิธีการใหม่

วิธีการแก้

ก่อนดำเนินการ คุณควรตรวจสอบความเข้ากันได้ ไม่ใช่ปัญหาใหญ่หากบางโมดูลของ PWA ของคุณใช้งานไม่ได้กับ Googlebot เพราะมีเครื่องมือหรือโพลีฟิลสำหรับแก้ไขปัญหานี้

Polyfill คือโค้ดโค้ด Javascript บางบรรทัดที่อนุญาตให้เบราว์เซอร์รุ่นเก่าใช้คุณลักษณะที่ทันสมัย ​​แม้ว่าจะไม่สนับสนุนคุณลักษณะเหล่านั้นโดยกำเนิดก็ตาม

ขึ้นอยู่กับโมดูลที่ Googlebot ขัดแย้งด้วย อาจมีเครื่องมือ transpiling สำหรับโมดูลนั้นด้วย

สำหรับข้อมูลของคุณ transpiling (แปล + คอมไพล์) หมายถึงการแปลและแปลภาษาโปรแกรมหนึ่งเป็นอีกภาษาหนึ่ง ลองใช้โมดูล ES6 เป็นตัวอย่าง บริการต่างๆ เช่น Babel สามารถแปลงไฟล์ C6 Javascript ที่ทันสมัยไปเป็น ES5 ซึ่งช่วยให้เบราว์เซอร์รุ่นเก่าทำงานได้อย่างราบรื่น

5. ปัญหาเกี่ยวกับการแสดงผลฝั่งเซิร์ฟเวอร์

ในความพยายามที่จะแสดงเว็บไซต์ที่ใช้ Javascript ให้ดีขึ้น Googlebot ใช้ทั้งการแสดงผลฝั่งเซิร์ฟเวอร์และฝั่งไคลเอ็นต์

กล่าวโดยย่อ กระบวนการแสดงผลจะเป็นดังนี้:

  1. Googlebot รวบรวมข้อมูลเว็บไซต์ของคุณเพื่อค้นหาลิงก์และเนื้อหาเป็นครั้งแรก
  2. เซิร์ฟเวอร์จะแสดงลิงก์และเนื้อหาที่พบหลังจากการรวบรวมข้อมูลครั้งแรก ลิงก์และเนื้อหาเหล่านี้จะได้รับการจัดทำดัชนีหลังจากนั้นไม่นาน
  3. Google ยังคงรวบรวมข้อมูลเว็บไซต์เป็นครั้งที่สอง ครั้งที่สาม ฯลฯ
  4. จากนี้ไป ลิงก์และเนื้อหาที่เหลือจะแสดงผลโดยไคลเอ็นต์ ซึ่งหมายความว่าจะแสดงผลบนอุปกรณ์ของผู้ใช้ของคุณ
  5. หลังจากการแสดงผลเสร็จสิ้น Google จะจัดทำดัชนีหน้าเว็บของคุณ

ปัญหา

ในตอนแรก ขั้นตอนการแสดงผลของ Googlebot ดูเหมือนจะเป็นไปได้มาก แต่มีข้อเสียที่สำคัญบางประการ:

  • ความเร็วในการจัดทำดัชนีที่ ต่ำกว่า :

Google สามารถจัดทำดัชนีไฟล์ HTML ด้วยการแสดงผลฝั่งเซิร์ฟเวอร์ได้อย่างรวดเร็ว แต่อาจใช้เวลาหลายวันในการสร้างดัชนีไฟล์ Javascript ด้วยการแสดงผลฝั่งไคลเอ็นต์

  • จัดลำดับความสำคัญผิดหน้า :

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

อย่างไรก็ตาม สำหรับลิงก์ที่แทรกด้วย Javascript Google จำเป็นต้องรอให้การแสดงผลฝั่งไคลเอ็นต์เสร็จสิ้นก่อนจึงจะสามารถเริ่มสร้างดัชนีได้ กล่าวอีกนัยหนึ่ง Google สามารถประเมินโครงสร้างลิงก์ภายในของเว็บไซต์ได้อย่างสมบูรณ์หลังจากการแสดงผลฝั่งไคลเอ็นต์เสร็จสิ้นเท่านั้น

ด้วยเหตุนี้ ลิงก์ที่ไม่สำคัญบางลิงก์ที่ไม่ต้องการการแสดงผลฝั่งไคลเอ็นต์อาจถูกรวบรวมข้อมูลก่อนและบ่อยกว่านั้น ดังนั้น Google สามารถจัดลำดับความสำคัญของหน้าย่อยของคุณและละเว้นหน้าการขาย

  • ความขัดแย้งระหว่างการแสดงผลฝั่งเซิร์ฟเวอร์และการแสดงผลฝั่งไคลเอ็นต์:

มักมีปัญหาระหว่างการแสดงผลฝั่งเซิร์ฟเวอร์และการแสดงผลฝั่งไคลเอ็นต์ ตัวอย่างเช่น องค์ประกอบของหน้าที่สำคัญบางอย่าง (เมตาแท็ก, แท็กตามรูปแบบบัญญัติ) ไม่ได้รับการจัดทำดัชนี นอกจากนี้ ทั้งสองขั้นตอนอาจส่งสัญญาณผสมบางส่วนไปยัง Google ดังนั้นเครื่องมือค้นหาจึงไม่ทราบวิธีดำเนินการกับหน้าเว็บของคุณ

วิธีการแก้

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

เทคโนโลยีสมัยใหม่สามารถช่วยเราแก้ไขข้อขัดแย้งระหว่าง Javascript และเว็บเบราว์เซอร์ได้เช่นกัน ตัวอย่างเช่น เทคนิค isomorphic ช่วยให้เบราว์เซอร์แสดงไฟล์ Javascript ได้ง่ายขึ้น

6. ข้อผิดพลาดทั่วไปของ SEO

มีปัจจัยการจัดอันดับ SEO มากกว่า 200 ปัจจัย ซึ่งบางส่วนเป็นปัจจัยทางเทคนิคที่สำคัญ เช่น Canonical tags, rebot.txt เป็นต้น ด้วยเหตุนี้ ผู้ค้าอาจเพิกเฉยต่อการกำหนดค่าเหล่านี้ได้ง่าย ส่งผลให้ SEO ของเว็บไซต์ของตนเสียหาย

ก่อนที่จะแก้ไข PWA SEO คุณควรตรวจสอบให้แน่ใจว่าไซต์ปัจจุบันของคุณปฏิบัติตามแนวทางปฏิบัติ SEO ที่ดีที่สุด

>> ดูเพิ่มเติม: แนวทางปฏิบัติ Magento SEO ที่ดีที่สุด

มาถึงคำถามที่กวนใจที่สุด:

ฉันควรอัปเกรดเป็น กปภ. หรือไม่

… หากฉันไม่ต้องการทำร้าย SEO ของเว็บไซต์ฉัน

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

อย่างไรก็ตาม ความท้าทายเหล่านี้ไม่ได้หมายความว่าบ็อตของ Google ไม่สามารถรวบรวมข้อมูลไซต์ PWA และไม่ได้จัดอันดับไซต์ PWA ให้แตกต่างกันเนื่องจากภาษาในการเขียนโปรแกรม

เป็นเพียงว่าผู้ค้าจำเป็นต้องตระหนักถึงความท้าทายทางเทคนิคบางอย่างเมื่อใช้งานไซต์ PWA ที่เป็นมิตรกับ SEO

ในความเป็นจริง เว็บไซต์ กปภ. สามารถจัดอันดับได้ดีในเครื่องมือค้นหา หากไม่ดีกว่าเว็บไซต์อื่นที่ไม่ใช่ กปภ. ดังที่ได้กล่าวไว้ก่อนหน้านี้ เว็บแอปช่วยปรับปรุง Core Web Vitals ของ SEO

ดังนั้นในแง่ของ SEO PWA เป็นฮีโร่หรือศูนย์หรือไม่? ขึ้นอยู่กับว่านักพัฒนาของพวกเขาเข้าใจเทคโนโลยี กปภ. และการพัฒนาเว็บไซต์อย่างลึกซึ้งหรือไม่

ซื้อกลับบ้าน

PWA สามารถเป็นมีดสองคมสำหรับการจัดอันดับ SEO ของเว็บไซต์ของคุณ ในทางกลับกัน ความเร็วที่เพิ่มขึ้นและประสบการณ์ของลูกค้าสามารถช่วยเพิ่ม Web Vitals หลักของ SEO ได้ ด้านมืด PWA ที่มีเนื้อหา Javascript ที่หลากหลาย มีความซับซ้อนมากขึ้นสำหรับเครื่องมือค้นหาเช่น Google ดังนั้น การดำเนินการที่ไม่ดีโดยปราศจากความเข้าใจอย่างลึกซึ้งของ กปภ. อาจทำให้อันดับลดลงได้

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

เรามีเวลา 10 ปีในการสร้าง PWA แบบไม่มีหัวสำหรับ Magento