คุณไม่ต้องสงสัยเลยว่าเคยได้ยินเกี่ยวกับกระแสของเว็บบนอุปกรณ์เคลื่อนที่ สิ่งที่พบบ่อยที่สุดที่คุณอาจเคยได้ยินคือการเข้าถึงเว็บบนมือถือเพิ่มขึ้นอย่างรวดเร็วและประมาณครึ่งหนึ่งของการเข้าชมเว็บทั้งหมดมาจากโทรศัพท์หรือแท็บเล็ต ก 2018 เดือนกุมภาพันธ์รายงานจาก Pew Research Center โปรดทราบว่า 95% ของชาวอเมริกันทุกคนเป็นเจ้าของโทรศัพท์มือถือในขณะที่ส่วนแบ่งของชาวอเมริกันที่มีสมาร์ทโฟนคือ 77%
คุณไม่ต้องมองไปไกลเพื่อดูผลกระทบของมือถือ ดูพฤติกรรมของคุณเองและของคนในครอบครัว ในเดือนธันวาคม 2016 comScore รายงานว่าคนอเมริกันอายุมากกว่า 17 ปีใช้โทรศัพท์วันละ 51 ชั่วโมง XNUMX นาที (Englais)
Statcounter.com โปรดทราบว่าปริมาณการเข้าชมเว็บทั่วโลกส่วนใหญ่มาจากอุปกรณ์มือถือเป็นเวลาอย่างน้อยหนึ่งปี (51,95% ในเดือนกุมภาพันธ์ 2018)
ในขณะที่คุณอาจคิดว่าคุณไม่สามารถพัฒนาแอปเนทีฟสำหรับผู้ใช้มือถือของคุณเพื่อจัดเก็บบนโทรศัพท์ของพวกเขาได้ แต่ก็มีทางเลือกที่ยอดเยี่ยมสำหรับทุกธุรกิจนั่นคือ Progressive Web Applications บางทีคุณอาจเคยได้ยิน Progressive Web Applications (PWA) และวิธีที่ผู้คนใช้เพื่อขยายธุรกิจของตน ในบทความนี้คุณจะได้เรียนรู้เพิ่มเติมเกี่ยวกับ PWA และเหตุผลที่คุณควรพิจารณาเพิ่มเติมเกี่ยวกับการใช้งานในปี 2018
คำจำกัดความบางอย่าง
Progressive Web Applications (PWA) คือชุดของมาตรฐานเว็บที่พัฒนาโดย Google เพื่อปรับปรุงประสิทธิภาพเว็บไซต์บนอุปกรณ์เคลื่อนที่ ดังนั้นเว็บไซต์จึงทำงานคล้ายกับแอพมือถือเฉพาะที่คุณสามารถค้นหาได้ใน Apple App Store หรือ Google Play
อื่น คำนิยาม นักพัฒนาสำหรับเครือโรงแรม Treebo ของอินเดีย: “PWAs เป็นแอปพลิเคชั่นหน้าเดียวที่ได้รับการปรับปรุงเพิ่มเติมด้วยคุณสมบัติที่ให้ประสบการณ์ดั้งเดิมที่สมจริงยิ่งขึ้น »
การลดลงเล็กน้อย PWA บนอุปกรณ์เคลื่อนที่ช่วยให้ผู้อ่านและลูกค้าของคุณโหลดหน้าแรกของไซต์ของคุณได้อย่างรวดเร็วและใช้คุณลักษณะหลายอย่างในอุปกรณ์เคลื่อนที่ที่แอปเนทีฟจะใช้ ไซต์ของคุณอาจอยู่นอกเบราว์เซอร์แม้ว่าอุปกรณ์จะไม่ได้เชื่อมต่อกับอินเทอร์เน็ตก็ตาม
คำจำกัดความอื่น ๆ
ส่วนทางเทคนิคที่สำคัญบางส่วนของ PWA ได้แก่ :
พนักงานบริการ เป็นเทคโนโลยีหลักที่เกี่ยวข้องกับ PWA สิ่งเหล่านี้อนุญาตให้ PWA ทำงานนอกเครือข่าย
ไฟล์ Manifest มีไอคอนและชื่อที่เชื่อมโยงแอพบนอุปกรณ์กับ เว็บไซต์เว็บ. นักพัฒนายังสามารถเพิ่มองค์ประกอบการออกแบบที่นี่เพื่อยกระดับประสบการณ์ลูกค้าของคุณ
ผลักดันการแจ้งเตือน สื่อสารกับผู้ใช้ของคุณ (ได้รับอนุญาต) ดังนั้นพวกเขาจึงกลับมา
ด้วยเหตุผลบางประการ
เหตุใดไซต์ของคุณจึงควรมี PWA ค่อนข้างตรงไปตรงมา
ประสิทธิภาพที่ดีขึ้น - แม้กระทั่งบนเดสก์ท็อป!
คุณรู้ว่าคุณมีเวลาจำกัดในการชนะรางวัล ผู้มาเยือน เป็นครั้งแรก – หกวินาทีของการโหลดก่อนที่ผู้มีโอกาสเป็นลูกค้าจะออกไปและเยี่ยมชมไซต์ถัดไปจากผลการค้นหา ผู้ใช้มือถือยิ่งใจร้อนมากขึ้น – ครึ่งหนึ่งของผู้มีโอกาสเป็นผู้ใช้ของคุณจะออกไปหากไซต์ใช้เวลาโหลดมากกว่า 3 วินาที!
ข่าวดี: การเปลี่ยนแปลงที่คุณทำเพื่อสร้างแอปพลิเคชันเว็บแบบโปรเกรสซีฟจะทำให้ไซต์ของคุณเร็วขึ้น
ตัวอย่าง: Treebo บริษัท โรงแรมของอินเดียลดเวลาในการชาร์จมือถือจากหกวินาทีเหลือ 1,5 วินาทีด้วยการสร้าง PWA ตอนนี้ไซต์โหลดบนเดสก์ท็อปในไม่กี่วินาที! ทีมเทคโนโลยีของพวกเขารายงานว่าการจัดอันดับการค้นหาของไซต์ดีขึ้นและอัตราการแปลงรายเดือนเพิ่มขึ้นกว่าสองเท่า!
ความจุออฟไลน์
กปภ. ไม่จำเป็นต้องอยู่บนอินเทอร์เน็ตจึงจะทำได้ ผู้ใช้ของคุณสามารถเข้าถึงเนื้อหาทั้งหมดของแอปได้จากอุปกรณ์หรือเดสก์ท็อป
ในความเป็นจริงสิ่งที่ดีที่สุดอย่างหนึ่งเกี่ยวกับ PWA คือลูกค้าของคุณสามารถบันทึกไซต์ลงในโฮมเพจของอุปกรณ์และใช้ในภายหลังเพื่อซื้อผลิตภัณฑ์ของคุณหรือรับข้อมูลเพิ่มเติม .
ตัวอย่างเช่น, CNET Tech Today นำเสนอสรุปข่าวเกี่ยวกับเทคโนโลยีประจำวันซึ่งเป็นข้อมูลประจำวันของเว็บไซต์ หากคุณเปิดไซต์ด้วย Google Chrome บนอุปกรณ์ Android และเลื่อนลงไปที่ด้านล่างของหน้าจอคุณจะเห็นสิ่งนี้:
กด เพิ่มในหน้าจอหลัก เพื่อดาวน์โหลดแอปเว็บโปรเกรสซีฟ Tech Today ลงในอุปกรณ์ของคุณ แตะไอคอนเพื่อโหลดเรื่องราวปัจจุบัน 10 อันดับแรก ปัดไปทางซ้ายเพื่ออ่านแต่ละเรื่อง แตะโลโก้ CNET เพื่อเปิดโฮมเพจ CNET ในเบราว์เซอร์ของคุณ
Remarque : ใน Firefox ไซต์ที่มี PWA จะมีไอคอน "เพิ่มในหน้าแรก" (เครื่องหมายบวกในช่องเล็ก ๆ ) บนแถบที่อยู่โดยตรง หากติดตั้ง PWA แล้วโลโก้ Android บนแถบที่อยู่จะนำคุณไปที่ PWA
สิ่งหนึ่งที่ไซต์ของคุณไม่ต้องการ: วิดเจ็ต "ดาวน์โหลดแอปของเรา" ใช้พื้นที่บนหน้าเว็บของคุณ (โดยปกติจะมีโลโก้ iTunes และ Android ที่รบกวนผู้ใช้) หาก Chrome สังเกตเห็นว่าผู้ใช้เปิดไซต์ PWA ของคุณสัปดาห์ละหลายครั้งระบบจะแจ้งให้คุณเพิ่ม PWA ของคุณ การอัปเดตยังเป็นไปโดยอัตโนมัติ
ไม่จำเป็นต้องใช้ภาษาโปรแกรมที่ซับซ้อน
คุณอาจเคยพิจารณาสร้างแอพมือถือเนทีฟสำหรับธุรกิจของคุณ แต่พบว่าการสร้างแอพมือถือเป็นสัตว์ที่แตกต่างจากการสร้าง เว็บไซต์เว็บ. หากคุณกำลังทำงานร่วมกับหน่วยงานออกแบบ/พัฒนาเว็บไซต์เพื่อดูแลไซต์ของคุณ พวกเขาไม่จำเป็นต้องมีทักษะในการสร้างแอปสำหรับผู้จำหน่ายอุปกรณ์เคลื่อนที่กระแสหลัก
เพื่อให้ซอฟต์แวร์ของคุณปรากฏใน Apple App Store นักพัฒนาของคุณต้องลงทะเบียนกับ Apple Developer Network ใช้ Apple Developer Tool (ซึ่งใช้ได้เฉพาะบน Mac) และรู้ภาษาของ การเขียนโปรแกรมที่ได้รับการอนุมัติจาก Apple: Swift หรือ Objective C
การเขียนโปรแกรมสำหรับ Android นั้นง่ายกว่าเล็กน้อย (ไม่จำเป็นต้องมีการอนุมัติจากนักพัฒนา) แต่แอพ Android ส่วนใหญ่เขียนด้วย Java ซึ่งอาจเป็นภาษาที่ยากในการเรียนรู้
เพื่อให้แอปปรากฏในร้านค้าออนไลน์ของ Apple หรือ Android แอปที่สมบูรณ์จะต้องได้รับการอนุมัติจากผู้ดูแลของร้านค้านั้น ๆ
ในทางตรงกันข้ามเว็บแอปแบบโปรเกรสซีฟถูกสร้างขึ้นด้วยภาษาเว็บยอดนิยม ได้แก่ HTML, CSS (Cascading Style Sheets) และ JavaScript ในระยะสั้นแม้แต่นักพัฒนาเว็บระดับเริ่มต้นก็สามารถสร้าง PWA คุณภาพสูงได้
โดยเฉพาะคุณไม่จำเป็นต้องมีการศึกษาเกี่ยวกับคอมพิวเตอร์มากนักเพื่อทำ PWA สำหรับไซต์ WordPress ของคุณ หากคุณได้เปลี่ยนการจัดรูปแบบไซต์ของคุณโดยใช้ธีมลูกแล้วคุณยังสามารถสร้างไฟล์ PWA ได้ เราจะพูดถึงปัญหาการเข้ารหัสในบทความอื่น
เพิ่มการสนับสนุนของยักษ์ใหญ่ด้านเทคโนโลยี
มาตรฐานใช้เวลานานกว่าจะเป็นมาตรฐาน Google ส่งเสริม PWA ครั้งแรกในปี 2015
เป็นเวลานาน Chrome เป็นเบราว์เซอร์เดียวที่รองรับ PWA แต่กำลังจะเปลี่ยนไป ในช่วงไม่กี่เดือนที่ผ่านมา:
- Mozilla ได้เพิ่มการรองรับ PWA ใน Firefox 58
- Apple เพิ่งประกาศสนับสนุนเว็บแอปพลิเคชันใน iOS
- Microsoft จะสนับสนุน PWA ใน Windows 10 เวอร์ชั่นถัดไปซึ่งจะวางจำหน่ายในปลายปีนี้ (2018)
นอกเหนือจากผู้จำหน่ายระบบปฏิบัติการรายอื่นแล้ว Microsoft กล่าวว่า PWA“ คุณภาพสูง” จะรวมเข้ากับ Windows 10 app store บนโทรศัพท์มือถือและเดสก์ท็อปในไม่ช้า
WordPress และ PWAs
WordPress ยังไม่รองรับการสร้างเว็บแอปแบบโปรเกรสซีฟในแอปพื้นฐาน ทีม Jetpack มุ่งมั่นที่จะเพิ่มฟังก์ชันการทำงานของ PWA ในปีหน้า สิ่งนี้ได้รับความช่วยเหลือจาก Javascript-ification ของ WordPress
Jetpack "ค่อยๆเปิดตัวคุณสมบัติ PWA ทันทีที่พร้อม" นักพัฒนากล่าว Dan Walmsley ในบทความในบล็อก WordPress VIP . นักพัฒนาสามารถเพิ่มไฟล์ Manifest โดยใช้โมดูล Manifest ของ Jetpack ตั้งแต่เวอร์ชัน 5.6.0 และพวกเขาได้แนะนำการโหลดรูปภาพแบบโปรเกรสซีฟซึ่งทำให้การโหลดไซต์เร็วขึ้นแม้ว่าจะมีรูปภาพจำนวนมากอยู่ก็ตาม หน้า. คุณสมบัติอื่น ๆ จะมาในปีนี้
ปลั๊กอินบางตัวพยายามเพิ่มฟังก์ชันการทำงานของ PWA แต่ยังไม่ได้รับการนำมาใช้อย่างจริงจัง
- เครื่องมือเพิ่มประสิทธิภาพ WordPress เป็นเครื่องมือที่ใช้งานได้และแสดงรายการ
- Super Progressive Web Apps จะสร้างรายการและปุ่มเพิ่มในหน้าจอหลักรวมถึงคุณสมบัติอื่น ๆ
- WordPress Mobile Pack ยังเพิ่มคุณสมบัติ PWA
คุณจะใช้บริการกปภ. อย่างไร?
ในบทช่วยสอนนี้ คุณได้เรียนรู้เพียงเล็กน้อยเกี่ยวกับ Progressive Web Apps และเหตุใดคุณจึงควรเพิ่มไว้ใน เว็บไซต์เว็บ ของบริษัทของคุณ:
- คลื่นที่เพิ่มขึ้นของการเข้าชมอุปกรณ์เคลื่อนที่
- ประสิทธิภาพที่ดีขึ้นสำหรับเว็บไซต์ของคุณ - มือถือและเดสก์ท็อป
- พร้อมใช้งานแม้อุปกรณ์จะออฟไลน์
- ใช้คุณสมบัติเว็บมาตรฐาน: HTML, CSS และ Javascript ถูกกว่าในการสร้าง
- เพิ่มการรองรับเบราว์เซอร์และระบบปฏิบัติการ
บางทีคุณอาจต้องการทราบวิธีการทำ PWA บน WordPress? หรือแสดงให้นักพัฒนาของคุณเห็นว่าทำได้อย่างไร? นี่จะเป็นเรื่องของบทช่วยสอนอื่น
