แนะนำฟอนต์ Noto Sans Thai

วันก่อนเห็นข่าว Google ปล่อยฟอนต์ที่สามารถแก้ปัญหาไม่แสดงตัวอักษรเมื่อฟอนต์ใดฟอนต์หนึ่งไม่รองรับหรือที่เรียกว่าตัวเต้าหู้ (ตัวช่องสี่เหลี่ยม) โดยตั้งชื่อว่า Noto (No tofu – ไม่มีตัวเต้าหู้) แบบว่าฟอนต์เดียวรองรับทุกภาษาเลยว่างั้น แต่ถ้าจะรองรับทุกภาษาจริง ๆ ก็ต้องโหลดไฟล์ขนาดใหญ่พอสมควรอยู่ดีแหละ งั้นวันนี้เลยจะขอแนะนำและแอบนำมาใช้ในบล็อกนี้แล้วด้วย

ที่จะแนะนำก็คือฟอนต์ Noto ที่เป็นภาคภาษาไทยนั่นแหละ เพราะเห็นว่าสวยดี ดูได้ที่นี่ เลย Noto Sans Thai

 

ภาษาที่รองรับ

  • Northern Khmer
  • Kuy
  • Eastern Lawa
  • Western Lawa
  • Pali (Thai script)
  • Northeastern Thai
  • Southern Thai
  • Thai

 

นำไปใช้

มองหาไฟล์ stylesheet ของเว็บไซต์แล้วใส่ code ตามด้านล่าง โดยให้ในตัวผมวางไฟล์ style.css ไว้ในระดับเดียวกับโฟลเดอร์ fonts ซึ่งข้างในจะมีไฟล์ฟอนต์อยู่
/* ตัวหนา */
@font-face {
font-family: 'noto_sans_thai';
src: url('fonts/notosansthai-bold-webfont.eot');
src: url('fonts/notosansthai-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/notosansthai-bold-webfont.woff2') format('woff2'),
url('fonts/notosansthai-bold-webfont.woff') format('woff'),
url('fonts/notosansthai-bold-webfont.ttf') format('truetype'),
url('fonts/notosansthai-bold-webfont.svg#noto_sans_thaibold') format('svg');
font-weight: bold;
font-style: normal;
}
/* ตัวปกติ */
@font-face {
font-family: 'noto_sans_thai';
src: url('fonts/notosansthai-regular-webfont.eot');
src: url('fonts/notosansthai-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/notosansthai-regular-webfont.woff2') format('woff2'),
url('fonts/notosansthai-regular-webfont.woff') format('woff'),
url('fonts/notosansthai-regular-webfont.ttf') format('truetype'),
url('fonts/notosansthai-regular-webfont.svg#noto_sans_thairegular') format('svg');
font-weight: normal;
font-style: normal;
}

body {
font-family: ‘noto_sans_thai’, sans-serif;
}

 

ดาวน์โหลด

ผมเตรียมไฟล์พร้อมใช้ให้แล้วตามไฟล์แนบด้านล่างครับ

noto san thai

(3021)