גודל, גובה שורה ומירכוז

גוררים לכאן פונט שלך

1. גודל

הבעיה: הפונט שלנו קטן/גדול מדי ביחס לאחרים – לא נוח לשימוש באתרים ובתוכנות גרפיקה.
מטרה: להתאים גודל ביחס לפונטים אחרים בסגנון.
הסבר: גודל הפונט הוא היחס בין UPM לגודל הצורות בגליפים.
פתרונות: הגדלה/הקטנה של תוכן הגליפים (קצת מורכב) או הגדלה/הקטנה של UPM (קל יותר)

הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר
הפונט שלך פונט אחר

צריכים עוד דוגמאות? רוצים לנדב את הפונטים שלכם לצורך השוואה? מוזמנים להציע

2. גובה שורה

הבעיה: מרחקי השורות נראים גדולים/קטנים מדי בדפדפן
מטרה: להתאים גובה שורה בדפדפן
הסבר: גובה השורה בדפדפן מושפע מגודל הפונט בלבד
הרחבה טכנית: בתוכנות גרפיקה, גובה השורה (line height, נקרא גם leading) נקבע בעיקר על ידי ערכי Ascender ו־Descender של הפונט, שמשפיעים על המרווחים האנכיים. בדפדפנים, לעומת זאת, גובה השורה מבוסס על יחידת UPM (Units Per Em) של הפונט, כאשר ברירת המחדל היא כ־120% מה־UPM, אלא אם הוגדר אחרת באתר.
פתרון: להגדיל/להקטין את גודל הפונט (צעד 1), להעלות קובץ חדש ולבדוק שוב, עד שגובה השורה נוח לקריאה בדפדפן (לא צפוף / לא מרווח מדי)


3. מירכוז

הבעיה: פונט פחות אסתטי כשהוא לא מתמרכז לכפתורים בדפדפן, ונדרש מאמץ מצד מפתחי האתרים כדי לסדר זאת - כאשר יכלנו למנוע את הבעיה מראש בקובץ הפונט.
מטרה: למרכז את הפונט לכפתור (לגובה), כך שהמרחק העליון והתחתון יהיו תואמים.
הסבר: המירכוז מושפע מ־Ascender/Descender
פתרון:
פונט נמוך? להעצים Descender (למשל מ־500- ל־700-)
פונט גבוה? להעצים Ascender (למשל: מ־700 ל־955)

הפונט שלך אבגדהוזחט יכךלמםנןס עפףצץקרשת