Parallax – האם כדאי לשלב באתר?

השימוש טכניקת Parallax (פרלקס) צובר תאוצה ככול שמפתחים יותר אתרי גלילה (Scrolling Websites) ופותח בפני מתכנני חווית המשתמש (UX) ומעצבי ממשק המשתמש (UI) לחרוג מעולם העיצוב השטוח ולכלול במסגרת עיצוב האתר גם דינאמיקה של אלמנטים שונים.

26/11/2014

כבר לא מפחדים מעמודים בעלי גלילה (Scroll)

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

החופש ליצירתיות שניתן למתכנני חווית המשתמש הוביל בין השאר להקמת אתרי אינטרנט בעלי עמודים עם גלילה אנכית (Scrolling Websites) ואף לאתרי אינטרנט בעלי עמוד אחד (One Page Website) כאשר בכל עמוד מידע מרוכז שפע של תכנים הרלוונטיים לנושא באופן שמעניק לגולש חווית מידע מרוכזת ללא צורך למעבר בין מספר עמודים.

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

שיטת הניווט וההתמצאות בעמודים נגללים (Scrolling Pages)

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

מהו ?Parallax

המונח Scrolling Parallax מגיע מבוסס על המונח Motion Parallax מעולם הפסיכולוגיה הקוגניטיבית המגדיר את האופן בו אנחנו מנסים להגדיר את המרחק והיחסים בין עצמים במרחב – אנו מתמקדים בעצמים אשר ממוקמים בקרבתנו ונמצאים בתנועה יותר מעצמים מרוחקים ונעים לאט. באופן זה נוצרת אצלנו תחושת עומק. זו בדיוק התכונה שאתרי Parallax מנסים לנצל.

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

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

אתרי Parallax משלבים תנועה על גבי צירים – אופקי, אנכי ולעיתים גם אלכסוני ויוצרים חווית רעננה ומפתיעה בקרב הגולשים באתר אשר נחשפים לתוכן "חי" ו- "מגיב".

בכדי לחוש את החוויה המועברת באתרי Parallax תוכלו לבקר באתרים כדוגמת Boy-Coy, Oakley, Nasa, Sony ואפילו אתר סיכום המלחמה בעיקר של הבית הלבן.

אז תמיד לדרוש Parallax?

מרחב התמרון של מעצבי חווית משתמש אדיר והבחירה באתרים בעלי גלילה (Scrolling Websites), אתרים בעלי עמוד אחד (One Page Website) ושילוב של Parallax הנם רק חלק מתוך מגוון הכלים שעומדים לרשות מעצב האתר.

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

כמו כן יש לקחת בחשבון כי תכנון ופיתוח של רכיבי Parallax מוסיף על עלות ההקמה של האתר והתחזוקה שלו באופן משמעותי.

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