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

1. תחילה מה זה Instant View ?

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

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

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

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

מבחינה טכנית Instant View עובד בערך כך:

1. טלגרם "מתקינים" Instant View לאתרים לבחירתם.

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

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

4. כשמשתמש לוחץ על Instant View הבוט של טלגרם מחזיר לו את העותק השמור של התוכן המעניין מתוך האתר.

2. איך מוסיפים Instant View לקישור טלגרם ?

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

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

1. נכנסים לאתר https://instantview.telegram.org/ ובוחרים בתפריט בצד ימין My Templates

2. יוצרים טמפלייט חדש לפי ההוראות של טלגרם (יש הוראות באתר ותכף אדביק פה את הטמפלייט שאני יצרתי שתוכלו לקחת השראה)

3. לוחצים בצד ימין למעלה על כפתור שמירה, ואז בכרום בלבד יופיע כפתור View In Telegram

4. הכפתור View In Telegram הוא בעצם לינק בדיקה לאתר t.me. מאמרים מאתר זה תמיד מקבלים קישור Instant View ואם תסתכלו טוב תראו שהלינק כולל פרמטר url שמכיל את הקישור לאתר שלכם ממנו יצרתם את הטמפלייט.

5. מכאן החיים קלים: לוקחים את הלינק, מחליפים את הערך של פרמטר url בכל דף באתר שלכם, ויש לכם קישור עם Instant View לדף זה.

3. הטמפלייט של טוקוד

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

~version: "2.0"

body: //div[contains(@class, 'post')]/div[@class='post']/div[@class='article-tab']
site_name: "ToCode"
channel: "@tocodeil"
@set_attr(dir, "rtl"): $body
@set_attr(dir, "ltr"): //pre
@remove: //h2[@class="video-header"]
@remove: //span[@class='post-date']
@remove: //span[@class='categories']
@remove: //div[contains(@class, 'alert')]
@prepend("<a>", "href", "//meta[@property='og:url']/@content", "data-link-back", "true"): //div[@class="article-tab"]
@append("לקריאת הפוסט המקורי באתר טוקוד"): //a[@data-link-back]

כל שורה שלא מתחילה בכרוכית נקראת שורת הגדרת Property. יש די הרבה properties בתיעוד שלהם אבל במינימום אנחנו צריכים את body שזה תוכן המאמר או הטקסט הראשי מהעמוד. מאפיין channel יוצר בצורה אוטומטית כותרת עם לינק לאנשים שיוכלו להירשם לערוץ טלגרם שלכם ו site_name כנראה קובע את שם האתר.

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

4. מה הלאה

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

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