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

כמה מחשבות שלי על whitespace – הריווח הזה שתופס את תשומת הלב שלנו, ועל ארגון מידע בדף.

צילום המסך השבועי לילד

כך נראה הדף של גוגל כשהוא נטען:

הממשק הנעלם: ככה הדף נטען

הממשק הנעלם: ככה הדף נטען (לחצו להגדלה)

וככה זה אחרי שהעכבר עובר עליו – העמוד שאנחנו רגילים אליו:

הממשק הנעלם: ככה הדף נראה אחרי שהעכבר עובר עליו (לחצו להגדלה)

הממשק הנעלם: ככה הדף נראה אחרי שהעכבר עובר עליו

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

גימיק או שינוי אמיתי?

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

העובדה שהדף לבן למעט תיבת החיפוש מושכת את העין בצורה מאוד משמעותית. יש פה שימוש יפה של אפקט ה-whitespace על משיכת תשומת לב, כפי שהזכרתי בפוסט השערורייתי סקס!!! ואיך למשוך תשומת לב: חלק 1 מתוך 3. טוב, אולי לא כל-כך שערורייתי :-) העובדה שאין כמעט כלום על הדף מייצרת קשב למקום שיש בו תוכן.

 

טיגריסים בפעולה

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

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

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

whitespace-walla

צפוף וחמים בואלה (לחצו להגדלה)

עכשיו קחו את תוצאות אותו חיפוש באמזון, ותשוו ביניהם – איפה היה יותר קל לכם לאתר מידע?

אמזון - מרווח ואוורירי (לחצו להגדלה)

אמזון – מרווח ואוורירי (לחצו להגדלה)

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

תעמדו בטור ישר

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

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

היה מעניין לשמוע, אם מישהו ב-ynet קורא את המילים האלה, מה השיקולים מאחורי ההחלטה הזו.

הצילום בראש הכתבה הוא של LWY והטיגריסים של fPat