ตรวจสอบว่าเว็บไซต์พร้อมใช้งานและใช้งานได้สำหรับทุกคนในช่วงสถานการณ์โควิด-19

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

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

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

คำแนะนำ

ความพร้อมใช้งาน ความน่าเชื่อถือ ความยืดหยุ่น และความเสถียร

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

  • อ่านแก้ไขเซิร์ฟเวอร์ที่ทำงานหนักเกินไปเพื่อดูวิธีตรวจหา บรรเทา และป้องกันปัญหาการเข้าชมที่เพิ่มขึ้นอย่างรวดเร็ว
  • นำรูปภาพ วิดีโอ สคริปต์ และแบบอักษรที่ไม่จำเป็นออก ตรวจสอบว่าแต่ละหน้ามุ่งเน้นที่การนำเสนอฟังก์ชันการทำงานที่ผู้ใช้เว็บไซต์ต้องการจริงๆ เท่านั้น
  • การเพิ่มประสิทธิภาพรูปภาพอาจช่วยลดการใช้แบนด์วิดท์ของเซิร์ฟเวอร์ได้อย่างมาก เนื่องจากรูปภาพเป็นสาเหตุอันดับหนึ่งที่ทำให้เว็บมีขนาดใหญ่เกินไป
  • ถ่ายโอนเนื้อหาแบบคงที่ไปยัง CDN ให้มากที่สุด ดูรายละเอียดเพิ่มเติมจากผู้ให้บริการทั่วไป ได้แก่ AWS, Azure, Cloudflare, Google Cloud, Firebase
  • ตรวจสอบว่า CDN มีการเพิ่มประสิทธิภาพที่เปิดใช้งานได้ง่ายหรือไม่ เช่น การบีบอัดรูปภาพแบบไดนามิก การบีบอัดข้อความ หรือการลดขนาดทรัพยากร JS และ CSS โดยอัตโนมัติ
  • การเพิ่มประสิทธิภาพการแคช HTTP ช่วยลดความต้องการในเซิร์ฟเวอร์ได้อย่างมากโดยมีการเปลี่ยนแปลงโค้ดเพียงเล็กน้อย ดูภาพรวมได้ที่แคช HTTP: แนวป้องกันแรกของคุณ และดูคำแนะนำที่เจาะจงได้ที่การแคช HTTP และแนวทางปฏิบัติแนะนำสำหรับการแคช การตรวจสอบแสดงเนื้อหาแบบคงที่ด้วยนโยบายแคชที่มีประสิทธิภาพใน Lighthouse จะช่วยให้คุณตรวจหาทรัพยากรที่ไม่ได้แคชได้อย่างรวดเร็ว โปรดทราบว่าทรัพยากรประเภทต่างๆ จะมีข้อกำหนดด้านความใหม่ที่แตกต่างกัน จึงต้องใช้กลยุทธ์การแคชที่แตกต่างกัน
  • Service Worker เป็นอีกวิธีหนึ่งที่ช่วยลดความต้องการในเซิร์ฟเวอร์ได้อย่างมาก แต่อาจต้องใช้การลงทุนทางเทคนิคที่สำคัญ นอกจากนี้ยังช่วยให้เว็บไซต์ทำงานแบบออฟไลน์ได้ด้วย ซึ่งจะช่วยให้คุณแสดงเวลาทำการ หมายเลขโทรศัพท์ และข้อมูลอื่นๆ แก่ผู้ใช้ที่กลับมาเข้าชมได้โดยไม่ต้องเชื่อมต่ออินเทอร์เน็ต Workbox เป็นแนวทางที่แนะนำสำหรับการเพิ่ม Service Worker ลงในเว็บไซต์ เนื่องจากจะช่วยสร้างโค้ดสำเร็จรูปจำนวนมากโดยอัตโนมัติ ทำให้ปฏิบัติตามแนวทางปฏิบัติแนะนำได้ง่ายขึ้น และป้องกันข้อบกพร่องเล็กๆ น้อยๆ ที่มักเกิดขึ้นเมื่อใช้ ServiceWorker API ระดับต่ำโดยตรง
  • หากเว็บไซต์มีการใช้งานเพิ่มขึ้นอย่างมาก ให้ตรวจสอบว่าคุณมีการป้องกันการโจมตีแบบ DDoS ที่เพียงพอหรือไม่ เนื่องจากเว็บไซต์ของคุณอาจเป็นเป้าหมายที่น่าสนใจมากขึ้นในตอนนี้ ดูรายละเอียดเพิ่มเติมจากผู้ให้บริการทั่วไป ได้แก่ AWS, Azure, Cloudflare, Google Cloud

ดูคำแนะนำเพิ่มเติมได้ที่ความน่าเชื่อถือของเครือข่าย

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

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

  • การช่วยเหลือพิเศษเป็นความพยายามของทีมและทุกคนมีบทบาทที่ต้องทำ เริ่มต้นด้วยการอ่านคู่มือการช่วยเหลือพิเศษสำหรับทีมของ Google รวมถึงคู่มือทีมจาก U.S. Digital Service คู่มือเหล่านี้จะอธิบายสิ่งที่สมาชิกแต่ละคนในทีม (ผู้จัดการผลิตภัณฑ์ วิศวกร นักออกแบบ QA และอื่นๆ) สามารถมีส่วนร่วมได้
  • ทำการตรวจสอบการช่วยเหลือพิเศษเพื่อพิจารณาว่าสิ่งใดได้ผลดีและสิ่งที่ควรปรับปรุง ส่วนขยายเบราว์เซอร์ WAVE จะช่วยแนะนำคุณตลอดการตรวจสอบการช่วยเหลือพิเศษของเว็บไซต์ด้วยตนเอง
  • อ่านคู่มือการช่วยเหลือพิเศษเพื่อทำความเข้าใจหัวข้อที่เฉพาะเจาะจงได้ดียิ่งขึ้น เช่น การไปยังส่วนต่างๆ ด้วยแป้นพิมพ์และการรองรับโปรแกรมอ่านหน้าจอ
  • เรียกใช้การตรวจสอบ Lighthouse เพื่อตรวจหาปัญหาการช่วยเหลือพิเศษที่พบได้ทั่วไป นอกจากนี้ รายงานยังแสดงรายการการตรวจสอบด้วยตนเองที่คุณทำได้เพื่อปรับปรุงความสามารถในการทำงานของเว็บไซต์ โปรดทราบว่าคะแนนการช่วยเหลือพิเศษ 100 คะแนนไม่ได้เป็นการรับประกันว่าเว็บไซต์ของคุณจะเข้าถึงได้ มีปัญหาสำคัญหลายอย่างที่ Lighthouse ไม่สามารถทดสอบแบบอัตโนมัติได้ ดังนั้นการตรวจสอบด้วยตนเองจึงยังคงมีความสำคัญ เครื่องมือตรวจสอบอัตโนมัติอื่นๆ ได้แก่ WAVE API และส่วนขยาย AXE
  • เรียนหลักสูตร Start Building Accessible Web Applications Today ใน egghead.io หรือดูหลักสูตร Web Accessibility ใน Udacity
  • ดูเพลย์ลิสต์ A11ycast เพื่อดูเคล็ดลับสั้นๆ เพิ่มเติมเกี่ยวกับหัวข้อการช่วยเหลือพิเศษที่เฉพาะเจาะจง

ข้อมูลประจำตัว ความปลอดภัย และความเป็นส่วนตัว

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

ดูคำแนะนำเพิ่มเติมได้ที่ปลอดภัย

ความสามารถในการใช้งาน, UI และ UX

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

  • ลองเพิ่มแบนเนอร์ที่โดดเด่น (ซึ่งนำออกได้ด้วยปุ่ม X) ไว้ที่ด้านบนของเว็บไซต์เพื่อสื่อสารข้อมูลอัปเดตเกี่ยวกับบริการอย่างชัดเจน ใช้คำกระตุ้นให้ดำเนินการ (Call-To-Action) ในแบนเนอร์เพื่อนำผู้ใช้ไปยังแหล่งข้อมูลที่เฉพาะเจาะจงมากขึ้น ลองใช้สีและแบบอักษรที่แตกต่างกันซึ่งโดดเด่นจากเนื้อหาอื่นๆ ในหน้าเว็บ เขียนด้วยความเห็นอกเห็นใจ มุ่งเน้นที่ความต้องการของผู้ใช้ และโปร่งใสเกี่ยวกับประเภทบริการที่คาดหวังได้
  • มองหาโอกาสในการลดการโต้ตอบทางกายภาพในเส้นทางสำคัญของผู้ใช้ (CUJ) และแนะนำการเปลี่ยนแปลงเหล่านั้นแก่ทีมผลิตภัณฑ์ ตัวอย่างเช่น หากบริการจัดส่งของคุณมักต้องมีการเซ็นชื่อรับพัสดุ ให้ดูว่ามีวิธีอื่นที่ใช้แทนได้หรือไม่
  • ตรวจสอบอีกครั้งว่า CUJ ของคุณเรียบง่ายและใช้งานง่ายที่สุดเท่าที่จะเป็นไปได้ และแนะนำการเปลี่ยนแปลงแก่ทีมผลิตภัณฑ์หากคุณเห็นโอกาสในการปรับปรุง
  • อ่านหลักการออกแบบที่ดีสำหรับอุปกรณ์เคลื่อนที่ และลองใช้ CUJ ในอุปกรณ์เคลื่อนที่ต่างๆ เพื่อให้แน่ใจว่าไม่มีปัญหาที่เห็นได้ชัด ผู้ที่ไม่ค่อยได้ใช้เว็บและพบว่าตนเองต้องพึ่งพาเว็บมากขึ้นอย่างกะทันหันอาจเข้าถึงเว็บไซต์ของคุณจากอุปกรณ์เคลื่อนที่
  • เปลี่ยนโครงสร้างเว็บไซต์เพื่อใช้รูปแบบการออกแบบที่ปรับเปลี่ยนตามอุปกรณ์ให้มากที่สุด
  • ตรวจสอบว่าแบบฟอร์มของคุณมีประสิทธิภาพและออกแบบมาอย่างดี

SEO

ผู้คนกำลังมองหาข้อมูลสำคัญเกี่ยวกับสุขภาพและงาน สิ่งสำคัญคือต้องตรวจสอบว่าเครื่องมือค้นหาทั้งหมดค้นพบเว็บไซต์ของคุณได้ การตรวจสอบ SEO ของ Lighthouse ช่วยให้คุณตรวจหาปัญหาพื้นฐานได้ ติดตามบล็อกอย่างเป็นทางการของเครื่องมือค้นหาเพื่อดูคำแนะนำและการอัปเดตล่าสุด ได้แก่ Google, Bing, Baidu, DuckDuckGo, Yandex โพสต์ล่าสุดที่เกี่ยวข้องกับโควิด-19

ดูคำแนะนำเพิ่มเติมได้ที่ค้นพบได้

ประสิทธิภาพ

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

  • รูปภาพเป็นสาเหตุอันดับหนึ่งที่ทำให้เว็บมีขนาดใหญ่เกินไป คุณอาจลดการใช้แบนด์วิดท์ของเว็บไซต์ได้อย่างมากด้วยการเพิ่มประสิทธิภาพรูปภาพ Squoosh เป็นเครื่องมือบีบอัดรูปภาพแบบโอเพนซอร์สที่ใช้งานง่ายซึ่งช่วยให้คุณบีบอัดรูปภาพได้อย่างรวดเร็ว
  • เรียกใช้ WebPageTest หรือ Lighthouse เพื่อค้นหาโอกาสในการปรับปรุงประสิทธิภาพที่สำคัญที่สุด
  • เปิดใช้การบีบอัดข้อความเพื่อลดขนาดเครือข่ายของทรัพยากรข้อความ ซึ่งมักเป็นวิธีที่ง่ายในการเพิ่มประสิทธิภาพโดยใช้ทรัพยากรทางเทคนิคเพียงเล็กน้อย
  • อ่านการแก้ไขความเร็วของเว็บไซต์แบบข้ามสายงานเพื่อดูวิธีทำงานร่วมกันและได้รับการสนับสนุนจากแผนกอื่นๆ
  • ใช้การโหลดแบบ Lazy Loading ที่ได้มาตรฐานสำหรับรูปภาพเพื่อลดคำขอรูปภาพที่ผู้ใช้อาจไม่เคยเห็นจริงๆ ความเข้ากันได้ของเบราว์เซอร์ไม่เต็ม 100% แต่ฟีเจอร์นี้ถือเป็นการเพิ่มประสิทธิภาพแบบต่อเนื่องได้ กล่าวคือ หากเบราว์เซอร์บางเบราว์เซอร์ไม่รองรับการโหลดแบบ Lazy Loading ที่เป็นมาตรฐาน รูปภาพควรโหลดตามปกติ
  • ตรวจสอบว่าเว็บไซต์ของคุณมีสคริปต์การทดสอบ A/B หรือการปรับเปลี่ยนในแบบของคุณที่สามารถโหลดแบบอะซิงโครนัสมากขึ้นหรือไม่ หรือมีฟังก์ชันการทำงานที่ไม่สำคัญในสคริปต์ที่สามารถปิดใช้ได้หรือไม่ โดยปกติแล้ว สคริปต์การทดสอบ A/B และการปรับเปลี่ยนในแบบของคุณจะโหลดแบบอะซิงโครนัสโดยสมบูรณ์ไม่ได้ เนื่องจากต้องทำงานก่อนที่เนื้อหาของหน้าเว็บจะโหลด แต่ก็อาจมีโอกาสโหลดบางส่วนของสคริปต์แบบอะซิงโครนัสมากขึ้น ดูเส้นทางการแสดงผลที่สำคัญเพื่อทำความเข้าใจข้อดีข้อเสียพื้นฐานระหว่างสคริปต์แบบซิงโครนัส (หรือที่เรียกว่าสคริปต์ที่บล็อกการแสดงผล) โดยทั่วไปกับเวลาในการโหลดหน้าเว็บ จากนั้นตัดสินใจว่าคุณต้องให้ความสำคัญกับสคริปต์ที่บล็อกการแสดงผลมากกว่าเวลาในการโหลดหน้าเว็บหรือไม่ หรือในทางกลับกัน
  • โค้ดของบุคคลที่สามคิดเป็นประมาณครึ่งหนึ่งของคำขอทั้งหมดสำหรับเว็บไซต์ส่วนใหญ่ ลองเพิ่มประสิทธิภาพหรือนำโค้ดของบุคคลที่สามที่ไม่จำเป็นต่อการทำงานของเว็บไซต์ออกหรือปิดใช้ชั่วคราว
  • หากการเปิดตัวฟีเจอร์ถูกลดลำดับความสำคัญลง ช่วงเวลานี้อาจเป็นเวลาที่เหมาะสำหรับการล้างข้อมูล นำแท็กออกจาก Tag Manager ล้าง CSS และ JS ที่ไม่จำเป็น และนำฟีเจอร์หรือโค้ดที่เลิกใช้งานแล้วออก แท็บความครอบคลุมในเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome และคลาส Coverage ใน Puppeteer จะช่วยคุณตรวจหาโค้ดที่ไม่ได้ใช้ได้

ดูคำแนะนำเพิ่มเติมได้ที่เวลาในการโหลดที่รวดเร็ว