Web Open Font Format (WOFF) là một định dạng file cho phông chữ web do Mozilla phát triển. File WOFF có thể chứa các file TTF và OTF được 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 này áp dụng cho các file WOFF và WOFF2.
File WOFF là gì?
Tương tự như file ZIP, file WOFF đóng vai trò là 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 cung cấp cho các nhà thiết kế web khả năng sử dụng phông chữ ngoài những ký tự tiêu chuẩn được tìm thấy trên hầu hết máy tính.
WOFF đã được thay thế bằng định dạng WOFF2. WOFF2 cung cấp các thuật toán nén thậm chí còn tốt hơn, giúp giảm dung lượng file gốc thêm 30%. Do đó, các file WOFF2 chiếm ít băng thông hơn và load nhanh hơn. Các file WOFF có phần mở rộng .woff, trong khi những file WOFF2 có phần mở rộng .woff2.
File WOFF hoạt động như thế nào?
Hầu như tất cả các trang web đều sử dụng Cascading Style Sheets (CSS) để xác định bố cục của HTML và các phần tử khác trên màn hình. Ví dụ, các nhà phát triển có thể sử dụng CCS để thay đổi phông chữ web bằng cách tham chiếu những phông chữ đã được cài đặt trên máy tính của người dùng. Tuy nhiên, nếu PC hoặc trình duyệt không hỗ trợ phông chữ, thì phông chữ đó sẽ xuất hiện dưới dạng phông chữ khác hoặc hoàn toàn không load tùy thuộc vào cách thiết lập font stack của trang.
Để tránh vấn đề này, phông chữ tùy chỉnh có thể được lưu trữ trong file WOFF, file này được lưu trên máy chủ cùng với tất cả các phần tử trang web khác. Sau đó, nhà thiết kế có thể sử dụng thuộc tính CSS @font-face để tham chiếu file WOFF và hiển thị phông chữ trong trình duyệt.
Google Chrome, Firefox, Microsoft Edge, Opera và Safari đều hỗ trợ định dạng WOFF, nhưng bạn có thể cần cập nhật trình duyệt web của mình lên phiên bản mới nhất.
Lợi ích của WOFF
Ngoài việc mở rộng các loại phông chữ có sẵn cho những nhà phát triển web, việc sử dụng file WOFF có một số lợi thế. Ví dụ:
– Nén: Vì file WOFF được nén nên chúng load nhanh hơn các loại file phông chữ khác.
– Hỗ trợ HTML và CSS: Không giống như file hình ảnh, file WOFF có thể được tạo kiểu bằng HTML và CSS.
– SEO: Phông chữ WOFF tốt hơn cho việc tối ưu hóa công cụ tìm kiếm (SEO) hơn là hình ảnh chứa văn bản.
– Kết xuất tối ưu: Các file WOFF bao gồm thông tin đánh máy (những biểu mẫu ngữ cảnh và số liệu kiểu cũ) cho phép hiển thị tối ưu trên tất cả mọi thiết bị.
– Khả năng truy cập trang web: Các file WOFF giúp các trang web dễ truy cập hơn, vì văn bản có thể được đọc to nhưng hình ảnh chứa văn bản thì không.
– Nhúng: Phông chữ WOFF giúp quốc tế hóa bằng cách cho phép bạn nhúng phông chữ với các ký tự từ những ngôn ngữ khác.
Tạo phông chữ WOFF của riêng bạn
Các trình chỉnh sửa phông chữ như FontForge cho phép bạn thiết kế bộ phông chữ của riêng mình và xuất chúng dưới dạng file WOFF. Bạn cũng có thể chuyển đổi file WOFF sang TTF hoặc OTF bằng FontForge. Nếu bạn có trình chỉnh sửa phông chữ yêu thích khác chỉ hỗ trợ TTF hoặc OTF, bạn có thể sử dụng công cụ sfnt2woff để chuyển đổi phông chữ thành file WOFF.
Open Font Library (https://fontlibrary.org/) và Font Squirrel (https://www.fontsquirrel.com/) có hàng trăm phông chữ ở định dạng WOFF miễn phí cho mục đích thương mại và phi thương mại.
Xem thêm:
