גופנים
טיפוגרפיה היא יותר ממילים בלבד על דף; היא אלמנט בסיסי השזור במארג זהות המותג שלנו. הגופנים שנבחרו בקפידה שלנו הם השגרירים השקטים של המסר שלנו, ומציעים קול עקבי ומזוהה בכל התקשורת שלנו.
קישורים מהירים:
מעבר להעברת מידע, הגופן שלנו מגלם את מהות המותג שלנו - שילוב הרמוני של ניקיון, מודרניות ומקצועיות. בחלק זה, נחקור לא רק את הגופנים בהם אנו משתמשים, אלא גם את העקרונות המנחים את יישומם, ומבטיחים ייצוג חלק ומשפיע של המותג שלנו בכל אינטראקציה.
מערכת הטיפוגרפיה שלנו נועדה להיות גמישה, ומציעה הנחיות זורמות הניתנות להתאמה למדיום מגוונים; לכל ערוץ יש מפרטים ייחודיים, המותאמים מהמערכת הכוללת שלנו לייצוג מותג מגובש אך מותאם אישית.
סימפלון
פלטת הצבעים העיקרית שלנו בונה את עיקר הקריאייטיב שלנו וצריכה לייצג את הגוונים החזקים ביותר בכל פריט.
נוֹרמָה
תת-משפחת הגופן Norm היא הגופן העיקרי שלנו והיא מגיעה ב-8 משקלים.
מונו
למרות שיש קבוצה מלאה של תווים מונו, היא משמשת רק עבור מספרים במשורה.
רובוטו
רובוטו משמש במקרים בהם סימפלון אינו יכול. אם גופן מערכתי הכרחי או נדרש לחלוטין, רובוטו הוא גיבוי מקובל.
שימוש ויישום
חקרו דוגמאות לשימוש ויישום להלן, בהן אנו מתארים דרכים נכונות ושגויות לשימוש במערכת הגופנים והטיפוגרפיה שלנו. בקצב העיצוב שלנו, תוכן וטיפוגרפיה משתפים פעולה כמו ריקוד מתואם היטב. כללים אלה מנחים כיצד הסוג החזותי ועיצוב התוכן פועלים יחד, ומבטיחים שהם משלימים זה את זה לשילוב מושלם של קריאות, אסתטיקה וזהות מותג. חלק מהאתגרים החזותיים עשויים להיפתר באמצעות שינויים בתוכן וחלק מאתגרי התוכן דורשים פתרונות חזותיים.
אמנם תיתקלו בהנחיות קונספטואליות, אך מפרטים מדויקים נעדרים במכוון עקב האופי המגוון והדינמי של המדיומים שהמותג שלנו כולל. מחלקות, כמו דפוס או עיצוב אתרים, קובעות את המפרטים שלהן על סמך עקרונות מנחים אלה כדי להתאים לשיטות העבודה המומלצות של כל מדיום.
השתמשו בגופן Simplon Norm Bold בגדלים גדולים כדי לעזור להצהרות ההרואיות והחזקות שלנו לעשות רושם גדול.
השתמשו בגופן Simplon Norm Bold בגדלים גדולים כדי לעזור להצהרות ההרואיות והחזקות שלנו לעשות רושם גדול.
תנו לכותרות גדולות הרבה מקום פנוי. תנו למסר לדבר בעד עצמו מבלי להיפגע מגרפיקה מיותרת או מקרבה לתוכן אחר.
הצהרות השפעה גדולות ומודגשות צריכות להיות קצרות; 3-5 מילים לכל היותר. ניתן להשתמש בסימון כדי ליצור דרמה עם נקודה או שאלה. יש להשתמש בסימון ובקטגוריית משפטים תמיד יחד ולא בשילוב.
לפעמים אנחנו צריכים לומר אמירה חזקה שאינה בת 3-5 מילים. השתמשו בגופן רגיל אך שמרו על גודל גדול, ריווח, פיסוק ורישיות/קטנות.
כותרות והצהרות השפעה הן גדולות בגודלן ודורשות גובה שורה צר יותר מאשר גוף הטקסט. מומלץ גובה שורה יחסי של 100% לגודל הגופן, אך ניתן להתאים זאת בהתאם למדיום. יש להימנע ממתיחה של גובה שורה ומדחיסת גובה שורה לנקודה שבה שורות יורדות ועולות נוגעות בטקסט המשפיע.
כותרות והצהרות השפעה הן גדולות בגודלן ודורשות גובה שורה צר יותר מאשר גוף הטקסט. מומלץ גובה שורה יחסי של 100% לגודל הגופן, אך ניתן להתאים זאת בהתאם למדיום. יש להימנע ממתיחה של גובה שורה ומדחיסת גובה שורה לנקודה שבה שורות יורדות ועולות נוגעות בטקסט המשפיע.
אל תשתמשו בגופן המודגש שלנו בגדלים קטנים יותר, מכיוון שזה יגרום לבעיות קריאות ככל שהדף קטן יותר. עלינו לשמור על רמת ניגודיות וסדר גבוהים בתוכן, לכן השתמשו בגודל, צבע ועובי כדי להפוך את הדף לנוחה לקריאה.
אל תשתמשו בטיפול אימפקטי כדי לציין את המובן מאליו. השתמשו בקווים עליונים, כותרות משנה או סמיכות כדי לשמור על הבלוקים הללו בהקשר.
החלק הבא
היררכיה חשובה
לא הכל יכול להיות הדבר הכי חשוב. השתמשו בטיפוגרפיה כדי להנחות את המשתמש ולהפוך את היצירה לסריקה מהירה או לצלילה מעמיקה ונוחה.
כותרות משנה מהירות לקריאה ולסריקה
אל תנסו להגזים בכותרת משנה בדומה לכותרת. תנו למשתמש את הגזר או את פירורי הלחם כדי שיוכל לקרוא עוד אם יבחר בכך. השתמשו בכותרות לאורך הקטע כסמני דרך בסיפור. אם המשתמש יגלול את כל העמוד או סורק עמוד וקורא רק את הכותרות, האם הוא יבין את הנחת היסוד של הסיפור? האם הוא יוכל למצוא במהירות את מה שחשוב לו?
כותרות משנה צריכות לפעול לפי אותם כללי פיסוק וקטנות/רישיות כמו כותרות ראשיות.
יהיו מקרים שבהם תצטרכו ליצור משפט משני או מקונן. השתמשו באותם עקרונות עבור כותרות משנה אלו. בדיוק כמו משפטי השפעה גדולים יותר, השתמשו בצבע, משקל וגודל כדי ליצור מספיק ניגודיות והיררכיה ביצירה שלכם. לא רק בגלל שהיא נראית יפה, אלא גם בגלל שהיא קלה יותר לקריאה.
חשיבות ההיררכיה
השתמשו בכל הכלים בארגז הכלים של המותג כדי לגרום לסיפור לזרוח.
סוג נקי מראה על המומחיות שלנו.
- גובה שורה – גובה השורה עשוי להשתנות ויהיה צורך בכך בהתאם למדיום ספציפי. כדי שגופן הטקסט יהיה נגיש, נוח וקריא, התחילו עם גובה של 130% ולעולם לא גדול מ-155% מגודל הגופן שלכם. טקסט הכיתוב עשוי להיות צפוף יותר, אך גופן הטקסט לעולם לא צריך להיות צפוף מ-100%. יצירה טכנית עשויה לדרוש כמות משמעותית של תוכן בחלל מוגבל, בעוד שיצירה שיווקית צריכה תמיד להיות ברורה ופתוחה לעומת עומס תוכן.
- גובה פסקה – בדומה לאמור לעיל, תצטרכו לוודא שזה מתאים לתוכן ולמדיה. עם זאת, מומלץ להשתמש בגודל של בין 100% ל-140% מגודל הגופן שלכם.
- עיצוב מוטבע – עיצוב מוטבע יכול להוסיף דגש או מיקוד לגוף טקסט גדול יותר. השתמשו בטכניקות אלו במשורה ונסו להדגיש רק את המילים המעטות המרכזיות.
אם עלינו להדגיש מחשבה או משפט שלם, נסו לעבור לשורה חדשה לגמרי.
השתמשו בצבעי גופן כדי ליצור חוויית קריאה נוחה והשתמשו בצבעים המעוררים פעולה. לעולם אל תשתמשו בצבע פעולה ככותרת. שמרו את הכחול שלנו לפעולה וקישורים והימנעו משימוש בגופן סטטי. הקפידו לעיין בהנחיות הנגישות הבאות לקבלת דרישות ניגודיות גופן מתאימות.
נְגִישׁוּת
כדי להבטיח שכמה שיותר לקוחות שלנו יזכו לחוויה עקבית, אנו תמיד רוצים להישאר נגישים ככל האפשר. דרך אחת לעשות זאת היא על ידי דבקות בהנחיות WCAG 2.1 ליחסי ניגודיות בטקסט.
למטה תראו את יחס הניגודיות המינימלי המקובל עבור הפלטות העיקריות שלנו כצבעי רקע. מעליו יוצגו צבעי טקסט מקובלים שונים מהפלטה שלנו. ב"מינימום" אנו מתכוונים לזהות את הטקסט הבהיר ביותר על רקעים בהירים יותר שניתן להשתמש בהם כדי לעמוד בתקני AAA. ניתן להשתמש בצבע זה, כולל כל צבע כהה יותר בקבוצת הגוונים. ולהיפך עבור רקעים כהים ושימוש בטקסט בהיר יותר.
שימו לב שאם צבע הטקסט מוצג בגופן מודגש, הוא יעמוד רק בתקני AA ויש להימנע ממנו ביישומים עם גופנים קטנים וקלי משקל.
אנו מציגים רק צבעי טקסט מומלצים. גוונים של סגול, כתום, צהוב ותכלת אינם מומלצים לטקסט.
ניטרליים
הטקסט שלך יכול להיות כהה יותר מכל אחד מהגוונים המפורטים להלן.
חֵיל הַיָם
הטקסט שלך יכול להיות בהיר יותר מכל אחד מהגוונים המפורטים להלן.
כְּחוֹל
הטקסט שלך יכול להיות בהיר יותר או כהה יותר מכל אחד מהגוונים המפורטים להלן, תלוי באיזה מחצית של הפלטה אנו משתמשים.
