בית › מרכז הידע › למה אנשים לא פונים
איך אנשים מחליטים · UX וקופימדריך תפיסהיסודות

איפה העין מסתכלת קודם, ואיך מובילים אותה

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

מדריך תפיסה · הפרק השלישי · 5 דקות

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

שלושת החסמים בין המבקר לפעולה · פרק 3 מתוך 7
בלבול·מאמץ·ספקהמבקר יצא
עדיין החסם הראשון, בלבול, אבל הפעם דרך העין, לא דרך המילים.

מה תלמדו

  • איך העין באמת סורקת מסך
  • למה "הכול חשוב" הורס בהירות
  • איך גורמים לדבר אחד לבלוט
  • מבחן פשוט לבדיקת היררכיה

מתאים במיוחד אם

  • יש לכם מסך עמוס שקשה לעכל
  • הכפתור החשוב "נבלע" בעמוד
  • ניסיתם להבליט הכול, וזה יצא שטוח
  • אנשים לא מגיעים לפעולה שרציתם
בקצרה: היררכיה ויזואלית היא הסדר שבו העין קולטת את הדברים על המסך. גודל, ניגודיות ומרחב מחליטים מה נראה ראשון ומה מחכה. עיצוב טוב לא מבליט הכול, הוא מחליט מה הדבר האחד שצריך לקפוץ לעין, ונותן לכל השאר להיות שקט. כשהכול צועק, שום דבר לא נשמע.
אותו עמוד, שני סדרי חשיבות
לאן העין שלכם הולכת קודם בכל אחד מהם?
❌ הכול באותו משקל
אודותפתרונותצור קשרבלוגמחירים
קבלו הצעה
🤔לאן להסתכל?
✅ דבר אחד בולט
אודותפתרונותצור קשרבלוגמחירים
קבעו שיחת ייעוץ
🙂העין הולכת ישר
אותו תפריט, אותו תוכן. בגרסה השטוחה הכפתור החשוב נבלע בין הקישורים, בגרסה עם ההיררכיה הוא היחיד שבולט. מובילים את העין, לא מקווים שתמצא לבד.

המיתוס: שהכול יהיה בולט

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

איך העין סורקת מסך

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

מבחן העיניים המכווצות

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

  • מה הדבר הראשון שקופץ לעין?
  • הכפתור החשוב, בולט או נבלע?

אם מה שקפץ ראשון הוא לא המסר או הפעולה הראשית, ההיררכיה עובדת נגדכם.

איך מובילים את העין

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

מרחב ריק הוא לא חלל מבוזבז, הוא מה שגורם לדבר החשוב לבלוט.

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

חוק ההיררכיה

אם הכול חשוב, שום דבר לא בולט. אל תתנו למבקר להחליט לבד במה להתחיל, תחליטו אתם.

מה זה אומר לעסק

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

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

הטעות הנפוצה

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

ב-D-Office אנחנו מחליטים לכל מסך מה הדבר האחד שצריך לקפוץ לעין, ובונים את כל השאר כך שינחה אליו, לא יתחרה בו.

אם תזכרו רק דבר אחד מהמאמר

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

בדיקה של 30 שניות
  • יש נקודה אחת ברורה שהעין פוגשת קודם?
  • הפעולה הראשית בולטת בצבע ובגודל?
  • יש מרחב נושם סביב מה שחשוב?
  • במבחן העיניים המכווצות, קופץ הדבר הנכון?
עיקרון 3 מתוך 7 · UX וקופי
✔ היררכיה היא להחליט מה בולט, כדי שהעין תדע לאן ללכת.

מושגים שהוזכרו

היררכיה ויזואליתנקודת מיקודניגודיותמרחב לבן
הפרק הבא · פרק 4 מתוך 7איך בונים אמון באתרהחסם השני, ספק. למה אנשים לא משאירים פרטים אצל מה שנראה מפוקפק
שאלות נפוצות

שאלות ותשובות על היררכיה ויזואלית

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

כשמישהו נכנס לאתר שלכם, לאן העין שלו הולכת קודם?

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

בואו נסדר את העמוד