מסמך זה מספק מידע טכני על מה שקורה מאחורי הקלעים כשמבקשים גופן אינטרנט באמצעות Google Fonts API.
מסמך זה גם מספק מידע על התנהגות ספציפית לדפדפן.
אם אתם רוצים להשתמש רק ב-Fonts API, אין צורך לקרוא את הדף הזה. עם זאת, קריאה של הדף הזה יכולה לעזור לך לשפר את הביצועים של טעינת הדף.
מהו שירות Google Fonts API?
כשדפדפן שולח בקשה לגיליון אלקטרוני של Fonts (כפי שצוין בתג <link> בדף האינטרנט), ה-API של Fonts מציג גיליון אלקטרוני שנוצר עבור סוכן המשתמש הספציפי שביצע את הבקשה.
לדוגמה, אם הבקשה מ-Inconsolata מ-Firefox מחזירה את שירות ה-CSS הבא:
@font-face {
font-family: 'Inconsolata';
src: local('Inconsolata'), url('https://themes.googleusercontent.com/fonts/font?kit=J_eeEGgHN8Gk3Eud0dz8jw') format('truetype');
}
לעומת זאת, בקשה מ-Internet Explorer מחזירה:
@font-face {
font-family: 'Inconsolata';
src: url('https://themes.googleusercontent.com/fonts/font?kit=J_eeEGgHN8Gk3Eud0dz8jw');
}
לאחר שמורידים את שירות ה-CSS, הדפדפן מוריד את הגופן בפורמט המתאים לדפדפן.
התנהגות ספציפית לדפדפן
קטע זה מתאר את התנהגות ברירת המחדל של כל בראנץ עם גופני אינטרנט. לתשומת ליבך, אפשר לשלוט בהתנהגויות האלה באמצעות Web Font Load.
רשימה של דפדפנים נתמכים מופיעה בשאלות הנפוצות.
Google Chrome
Chrome מעבד את שאר הדף, אבל עד שהגופן נטען, הוא מציג שטח ריק במקום הטקסט שבו נעשה שימוש בגופן.
Mozilla Firefox
Firefox מציג תחילה את הטקסט בגופן ברירת המחדל, ולאחר מכן מעבד מחדש את הטקסט בגופן לאחר שנטען. התנהגות זו נקראת "Flash of styleed text."
Apple Safari
Safari טוען את שאר הדף, אך עד שהגופן ייטען, יוצג שטח ריק במקום הטקסט שבו נעשה שימוש בגופן.
Microsoft Internet Explorer
Internet Explorer מציג את שאר הדפים, אך עד שהגופן נטען, מוצג שדה ריק במקום הטקסט שבו נעשה שימוש בגופן.
באופן כללי, ההתנהגות של Internet Explorer עשויה להשתנות בהתאם למיקום ולקיומם של אלמנטים שונים. כדי להשתמש בהתנהגות עקבית בכל הדפדפנים, מומלץ להשתמש בכלי טעינת גופנים באינטרנט. לדוגמה, אפשר לקבוע שכל הדפדפנים יפעלו כמו Firefox.