6 סיבות טובות להשתמש ב White Space

שיתוף ב facebook
שיתוף ב linkedin
שיתוף ב twitter
שיתוף ב email

בעידן בו התוכן נחשב למלך, יש פיתוי גדול להכניס כל ביט של מידע שאנחנו יודעים על נושא מסוים.
אך האם הגולשים שלנו מסוגלים לקלוט ולעבד את כל המידע הזה? כנראה שלא.
וזאת הסיבה לשימוש באחד הכלים החשובים בארגז הכלים של כל מעצב דיגיטל: white space.

מה זה white space?

White space או negative space זהו פשוט אזור ריק בעיצוב. זה הרווח בין הסקשנים, התמונות, הכפתורים, העמודות, הפסקאות או השורות.

הכוונה היא לא בהכרח לרקע לבן ריק. הוא יכול לכלול צבע, טקסטורה דפוס או אפילו תמונת רקע.

למה חשוב להשתמש ב white space?

יש סיבות טובות לכך שמעצבים משתמשים ב white space כחלק עיקרי בעיצוב שלהם. בשימוש נכון הוא יכול לשפר לא רק את העיצוב של הדף, אלא גם את השימוש והאפקטיביות שלו. במילים אחרות, white space משפר לא רק את ה (User Interface) UI, אלא גם את ה (User Experience) UX של האתר או העמוד.

הנה 6 סיבות טובות מדוע כדאי לכלול white space  בעיצוב באתר שלך:

1# קל לסרוק ולהבין

שימוש ב white space עוזר לגולש לסרוק את התוכן ומשפר בצורה משמעותית את היכולת של המשתמש להבין את התוכן.

מחקרים הוכיחו כי שימוש נכון ב white space בין שורות של טקסט ושימוש נכון ב margin (יישור) מימין ומשמאל יכולים לשפר את ההבנה של הטקסט בכ 20%.

לרווחים הקטנים הללו בין השורות, הפסקאות או בין אובייקטים בתפריט קוראים גם Micro white space.

לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית לפרומי בלוף קינץ תתיח לרעח. לת צשחמי צש בליא, מנסוטו צמלח לביקו ננבי, צמוקו בלוקריה.
לורם איפסום דולור סיט אמט, קונסקטורר אדיפיסינג אלית לפרומי בלוף קינץ תתיח לרעח. לת צשחמי צש בליא, מנסוטו צמלח לביקו ננבי, צמוקו בלוקריה.

2# פוקוס ותשומת לב

רווחים גדולים בין אלמנטים, הנקראים גם Macro white space, עוזרים להדריך את המשתמש במסע שלו בדף ועוזרים למקד את תשומת ליבו באזורים שחשובים לנו יותר.

הדוגמא מהאתר של apple.com מראה בברור מה המסר שהדף רוצה להעביר לגולש:

3# משפר את המעורבות – Engagement

 על פי מחקרים, טווח הקשב הממוצע של גולש באינטרנט הוא 6 שניות, שזה אפילו פחות ממה שיש לדג זהב (7-8 שניות).

שימוש יעיל ב white space עוזר לעיצוב להעביר את המסר במהירות למשתמש ולהגדיל את הסיכוי שהמשתמש יבצע את הפעולה הרצויה על ידי הדגשת הקריאה לפעולה (Call to action).

לדוגמא, בדף הבית של גוגל יש שימוש ניכר ב white space.
השימוש ב white space מדגיש את המטרה העיקרית של העמוד: לחפש!

4# ארגון מידע במוח

בעולם של כאוס חזותי, אחד החוקים בהם המוח שלנו משתמש לארגון מידע הוא חוק הקרבה.
החוק קובע כי עצמים הקרובים זה לזה נראים דומים או קשורים אחד שני.
ה white space עוזר למשתמשים להבין את ההגיון במידע המוצג להם.
שוליים ומרווחים נכונים בין אלמנטים עוזרים למשתמשים לארגן את המידע במוח לגבי האלמנטים המוצגים.

5# מיתוג וטון עיצובי – מאקרו ומיקרו

שימוש במיקרו ומאקרו white space בפרופורציות שונות עוזר בהגדרת האופי של עמוד האינטרנט.
אתרי חדשות הם דוגמא טובה לאתרים בהם יש שימוש ב Micro white space:

שימוש נרחב ב Macro white space נותן תחושה של תחכום ויוקרה לעמוד:

6# מנוחה ומרחב נשימה

White space מאפשר לעניינים לנוח, נותן לגולש הרגשה שיש לו מרחב נשימה ולא מציף אותו במידע.

בשתי התמונות בהמשך יש את אותו הטקסט, התמונה, והעיצוב, ומסר אחד פשוט: יש לך דואר.

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

בתמונה הימנית, לעומת זאת, המרווח הגדול מאפשר לקלוט ולעבד את המידע בצורה קלה, נעימה ומהירה יותר מבלי להרגיש עומס של מידע.

White space הוא לא אזור ריק, אלא כלי עיצובי חזק ומשמעותי.

השימוש בו מייצר שילוב בין מדע ואומנות.
שילוב white space בצורה נכונה ומאוזנת בעיצוב האתר או העמוד שלך, יהפוך את העיצוב לאפקטיבי, יוקרתי ונעים יותר.

אל תוותרו עליו!

ואם יש לך עוד שאלות, נשמע לדבר, לענות ולעזור.

אולי יעניין אותך גם..