הקמפוס של קואליקס

לקבוצת התמיכה לרשומים במכללה

הקמפוס גם בווטסאפ

לקבוצת התמיכה לרשומים במכללה

JavaScript SEO: רינדור דינאמי

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

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

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

בגדול? הדפדפן טוען את התוכן. לא תמיד גוגל.

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

אבל אתרים עם JavaScript – במיוחד כאלה שעושים הכל דינאמי (כלומר, טוענים את התוכן אח”כ בעזרת JS) – לפעמים הופכים למסיבת הפתעה שגוגל לא באמת הוזמן אליה.

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

אז מה זה בכלל רינדור דינאמי?

רינדור דינאמי (Dynamic Rendering) זה פתרון ביניים. הרעיון הוא פשוט: לבני אדם – כלומר, למשתמשים רגילים – האתר ממשיך להיטען רגיל, עם JavaScript וכל השיט.

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

וככה גוגל מקבל את מה שהוא אוהב – HTML מוכן, ארוז, יפה כמו סלייס של עוגת תפוחים ביום שישי.

וואלה, נשמע טוב – אז למה לא כולם עושים את זה?

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

וגם: מדי פעם דברים נופלים, הבוטים מקבלים חצי תוכן, או מישהו שוכח לעדכן משהו. לא אחת ראיתי אתר שלקוח משוכנע ש”גוגל רואה הכל”, ובסוף מסתבר שהוא לא רואה כלום – פשוט כי הבוטים קיבלו דף ריק עם <div id="app"></div> וזהו.

שמול משתף מהשטח

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

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

אז מה עושים?

אם אתה בונה אתר עם מסגרת כמו React, Angular, Vue וכל שאר השמות היפים – תבדוק מה קורה כשבוט של גוגל נכנס. יש כלים לזה, כמו Mobile-friendly test, או “Inspect URL” ב-Google Search Console.

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

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

משהו אחרון לקחת איתך

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

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

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

אודות שמול

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

פוסטים אחרונים

סרטון חשוב להכיר