אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » מדריכים » CSS3 » מדריך CSS3 – הטמעת פונטים באינטרנט אקספלורר 8 ומטה

מדריך CSS3 – הטמעת פונטים באינטרנט אקספלורר 8 ומטה

רן בר-זיק יולי 24, 2011 7:46 am אין תגובות

הסבר על הטמעת פונטים באתרי אינטרנט שיראו היטב גם בדפדפני אינטרנט אקספלורר 8 ומטה.

»מדריך CSS3 – הצגת פונטים
»CSS3 Resize
כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

במאמר הקודם למדנו כיצד לבצע הטמעת פונטים באמצעות CSS3 בקלות ובמהירות. ברם אולם, בעולמנו המושלם קיימים לא רק דפדפנים מתקדמים אלא גם דפדפני אינטרנט אקספלורר מגרסה 8 ומטה שאינם תומכים בהטמעת פונטים באופן תקני אלא מיישמים את הדרך הקטנה והעלובה שלהם להטמעת פונטים.

אני חושב שבמקרים של הטמעת פונטים, אין טעם לשבור את הראש על הטמעה יפה שלהם בגרסאות עתיקות יומין של אינטרנט אקספלורר. כלומר, אם אתה משתמש באינטרנט אקספלורר 8 – מגיע לך. אבל אני כמובן לא קיים בעולם הזה לבד. בעולם הזה יש גם מנהלי פרויקט ומנכ"לים שמקפידים להשתמש באינטרנט אקספלורר מהגרסה העתיקה ביותר והם, שבת'כלס חותמים על הצ'ק, רוצים לראות פונט. אז בואו ונתקין להם פונט כדי שיראה על האינטרנט אקספלורר המחורבן שלהם.

איך עושים את זה? נקודת ההנחה היא שיש לנו פונט חביב. הפונט שהשתמשנו בו במאמר הקודם הוא Graublau החביב והחופשי לשימוש. מדובר בקובץ מסוג otf ששמו בישראל הוא GraublauWeb.otf (להורדה). אינטרנט אקספלורר 8 ומטה לא מקבל את פורמט otf ולפיכך עלינו להמיר את קובץ ה-otf לקובץ eot שנשתמש בו בגרסאות אקספלורר הרלוונטיות. אפשר להוריד את קובץ ה-eot שזמין לעתים במקומות שבהם הפונט בגרסתו הרגילה זמין ואפשר להמיר אותו באתרים שונים – למשל זה: http://www.fontsquirrel.com/fontface/generator. אחרי שהמרנו יש לנו קובץ עם סיומת eot. את הקובץ הזה נציב באופן הבא:


@font-face {
    font-family: 'GraublauWebRegular';
    src: url('graublauweb-webfont.eot');
    src: url('graublauweb-webfont.eot?#iefix') format('embedded-opentype'),
         url('graublauweb-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

ואז אפשר להשתמש בשם הפונט כרגיל, כמו בכל המקרים. ולראיה:

Hi! I am paragraph and I can be seen in another font at IE8 and IE7!

וזה הכל!

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
CSS3

השארת תגובה

ביטול

ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

    הפרויקטים שאני כותב ושוחררו לציבור ברישיון קוד פתוח נמצאים ברובם בגיטהאב.
חיפוש

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד