Fontello

Fontello ช่วยให้คุณเลือกเฉพาะ Glyph ที่จำเป็นสำหรับแอปพลิเคชันของคุณ การตัดไอคอนหลายพันรายการที่ไม่ได้ใช้ออกจะช่วยลดขนาดไฟล์ฟอนต์จากหลายร้อยกิโลไบต์เหลือเพียงไม่กี่กิโลไบต์ การควบคุมที่ละเอียดนี้ช่วยปรับปรุง Core Web Vitals โดยตรง โดยเฉพาะการลดเวลา Largest Contentful Paint (LCP) ผ่านการลดขนาด Payload ของไฟล์สำคัญ

แพลตฟอร์มนี้มีเอนจินที่ทรงพลังในการแปลงเส้นทางเวกเตอร์ SVG เป็นรูปแบบฟอนต์มาตรฐาน (WOFF, WOFF2, TTF, EOT) โดยจะจัดการการปรับมาตรฐานเส้นทางและการปรับขนาดพิกัดโดยอัตโนมัติ เพื่อให้ไอคอนของคุณแสดงผลได้อย่างคมชัดในทุกความละเอียด ซึ่งดีกว่าการใช้ไฟล์ SVG ดิบใน DOM เพราะช่วยให้ปรับแต่งสีและขนาดได้ง่ายผ่านคุณสมบัติ CSS มาตรฐาน เช่น 'color' และ 'font-size'

เมื่อดาวน์โหลด Fontello จะให้ไฟล์ CSS ที่พร้อมใช้งานซึ่งรวมถึงการประกาศ @font-face และคำจำกัดความของคลาสที่จำเป็นทั้งหมด ช่วยลดภาระในการเขียน Boilerplate CSS สำหรับการจัดตำแหน่งไอคอน การปรับระยะบรรทัด และการจัดแนวแนวตั้ง โค้ดที่สร้างขึ้นได้รับการปรับให้เหมาะสมสำหรับเบราว์เซอร์สมัยใหม่ ทำให้การแสดงผลสม่ำเสมอทั้งใน Chrome, Firefox, Safari และ Edge โดยไม่ต้องใช้ Polyfill ที่ซับซ้อน

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

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