เทคนิคเพิ่มคะแนน google page speed ให้เร็วขึ้น

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

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

จริงๆแล้ว การที่จะได้คะแนน Page Speed ดีๆ มันมีหลายปัจจัยมากครับ ไม่ว่าจะเรื่อง Host ที่เราใช้งาน ถ้าโฮสต์ห่วย มันก็ได้คะแนนน้อย แต่งดีแค่ไหน โฮสต์ตอบสนองช้ามันก็ไม่ได้ช่วยอะไรมากครับ

วันนี้ผมจะมาแชร์เทคนิคส่วนตัวที่ผมใช้ในการปรับแต่งเว็บให้ได้คะแนนดีขึ้นนะครับ ซึ่งเจ้าการวัดคะแนนนี้ ก็ขึ้นอยู่กับจังหวะเวลาด้วยครับ บางทีคะแนนก็ได้ไม่เท่ากัน แต่รวมๆแล้วก็ได้ผลสีเหลืองอัพครับ  ภาพด้านล่างผมเท็สวันที่ 20 พฤษภาคม 2564 เวลา 20:00 น. นะครับ

เทคนิคปรับแต่งแบบฟรี

เรามาเริ่มสำหรับคนที่อยากประหยัดงบกันก่อน โดยก่อนอื่นนั้นนะครับ

1. ใช้ CDN ครับ อันนี้ผมแนะนำนะครับ เพราะว่ามันช่วยได้จริงๆ หลักการทำงานแบบอธิบายให้ง่ายๆ ก็คือวิธีนี้จะเป็นเหมือนการเอาเว็บเราไปกระจายอยู่จุดต่างๆทั่วโลก พอคนเข้าเว็บเรา มันก็จะไปดึงจากจุดที่ใกล้บ้านเค้ามากสุดมาแสดง ก็ทำให้หน้าเว็บเราโหลดเร็วขึ้นอะไรทำนองนี้ครับ สำหรับตัวฟรีที่ผมใช้และแนะนำก็คือ Cloudflare ครับ สามารถสมัครได้เลย
2. ติดตั้งปลักอินแคชครับ ตัวฟรีที่ผมใช้คือปลักอินที่ชื่อว่า WP-Opitmizedครับ ตัวนี้ดีเลย ช่วยเรื่องการเก็บแคชในหน้าเว็บ การบีบอัดไฟล์ java script ไฟล์ css  การโหลดฟอนต์ และหน้าเว็บไซต์ของเราได้ด้วย
3. ปรับแต่งการแสดงรูปบนหน้าเว็บให้เป็นไฟล์ wepb เพื่อให้ไฟล์รูปขนาดเล็กลง โหลดไวขึ้น ผมใช้ปลักอิน Giga WebP Image Converter ปลักอิน WebP Converter for Media และ WebP Express ครับ จริงๆ คือ ตอนลงแค่ตัวใดตัวหนึ่ง บางที Google ยังเตือนเรื่องรูปไม่เป็น webp ผมเลยทั้งสามตัว convert ให้หมด ปรากฎว่าได้ครับ ฮ่าๆ เลยคิดว่า เพื่อนๆลองไปลองดูกันว่าใช้ตัวไหนแล้วได้ผล สำหรับตอนนี้ผมก็เปิดใช้งานทั้งสามตัวนี้ครับ

การตั้งค่า WP-Optimize

ก่อนอื่นนั้นเข้าไปโหลดปลักอินกันให้เรียบร้อยก่อนนะครับ

WP-Optimize – Clean, Compress, Cache.

ปลักอินนี้ ผมตั้งค่าดังนี้ครับ

การตั้งค่า Cache ก็แค่เปิดใช้งานครับ

รวมไปถึงการเปิดใช้งาน Gzip Compression เพื่อบีบอัดหน้าเว็บของเราได้มีขนาดเล็กลง

ตรง Static file headers ก็เปิดด้วยครับ (น่าจะเขียวมาเป็น default อยู่แล้ว)

ต่อมาตรง Minify พวกการบีบอัดไฟล์ Java Script และ CSS ก็เปิดใช้งานหมดครับ

JavaScript ผมติ๊กสองข้อครับ  แต่ถ้าหากติ๊กแล้วเว็บโหลดเพี้ยนก็เลือกเฉพาะตัวที่เลือกแล้วเว็บยังไม่เป็นไรนะครับ

CSS ก็เลือกสองข้อเช่นกันครับ

ส่วนการปรับแต่ง Fonts เนื่องจากผมใช้ Google Font ครับ ผมเลยตั้งค่าตามนี้ อันนี้แล้วแต่เว็บนะครับ ลองติ๊กดูว่าถ้าติ๊กแล้วเว็บยังโหลดฟอนต์มาโอเคก็เลือกใช้ตัวนั้นครับ

หัวข้อ Setting

ส่วนตัวอื่นๆ ผมก็ไม่ได้ตั้งค่าอะไรเพิ่มเติมครับ ซึ่งจากการที่ผมปรับค่าตามนี้ก็ทำได้คะแนนสูงขึ้นมา

ทีนี้มาดูการแปลงรูปให้เป็น webp กันครับ จริงๆก็ไม่ยาก แค่ติดตั้งปลักอินแล้วแอคทิเวทครับ วิธีการใช้งานมีในคู่มือของแต่ละปลักอินอยู่แล้วครับ

Giga WebP Image Converter – Convert your Images to WebP for Free

WebP Converter for Media

WebP Express

การปรับแต่งแบบเสียเงิน

1. ติดตั้งปลักอิน Nitropack ครับ อันนี้คือคะแนนพุ่งแรงมากจนตกใจ เหมือนทางไนโตรแพคเองก็เคลมว่ามีการปรับค่าให้เหมาะกับกูเกิลด้วยอัลกอริธึมของเค้าครับ จริงๆ มันมีแบบฟรีด้วยนะครับ แต่เว็บผมแบนวิธเยอะ แป็บเดียวก็เกินโควต้าแบบฟรีของเค้า สำหรับปลักอินนี้ผมว่าเหมาะกับคนที่เว็บทราฟิคสูงๆ ต้องการการปรับแต่งที่ง่ายๆครับ เพราะมันง่ายจริง ง่ายมาก
2. ติดตั้งปลักอิน WP-Rocket ครับ อันนี้มีหลายที่ที่เขียนถึงแล้ว และส่วนตัวผมไม่ได้ใช้ตัวนี้ เพราะใช้แล้วคะแนนดันได้น้อยกว่าการปรับแต่งด้านบนครับ

• Facebook
• Twitter
• Line