אחד האלמנטים הבסיסיים הקובעים את מראהו הוויזואלי של האתר הם הפונטים. עד לפני מספר שנים, גם אם קנית פונט מיוחד במיטב כספך, הוא לא בהכרח היה "עובר" בהצלחה את הגדרות הטקסט מקובץ ה-CSS של האתר.
ככה זה עבד: הדפדפן של המשתמש קרא את ההגדרות הטקסט מהקובץ, בו הוגדרו משפחות פונטים. במידה והפונט לא היה קיים במחשבו של המשתמש, המערכת "שלפה" את סוג הפונט הבא שהוגדר. במידה וגם הוא לא נמצא, הדפדפן שלף את ברירת המחדל שלו. כך, למעצב הדף לא היתה שליטה על מראהו הסופי של הדף, והתוצאה נראתה שונה לגמרי בדפדפנים ובמערכות ההפעלה השונות. פתרון הדחק שנמצא לבעיה זו, היה חלוקת הדף לטקסט "מיוחד" ולתוכן טקסטואלי, כאשר הטקסט ה"מיוחד" כלל כותרות ואזורים המכילים פונטים מיוחדים (שהומרו לתמונות) והתוכן הטקסטואלי (כותרות ביניים ותכנים נוספים) בפונט טריוויאלי נפוץ (לרוב Arial). בנוסף למראה האחיד והמשעמם של התכנים (פונט אחיד), זמן עליית האתר גדל בצורה ניכרת בגלל השימוש בתמונות.
פונטים ווביים
בשנים האחרונות, עלו לכותרות הפונטים הווביים (הידועים גם בשמות "פונטים בטוחים לרשת", "גופני רשת" ועוד). השימוש באלמנט font-face@ ב-CSS3 מאפשר למעצבי ובוני האתרים להציג פונטים מיוחדים בכל סוג דפדפן, גם אם הפונט המסוים אינו מותקן במחשבו של הגולש.
עקרון הפעולה שמאחורי השימוש הוא פשוט: במקום חיפוש ושליפת הפונט הספציפי ממחשבו של הגולש, הדפדפן שולף אותו משרת האחסון של האתר (כפי שהוא עושה לתמונות ולשאר קבצי האתר) או משרת אחסון חיצוני. שיטה זו מאפשרת לעטר את הפונט הנבחר בקו מתאר, הטיה, צל ואף בצביעה מדורגת.
סוגי הפורמטים וההבדלים ביניהם:
- Ttf – חסרונו (המשקל הרב שלו) מתגמד לעומת היתרון שכמעט כל הדפדפנים יודעים להתמודד עם הפורמט.
- Eot – פורמט המיועד לדפדפן אקספלורר.
- Svg- פורמט פונטים הנקראים על ידי אייפון ואייפד.
- Woff – פורמט פתוח וקל, הנתמך על ידי הדפדפנים המודרניים.
מספר נקודות חשובות
- חוקיות – הסכמי השימוש ברוב הפונטים ה"רגילים" (גם אם נקנו), אינם מאפשרים שימוש בהם ברשת. על מנת שלא להסתבך, מומלץ לקרוא היטב את ההסכם.
- פונטים ווביים חינמיים – למציאת פונטים חינמיים המתאימים לשימוש ברשת בלועזית – ניתן להיעזר ב-fontsquirrel.com, ובעברית, בפרויקט קולמוס – culmus.sourceforge.net.
- פורמטים – מומלץ להשתמש לפחות בשלושה פורמטים שונים, אשר יעניקו לאתר כיסוי בסוגי הדפדפנים השונים. (את הפונטים הנחוצים תוכל להמיר לפורמטים השונים כאן).
- אחסון פונטים חיצוני – שימוש בפונטים הנמצאים בספריית פונטים חיצונית (לא על שרת אחסון האתר שלך). הטמעת הפונט באתר נעשה על ידי קישור לספריה חיצונית, למשל, Google Webfonts החינמית.
לסיכום, בין אם המדובר בפונטים ווביים המאוחסנים על שרת האתר שלך או בספריה חיצונית, פונטים אלה מסייעים לך לוודא שהאתר שלך אכן ייראה בדיוק איך שאתה רוצה שהוא ייראה, מבלי לסמוך על המזל, או על הפונטים המותקנים במחשבו של הגולש.
מספקת קשת רחבה של פתרונות אינטרנט ופתרונות הגנת מותג דיגיטליים.
- יש לכם אתר וורדפרס? זה הזמן לנקות אותו כהלכה! - אפריל 10, 2022
- אחסון אתרים בישראל או אחסון בחו"ל – האם יש הבדל? - ינואר 19, 2022
- איחסון לינוקס או Windows? - ינואר 15, 2022
