ฟอนต์ไทยอย่าง Prompt และ Sarabun สวยและอ่านง่าย แต่การเรียกจาก Google Fonts ทุกครั้งที่มีคนเข้าเว็บมีต้นทุนทั้งความเร็วและความเป็นส่วนตัวของผู้ใช้
ทำไมต้อง Self-hosted
- ตัด DNS lookup และ connection ไปเซิร์ฟเวอร์ภายนอก
- ควบคุม cache ได้เอง ตั้งอายุยาวได้เต็มที่
- ไม่ส่งข้อมูลผู้เยี่ยมชมไปที่ Google (เป็นมิตรกับ PDPA)
เทคนิคสำคัญ: แยก subset
ไฟล์ฟอนต์ไทย+ละตินรวมกันมีขนาดใหญ่ ให้แยกเป็น subset ไทยและละติน พร้อมกำหนด unicode-range ในแต่ละ @font-face เบราว์เซอร์จะดาวน์โหลดเฉพาะไฟล์ที่หน้านั้นใช้จริง
ใน Block Theme สามารถกำหนดทั้งหมดผ่าน theme.json ได้เลย โดยใส่ fontFace พร้อม src ชี้ไปที่ไฟล์ woff2 ในธีม WordPress จะสร้าง @font-face ให้อัตโนมัติ
อย่าใช้ font-display: block — ใช้ swap เพื่อให้ผู้ใช้อ่านเนื้อหาได้ทันทีระหว่างรอฟอนต์
กฎง่าย ๆ ที่ช่วยคะแนน Core Web Vitals
ใส่ความเห็น