Google Fonts – גופנים של גוגל הם אחד המשאבים הנפוצים ביותר של צד שלישי באתרי וורדפרס רבים. עם למעלה מ- 999 משפחות גופנים חינמיות וייחודיות לבחירה, נמצא כי משתמשי האינטרנט צפו במשותף בגופני גוגל למעלה מ- 40 טריליון פעמים (נכון לחודש יולי 2020). גופנים מאוחסנים חיצונית כמו גופנים של גוגל הם גם אחד המשאבים הכבדים ביותר הנטענים באתר על ידי צד שלישי. לא רק שהם מוסיפים למשקל הדף, אלא שוורדפרס צריך להגיש בקשות HTTP נוספות כדי להציג אותם. הדבר בולט עוד יותר כאשר מעמיסים מספר משפחות גופנים עם מספר משקלי גופן. לפיכך, נראה על פניו שזה רעיון טוב יותר לאחסן את גופני גוגל באופן מקומי ולהגיש אותם משרת אחסון וורדפרס, בניגוד לטעינה מה- CDN של גוגל. תיאורטית, זה יכול לגרום לאתר להיטען מהר יותר, אולם מתברר שגופנים הם דבר מורכב מאד ואחסון עצמי שלהם עלול להפוך את אופטימיזציה לביצועי האתר למסובכת יותר. במאמר זה נדון ביסודות של גופני אינטרנט, כולל גופנים של גוגל וכן, כיצד ניתן לאחסן אותם באופן מקומי והאם הדבר משנה את ביצועי האתר.

גופני אינטרנט מתייחסים לגופנים שבהם אפשר להשתמש כדי להציג טקסטים באתר גופני אינטרנט הינם אוסף של גליפים, שכל גליף הוא וקטור שמראה אות, מספר או סמל. בימים הראשונים של האינטרנט, למפתחים היו גופני אינטרנט מוגבלים לבחירה. מערכות ההפעלה המובילות הגיעו יחד עם גופנים אלו (למשל Arial, Georgia, Times New Roman). לפיכך, הם ידועים גם בשם גופנים בטוחים באינטרנט.

CSS3 הציג את הכלל @font-face שאיפשר למפתחי אתרים להשתמש בגופנים מותאמים אישית. כלל זה מאלץ את הדפדפן להוריד גופנים מותאמים אישית יחד עם משאבים נוספים של האתר. תכונה זו פתחה דרכים חדשות לעיצוב אתרים, כך שהאינטרנט כבר לא היה אוסף של טקסט משעמם. כמה מגופני האינטרנט הפופולריים ביותר שנמצאים בשימוש כיום הם Open Sans, Roboto ו- Lato. אלו גם גופנים של גוגל. גופני גוגל מהווים קטלוג עצום של גופני קוד פתוח בחינם. הם מקלים על מעצבי אתרים ומפתחים ליצור אתרים יפים בעלי טיפוגרפיה מושכת. נכון לעכשיו, כוללים גופני גוגל גופני אינטרנט ליותר מ- 135 שפות. הגופנים של גוגל לא רק מטפלים בדרישות הרישוי של כל גופני האינטרנט, אלא גם מטפלים באחסונם ובמסירתם לאתר (סוג של CDN עבור גופנים). לפיכך, כל אחד יכול לנצל אותם מתי שהוא רוצה על ידי הוספת שורה אחת בכותרות העמודים של האתר.

Google Fonts טוענים כי דפי האינטרנט נטענים מהר יותר על ידי שמירת גופנים באתרים שונים, כך שכל גופן נטען פעם אחת בלבד לכל האתרים. הדפדפן יכול להשתמש באותו גופן במטמון לכל אתר אחר שמבקש את אותו גופן של גוגל. התהליך כולל גם זיהוי הדפדפן של המשתמש ושליחת קובץ הגופנים הקטן ביותר על סמך הטכנולוגיות העדכניות ביותר שהדפדפן תומך בהם. עם זאת, כאשר משתמשים ב- Google Fonts באתר וורדפרס, גיליון ה- CSS הראשי של האתר שולח בקשת HTTP לאחזור גיליון CSS של Google Fonts. האתר שולח בקשה זו לדומיין fonts.googleapis.com ובדרך כלל נוצרת בקשה אחת לכל גופן בו משתמשים. גיליון CSS של גופנים מגיש בקשה נוספת להורדת קובץ הגופן (למשל קובץ WOFF או WOFF 2.0). גיליון הסגנונות מפנה את הבקשות הללו לדומיין fonts.gstatic.com בו מאוחסנים כל הגופנים של גוגל. חשוב להבין כי ביצוע בקשות HTTP נוספות באתר דורש זמן והדבר מתבטא במהירות הטעינה. ממשק ה- API של גופני Google Fonts מגדיר זמן תפוגה נמוך של יום אחד עבור גופנים במטמון. לא ניתן לשנות זאת מכיוון שגוגל מייצרת את קובץ ה- CSS באופן אוטומטי בהתבסס על מספר גורמים. כלי בדיקת מהירות אתרים מצביעים על כך כעל משקל בחישוב מהירות הטעינה ולכן מציעים לאחסן גופני גוגל באופן מקומי. בדרך זו ניתן להגדיל את זמן התפוגה של הגופנים באופן ידני ולשמור אותם במטמון לזמן ארוך יותר.

הדרך הפשוטה ביותר לאחסן באופן עצמאי גופנים של גוגל באופן מקומי באתר הוורדפרס, היא באמצעות תוסף וורדפרס OMGF. זהו תוסף חינמי אשר משתמש ב- Google Fonts Helper API כדי להוריד גופנים לשרת אחסון האתר. לאחר מכן, OMGF מייצר גיליון CSS עבור הגופנים שהורדו ומוסיף אותו לכותרת האתר. לאחר בחירה במשפחת גופנים מסוימת, ניתן לציין אילו קבוצות משנה וסגנונות גופנים רוצים להוריד, כך שזה יכול לעזור להקטין באופן משמעותי את נפח הגופנים המוגשים לאתר. הגשה של גופני גוגל מקומיים אמורה להקטין את זמני הטעינה באמצעות מינימום בקשות DNS ומינוף מטמון הדפדפן, אולם יש לציין כי שימוש ב- WP Rocket מקטין עוד יותר את זמני הטעינה.