עיצוב אתרי פאראלאקס ספטמבר 2012 פרקים במאמר:
  • ג. בניית אתר פאראלקס - על גבול הגוזמה

בניית אתר פאראלקס - על גבול הגוזמה

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

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

הפריים הראשון באתר בגיגייה

בניית אתר פאראלקס - המוצר

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

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

ומה עם המסרים?

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

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

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

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

ונחזור לאתר:

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

שוב, יכול להיות שזה בסדר.

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

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



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

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

- אבל איפה תמצא מעצב אתרים בוגר?

עיצוב אתרים וורדפרס
את/ה מוזמן/ת ליצור קשר ולשמוע איך אפשר לרתום את כח הפאראלקס לשירות אתרך. (pdf, zip)

עיצוב אתר