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

מה זה בכלל אתרי פרלקס?

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

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

היתרון המשמעותי ביותר של אתרי פרלקס – הוא כמובן היתרון הויזואלי.

2 חסרונות בולטים קשורים ישירות לקידום אתרי פרלקס –

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

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

 

אתרי פרלקס לא בהכרח אומר אתרי one page

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

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

האתר של רן שמואלי

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

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

אז איך מקדמים אתרי פרלקס?  הפתרון המשולב

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

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

כמובן שקיים תמיד הפיתרון של עיצוב אתר על דף אחד (One page) – אבל כפי שכבר אמרתי – זה לא מומלץ ל- SEO.

 

אתרים המכילים דפי Infinite scroll

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

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

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

אז זה אמנם התחיל מרשתות חברתיות, אך כיום ניתן למצוא infinite scroll  באתרים רבים ברשת, למשל באתר Mashable (שהצלחתי בצילום מסך לתפוס את התפריט התחתון שלו שנייה לפני שנטען תוכן נוסף…) :

mashable infinite scroll

 

Infinite scroll ו- SEO – איפה הבעיה?

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

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

איך פותרים את זה? הפתרון של גוגל:

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

אתר עם גלילה אינסופית

 

איך עושים את זה?

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

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

בשלב שני: לקבוע כתובת URL פרטנית ומותאמת אישית לכל דף.

בשלב שלישי: שימוש בתגיות rel=prev/next ב- Head של כל דף (Pagination).  תגיות אלה יגרמו לגוגל לאנדקס את כל הדפים וגם יבהירו שמדובר בדפים שיש קשר רציף ביניהם.   אגב, התגיות הנ"ל משמשות גם לאתרי איקומרס עם דפי מוצרים רבים שמציגים מוצרים דומים.

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

 

שורה תחתונה – מה אנחנו ממליצים?

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

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

 

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

 

מה אתם ממליצים?