ในขณะที่มีหลายปัจจัยที่ส่งผลกระทบต่อรายได้อย่างไม่ต้องสงสัยผู้เชี่ยวชาญส่วนใหญ่กล่าวว่าไซต์ธุรกิจที่โหลดภายใน 5 วินาทีจะได้รับเกือบสองเท่าของการทำใน 19 ไซต์เวลาเฉลี่ยในการโหลด
การศึกษาพบเพิ่มเติมว่าเว็บไซต์โหลดภายใน 5 วินาทีมี:
- การเปิดเผยโฆษณาที่สูงขึ้น 25%
- อัตราตีกลับลดลง 35% และ
- เซสชันผู้ใช้อีกต่อไป 70%
นั่นเป็นเหตุผลที่เราต้องมุ่งเน้นไปที่โซลูชั่นมือถือเป็นครั้งแรกเพื่อช่วยให้ธุรกิจของเราประสบความสำเร็จ ท้ายที่สุดความเร็วของโทรศัพท์มือถือไม่เคยมีความสำคัญ
$config[code] not foundความเร็วในการโหลดช้าอาจเป็นปัญหาได้
อ้างอิงจาก Google
- 1 จาก 2 คนคาดหวังว่าหน้าจะโหลดภายในเวลาน้อยกว่า 2 วินาที
- การเข้าชม 53% มีแนวโน้มที่จะถูกยกเลิกหากหน้าเว็บใช้เวลานานกว่า 3 วินาทีในการโหลดบนอุปกรณ์มือถือ
- 46% ของผู้คนแสดงความไม่พอใจในการรอให้หน้าโหลดขณะที่ท่องเว็บบนอุปกรณ์พกพา
ปัจจัยหลัก 3 ประการที่ทำให้ไซต์ต่างๆบนอินเทอร์เน็ตบนมือถือช้าลงคือจำนวนคำขอของเซิร์ฟเวอร์ขนาดไฟล์และลำดับขององค์ประกอบในการโหลดหน้าเว็บตามลำดับ ดังนั้นตอนนี้เราได้เน้นสาเหตุ มาแก้ปัญหากันดีกว่า
วิธีเพิ่มความเร็วไซต์มือถือ
วัดและลดเวลาตอบสนองเซิร์ฟเวอร์ของคุณ
ความเร็วหน้ามือถือของคุณไม่เพียง แต่ขึ้นอยู่กับรหัสของคุณ แต่ยังพึ่งพาเครื่องมือเทคโนโลยีที่สำคัญที่เรียกว่าเซิร์ฟเวอร์
ยิ่งเซิร์ฟเวอร์ของคุณรอการตอบรับคำขอของเบราว์เซอร์นานเท่าไหร่หน้าของคุณก็จะโหลดช้าลง ผู้เชี่ยวชาญส่วนใหญ่ที่ Google แนะนำให้เซิร์ฟเวอร์ของคุณเริ่มส่งสัญญาณ 1เซนต์ ไบต์ของทรัพยากรภายในสองร้อยมิลลิวินาทีของการร้องขอเพื่อให้ได้ผลลัพธ์ที่ดีที่สุด
โดยทั่วไปมี 3 วิธีหลักที่เกี่ยวข้องในการยกระดับเวลาตอบสนองของเซิร์ฟเวอร์ของคุณ:
- ปรับปรุงการกำหนดค่าเว็บเซิร์ฟเวอร์หรือซอฟต์แวร์ของคุณ
- ปรับปรุงขอบเขตและคุณภาพของบริการโฮสติ้งของคุณโดยเฉพาะอย่างยิ่งให้แน่ใจว่าคุณมีหน่วยความจำและทรัพยากร CPU ที่เพียงพอ
- ลดจำนวนทรัพยากรที่หน้าเว็บของคุณต้องการ
ใช้ CSS เพื่อโหลดรูปภาพ
หากคุณต้องการซ่อนภาพเนื้อหาของคุณสำหรับผู้ใช้มือถือโหลดภาพเหล่านั้นเป็นภาพพื้นหลังผ่าน CSS และใช้คำสั่งสื่อเพื่อซ่อนภาพตามเงื่อนไข
Amazon ใช้เทคนิคที่หลากหลายในการโหลดรูปภาพเฉพาะอุปกรณ์ตามเงื่อนไข
ลดจำนวนการเปลี่ยนเส้นทางเพื่อเพิ่มความเร็วหน้ามือถือของคุณ
การเปลี่ยนเส้นทางไม่มีอะไรนอกจากคำแนะนำที่สามารถนำผู้เข้าชมเว็บไซต์จากหน้าหนึ่งไปอีกหน้าหนึ่งโดยอัตโนมัติ
การเปลี่ยนเส้นทางแต่ละครั้งสามารถกินมิลลิวินาทีที่มีค่าทำให้การโหลดหน้าเว็บช้าลง นี่เป็นปัญหาอย่างยิ่งสำหรับอุปกรณ์มือถือเนื่องจากพวกเขามักจะพึ่งพาเครือข่ายที่ไม่น่าเชื่อถือกว่าผู้ใช้เดสก์ท็อป
ขั้นตอนแรกในการแก้ไขปัญหานี้คือการสำรวจจำนวนการเปลี่ยนเส้นทางบนเว็บไซต์ของคุณโดยใช้เครื่องมือเช่นผู้ทำแผนที่เปลี่ยนเส้นทาง หากตัวเลขมีขนาดใหญ่เกินไปให้ย่อหรือย่อให้เล็กสุดเพื่อให้ได้ผลลัพธ์ที่ดีที่สุด
ลดขนาดไฟล์ JS และ CSS
ข้อมูลเพิ่มเติมหมายถึงน้ำหนักหน้ามากเกินไป การดำเนินการนี้จะใช้เวลานานขึ้นในการโหลดบนอุปกรณ์มือถือ
นั่นคือเหตุผลที่นักพัฒนาเว็บส่วนใหญ่มีค่าความกล้าหาญของพวกเขารู้ถึงความต้องการในการเพิ่มประสิทธิภาพและลดสินทรัพย์เพื่อเพิ่มความเร็วในการโหลดหน้า
“ การลดขนาด” กำจัดความซ้ำซ้อนโดยไม่ส่งผลต่อการแสดงหน้า เครื่องมือของ Google ที่หลากหลายสามารถช่วยคุณกำจัดความซ้ำซ้อนดังกล่าวรวมถึงสิ่งที่ชอบ:
- CSSNano (สำหรับ CSS)
- UglifyJS (สำหรับ JS)
แทนที่จะใช้รูปภาพให้ใช้ CSS3
ปล่อยเงามุมมนและการไล่ระดับสี - คุณลักษณะทั้งหมดเหล่านี้สามารถทำได้ผ่าน CSS แทนที่จะเป็นภาพ
วิธีนี้จะช่วยลดจำนวนการร้องขอ HTTP ได้อย่างมากทำให้การโหลดเร็วขึ้นในครั้งเดียวและในเวลาเดียวกัน
ใช้ SVG แบบอินไลน์แทน JPEG
เช่นเดียวกับ data URIs สามารถฝัง SVGs (กราฟิกส์แบบเวกเตอร์ที่ปรับขนาดได้) บนหน้าหนึ่งเพื่อลดจำนวนคำขอ
ไฟล์เหล่านี้สามารถสร้างได้ในโปรแกรมแก้ไขกราฟิกแบบเวกเตอร์เช่น Inkscape, Adobe Illustrator เป็นต้นเมื่อไฟล์ถูกสร้างขึ้นคุณสามารถเปิดขึ้นในโปรแกรมแก้ไขข้อความและวางลงในรหัสของคุณ
หมายเหตุ: ในการฝัง SVG ในสไตล์ชีทของคุณคุณต้องแปลงเป็น URI ของข้อมูลก่อนจากนั้นดำเนินการในขั้นตอนถัดไป
เพื่อให้ผลรวมมากหรือน้อย หวังว่าคุณจะอ่านดีและแจ่มใส
ภาพถ่ายผ่าน Shutterstock
1
