WOFF รูปแบบเว็บเปิดแบบอักษร

การใช้แบบอักษรที่กำหนดเองบนเว็บเพจ

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

วันนี้ผู้เชี่ยวชาญด้านเว็บมีโฮสต์ของฟอนต์ใหม่และตัวเลือกประเภทที่จะทำงานร่วมกับหนึ่งในนั้นคือรูปแบบ WOFF

WOFF คืออะไร?

WOFF เป็นคำย่อที่ย่อมาจาก "Web Open Font Format" ซึ่งใช้สำหรับบีบอัดแบบอักษรสำหรับใช้กับคุณสมบัติ CSS @ font-face เป็นแบบฝังแบบอักษรในหน้าเว็บเพื่อให้คุณสามารถใช้แบบอักษรพิเศษนอกเหนือจาก "Arial Times New Roman, Georgia" ซึ่งเป็นรูปแบบเว็บที่ปลอดภัยดังกล่าว

WOFF ถูกส่งไปยัง W3C เป็นมาตรฐานสำหรับการบรรจุแบบอักษรสำหรับหน้าเว็บ ในวันนี้เรามี WOFF 2.0 ซึ่งช่วยปรับปรุงการบีบอัดจากรูปแบบแรกของรูปแบบได้เกือบ 30% ในบางกรณีเงินฝากออมทรัพย์เหล่านี้อาจเป็นปัจจัยแทนได้มากขึ้น!

ทำไมต้องใช้ WOFF?

แบบอักษรเว็บรวมถึงรูปแบบที่จัดส่งผ่านรูปแบบ WOFF ให้ข้อดีมากกว่าตัวเลือกแบบอักษรอื่น ๆ เป็นประโยชน์เป็นเว็บแบบอักษรที่ปลอดภัยได้และมีแน่นอนยังคงเป็นสถานที่สำหรับแบบอักษรเหล่านั้นในการทำงานของเราก็เป็นสิ่งที่ดีที่ยังขยายตัวเลือกของเราและเปิดตัวเลือกของเราพิมพ์

แบบอักษร WOFF มีประโยชน์ดังต่อไปนี้:

• พวกเขาสามารถเข้าถึงได้มากกว่าแบบอักษรเป็นภาพ รูปแบบ WOFF เป็น HTML ธรรมดาที่มี CSS ทำให้คุณสามารถเข้าถึงและควบคุมการออกแบบที่รูปภาพจะไม่สามารถทำได้
• ไฟล์ WOFF รวมถึงข้อมูลการพิมพ์เช่นรูปแบบตามบริบทและตัวเลขสไตล์เก่า การทำเช่นนี้ทำให้เว็บมาสเตอร์ของคุณเป็นตัวพิมพ์ดีดที่ดีขึ้นเนื่องจากคุณใช้อักขระที่ถูกต้องไม่ใช่ประมาณ

• แบบอักษร WOFF สามารถช่วยในการทำให้เป็นสากลได้เนื่องจากคุณสามารถฝังแบบอักษรที่มีอักขระจากภาษาอื่นได้
• เช่นเดียวกับข้อความในรูปแบบ CSS แบบอักษรที่มีสไตล์ WOFF เป็นเครื่องมือค้นหาที่เป็นมิตรมากขึ้น เครื่องมือค้นหาไม่เห็นข้อความฝังอยู่ในรูปภาพและในขณะที่ข้อความ ALT สามารถช่วยได้จะไม่มีการแทนที่ตัวหนังสือเอง
• แบบอักษร WOFF ถูกบีบอัดดังนั้นจึงมีขนาดเล็กกว่าไฟล์ฟอนต์อื่น ๆ ซึ่งจะช่วยให้มีความเร็วในการดาวน์โหลดไซต์และประสิทธิภาพโดยรวม
• คุณสามารถใช้ไฟล์ WOFF เพื่อรักษาเอกลักษณ์ของแบรนด์โดยการฝังแบบอักษรองค์กรของคุณเป็นไฟล์ WOFF

การสนับสนุนเบราเซอร์ WOFF

WOFF มีการสนับสนุนเบราว์เซอร์ที่ยอดเยี่ยมในเบราว์เซอร์ที่ทันสมัย ​​ได้แก่ :

• Chrome 6+
• Firefox 3.6 ขึ้นไป
• Internet Explorer 9 ขึ้นไป
• Opera 11.1 ขึ้นไป
• Safari 5.1 ขึ้นไป

ได้รับการสนับสนุนโดยคณะกรรมการทุกวันนี้โดยมีข้อยกเว้นคือ Opera Mini ทุกรุ่น

วิธีการใช้แบบอักษร WOFF

ในการใช้ไฟล์ WOFF คุณต้องอัปโหลดไฟล์ WOFF ไปยังเว็บเซิร์ฟเวอร์ของคุณตั้งชื่อด้วยคุณสมบัติแบบอักษร @ font จากนั้นให้เรียกใช้แบบอักษรใน CSS ของคุณ ตัวอย่างเช่น:

1. อัปโหลดแบบอักษรที่เรียกว่า myWoffFont.woff ไปยังไดเร็กทอรี / fonts ของเว็บเซิร์ฟเวอร์
2. ในไฟล์ CSS ของคุณเพิ่มส่วน @ font-face:

   @ font-face {
   แบบอักษรครอบครัว: myWoffFont;
   src: url ('/ fonts / myWoffFont.woff') รูปแบบ ('woff');
   }

1. เพิ่มชื่อแบบอักษรใหม่ (myWoffFont) ลงในสแต็คแบบอักษร CSS ของคุณเช่นเดียวกับชื่อแบบอักษรอื่น ๆ :

   p {
   ครอบครัวแบบอักษร: myWoffFont , Geneva, Arial, Helvetica, sans-serif;
   }

ที่จะได้รับแบบอักษร WOFF

มีสองสถานที่ที่ดีที่คุณสามารถหาแบบอักษร WOFF จำนวนมากที่ให้บริการฟรีเพื่อการใช้งานเชิงพาณิชย์และที่ไม่ใช่เชิงพาณิชย์:

• เปิดห้องสมุดแบบอักษร
• กระรอกตัวอักษร

หากคุณมีใบอนุญาตให้ใช้แบบอักษรที่ไม่มีในรูปแบบ WOFF คุณสามารถใช้ผู้สร้าง WOFF เช่น Font Squirrel เพื่อแปลงไฟล์แบบอักษรของคุณเป็นไฟล์ WOFF นอกจากนี้ยังมีเครื่องมือบรรทัดคำสั่งที่เรียกว่า sfnt2woff ซึ่งคุณสามารถใช้บน Macintosh และ Windows เพื่อแปลงแบบอักษร TrueType / OpenType ของคุณเป็น WOFF

ดาวน์โหลดไบนารีที่เหมาะสมกับระบบของคุณและเรียกใช้งานได้ที่บรรทัดคำสั่ง (หรือเทอร์มินัล) และทำตามคำแนะนำ

ตัวอย่าง WOFF

ต่อไปนี้เป็นตัวอย่างไฟล์ WOFF: WOFF Page สำหรับ HTML5 ใน 24 Hours

บทความต้นฉบับโดย Jennifer Krynin แก้ไขโดย Jeremy Girard เมื่อวันที่ 7/11/17