Tài liệu này cung cấp một số thông tin kỹ thuật về những gì đang diễn ra khi bạn yêu cầu một phông chữ trên web với API Google Fonts.
Tài liệu này cũng cung cấp thông tin về hành vi cụ thể của trình duyệt.
Nếu bạn chỉ muốn sử dụng API Fonts, bạn không cần phải đọc trang này. Tuy nhiên, việc đọc trang này có thể giúp bạn cải thiện hiệu suất tải trang.
API Google Fonts sẽ phân phát nội dung gì?
Khi trình duyệt gửi yêu cầu về biểu định kiểu API Fonts (như được chỉ định trong thẻ <link> trên trang web của bạn), API Fonts sẽ phân phát một biểu định kiểu được tạo cho tác nhân người dùng cụ thể đang đưa ra yêu cầu.
Ví dụ: yêu cầu Inconsolata từ Firefox trả về CSS sau:
@font-face {
font-family: 'Inconsolata';
src: local('Inconsolata'), url('https://themes.googleusercontent.com/fonts/font?kit=J_eeEGgHN8Gk3Eud0dz8jw') format('truetype');
}
Trong khi đó, yêu cầu từ Internet Explorer trả về:
@font-face {
font-family: 'Inconsolata';
src: url('https://themes.googleusercontent.com/fonts/font?kit=J_eeEGgHN8Gk3Eud0dz8jw');
}
Sau khi tải CSS xuống, trình duyệt sẽ tải phông chữ xuống ở định dạng phù hợp cho trình duyệt.
Hành vi theo trình duyệt cụ thể
Phần này mô tả hành vi mặc định của từng trình duyệt bằng phông chữ trên web. Xin lưu ý rằng bạn có thể kiểm soát các hành vi này bằng Trình tải phông chữ trên web.
Để xem danh sách các trình duyệt được hỗ trợ, hãy xem Câu hỏi thường gặp.
Google Chrome
Chrome hiển thị phần còn lại của trang, nhưng cho đến khi phông chữ tải xong, Chrome sẽ hiển thị một không gian trống thay cho văn bản sử dụng phông chữ đó.
Mozilla Firefox
Trước tiên, Firefox hiển thị văn bản bằng phông chữ mặc định rồi hiển thị lại văn bản trong phông chữ sau khi tải. Hành vi này được gọi là "Flash của văn bản chưa được định kiểu."
Apple Safari
Safari sẽ hiển thị phần còn lại của trang, nhưng cho đến khi phông chữ tải xong, Safari sẽ hiển thị một không gian trống thay cho văn bản sử dụng phông chữ đó.
Microsoft Internet Explorer
Internet Explorer hiển thị phần còn lại của trang, nhưng cho đến khi phông chữ được tải, trình duyệt sẽ hiển thị một không gian trống thay cho văn bản sử dụng phông chữ đó.
Nói chung, hành vi của Internet Explorer có thể thay đổi tùy thuộc vào vị trí và sự tồn tại của nhiều yếu tố. Nếu bạn muốn cung cấp hành vi nhất quán trên tất cả các trình duyệt, hãy sử dụng Trình tải phông chữ trên web. Ví dụ: bạn có thể chọn làm cho tất cả các trình duyệt hoạt động như Firefox.