עיצוב אתרי פאראלאקס ספטמבר 2012 פרקים במאמר:

עיצוב אתרי פאראלאקס

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



אתרי הפאראלאקס מוכיחים אחרת. לפעמים יותר זה יותר...

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

היתרונות של בניית אתר פאראלאקס

האנימציה היא בסיסית, אבל מעניקה מספר יתרונות מובהקים:
  • 1) בניית אתר הפאראלאקס עושה רושם! אחרי שהתרגלנו לאתרים נייחים - החשיפה לתנועה באתר מרעננת ומפתיעה, ומשדרת "השקעה" "יצירתיות" ועדכנות.

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

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

החסרונות של בניית אתר פאראלאקס

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

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

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

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

דוגמא לעיצוב אתרים בסגנון פאראלאקס

פאראלאקס ואני

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

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

עיצוב אתרים