Web Open Font Format (WOFF) là định dạng file font cho web do Mozilla phát triển. File WOFF có thể chứa file TTF và OTF đã nén cũng như thông tin cấp phép và siêu dữ liệu khác. Đây là những gì bạn cần biết về WOFF.
Thông tin trong bài viết áp dụng cho file WOFF và WOFF2.
File WOFF Là Gì?
Giống file ZIP, file WOFF đóng vai trò container cho các file khác, cụ thể là file TrueType Font (TTF) và OpenType Font (OTF). Các loại file này cho phép nhà thiết kế web dùng font bên ngoài các ký tự tiêu chuẩn có trên hầu hết máy tính.
WOFF đã được thay thế bởi định dạng WOFF2. WOFF2 cung cấp thuật toán nén tốt hơn, giảm dung lượng file gốc thêm 30%. Do đó, file WOFF2 chiếm ít băng thông hơn và tải nhanh hơn. File WOFF có phần mở rộng .woff, file WOFF2 có .woff2.
File WOFF Hoạt Động Như Thế Nào?
Gần như tất cả trang web dùng Cascading Style Sheets (CSS) để định nghĩa bố cục HTML và các yếu tố khác trên màn hình. Ví dụ, lập trình viên có thể dùng CSS đổi font web bằng cách tham chiếu font đã cài trên máy người dùng. Tuy nhiên, nếu PC hoặc trình duyệt không hỗ trợ font đó, nó sẽ hiển thị thành font khác hoặc không tải được tùy cách thiết lập font stack của trang.
Để tránh vấn đề này, font tùy chỉnh có thể lưu trong file WOFF, file này lưu trên server cùng các yếu tố trang web khác. Nhà thiết kế dùng thuộc tính CSS @font-face để tham chiếu file WOFF và hiển thị font trong trình duyệt.
Google Chrome, Firefox, Microsoft Edge, Opera, Safari hỗ trợ định dạng WOFF, nhưng bạn có thể cần cập nhật trình duyệt lên phiên bản mới nhất.
Lợi Ích Của WOFF
Ngoài việc mở rộng loại font có sẵn cho nhà phát triển web, dùng file WOFF có vài ưu điểm. Ví dụ:
- Nén: Vì file WOFF được nén, chúng tải nhanh hơn các loại file font khác.
- Hỗ trợ HTML và CSS: Khác với file hình ảnh, file WOFF có thể định dạng bằng HTML và CSS.
- SEO: Font WOFF tốt cho tối ưu hóa công cụ tìm kiếm (SEO) hơn so với hình ảnh văn bản.
- Hiển thị tối ưu: File WOFF bao gồm thông tin chữ in như dạng ngữ cảnh, chữ số cũ, cho phép hiển thị tối ưu trên mọi thiết bị.
- Khả năng truy cập web: File WOFF làm trang web dễ truy cập hơn vì văn bản có thể đọc to, hình ảnh văn bản thì không.
- Nhúng: Font WOFF hỗ trợ quốc tế hóa bằng cách cho phép nhúng font với ký tự ngôn ngữ khác.
Tự Tạo Font WOFF Của Mình
Trình soạn thảo font như FontForge cho phép thiết kế bộ font riêng và xuất ra file WOFF. Bạn cũng chuyển đổi WOFF sang TTF hoặc OTF dùng FontForge. Nếu có trình soạn thảo font khác chỉ hỗ trợ TTF/OTF, bạn dùng công cụ sfnt2woff để chuyển font sang WOFF.
Open Font Library và Font Squirrel có hàng trăm font định dạng WOFF miễn phí cho dùng thương mại và phi thương mại.