באחד המאמרים הקודמים כתבתי על איך להתקין AMP ב- 30 שניות? ומה התעשייה חושבת על זה? בסוף חודש מאי פורסם באתר האינטרנט של פרויקט ה- AMP על קלאסים חדשים ב- CSS המאפשרים תפריטים, אמצעי שיתוף ודינאמיות (מיד אסביר). התוספות החדשות מאפשרות למפרסמים יותר גמישות בעיצוב ה- Look & Feel של העמודים, ועדיין שמירה על העיקרון החשוב ביותר שהעמודים האלו מקדשים – טעינה מהירה במובייל. מסתבר כי נמצא שתוכן איטי, משפיע המון על גולשים – 40% מהמשתמשים נוטשים אתר שלוקח לו יותר מ-3 שניות להיטען (Kissmetrics).

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

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

 

מן הראוי לציין, שנכון לעת כתיבת שורות אלו, עדיין פרוייקט ה- AMP לא פעיל בישראל.

הנה הפיצ’רים החדשים (לקריאה נוספת):

 

<AMP-SOCIAL-SHARE>

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

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

<amp-social-share> מספק כפתורים קלים להטמעה המשתפים את העמוד הנוכחי עם סט של פלטפורמות שיתוף פופולאריות. סט קטן אך מתעצם של ספקים-מובנים מאפשרים לכם לעשות זאת. כיום, מתכנתים יכולים להתאים את הקוד לצורכיהם על מנת להכיל שם גם פלטפורמות שאינן עדיין חלק מהסט ההולך ומתגבש. אני מציע לכם לבדוק את התיעוד של <amp-social-share>.

 

<AMP-SIDEBAR>

פיצ’ר המאפשר תפריט המעוגן לצד המסך, שיפתח בעת החלקה הצידה של אצבע המשתמש. לפני שפרויקט ה- AMP הכניס את כל נושא התפריטים היו כל מיני “קומבינות” שניסו באמצעות תכנות צד שלישי לאפשר את התפריטים עבור הגולשים. אבל הרבה יותר הגיוני שאם המשתמש הפוטנציאלי שלכם כבר נכנס לתוכן, סביר שיעניינו אותו גם תכנים נוספים ולא רק המאמר שהוא פתח כרגע. <amp-sidebar> הוא קונטיינר זמין ומיידי, שלעולם לא יחסום לכם את התוכן כשאינו נחוץ לכם. כאשר תלחצו על התפריט הוא יופיע מהצד, ושוב יעלם כשתלחצו פעם נוספת; דיי דומה בפונקציונליות שלו לתפריט ההמבורגר הידוע. בגוגל טיפלו לאחרונה בכל מיני התנהגויות מוזרות המתרחשות בגלל השוני בין דפדפנים והאופן בו הם מבינים את הקוד. משהו מעניין – הם דאגו לאפשר התאמות עיצוביות, כמו שקיפות התפריט. מומלץ לבדוק את התיעוד של <amp-sidebar> וגם דוגמה של קוד לקונטיינר הזה.

 

<AMP-ACCORDION>

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

 

<AMP-DYNAMIC-CSS-CLASSES>

פיצ’ר המאפשר למפרסמים לייצר Look & Feel לעמוד על-פי המקור המפנה. ג’ניפר סלאג (thesempost.com), מציינת שהפיצ’ר הזה עדיין בשלבי בדיקה, ולכן, במקרים מסוימים לא תמיד יעבוד ועשוי לגרום לקריסות של העמוד. למעשה, הפיצ’ר הזה מאפשר למפרסמים לשלוט ולעצב בקלות אלמנטים עיצוביים בהתבסס על העיצוב של המקור המפנה או בהתבסס על ההקשר. בין אם הגולשים לחצו על קישור מאתר של פרטנר ספציפי או הגיעו לאתרכם מפלטפורמה חברתית, מפרסמים יכולים כעת לעצב את התוכן של עמוד הנחיתה בצורה שונה. כמו-כן, מפרסמים יכולים להשתמש ב- <amp-dynamic-css-classes> כדי לעצב עמודים בצורה שונה בהתאם להאם הם מוצגים בתוך ה- viewer, כקרוסלת “סיפורים מובילים” במנוע החיפוש.

 

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

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

 

 

מחולל סכמות (Schema Creator)

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

סכמת מתכונים

 

יש הרבה Schema Creators אי-שם ברחבי הרשת, אמנם יש להם כמה חסרונות:

  1. הם לא עדכניים
  2. הם מוגבלים בכמות ה- properties שהם מאפשרים
  3. הם לא בעברית 🙂

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

מחולל סכמות

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

אודות הכותב

SEO Expert at 888 Holdings

עופר לנגר, בוגר תואר שני באוניברסיטת ת"א בפקולטה לתקשורת, כיום משמש בתפקיד SEO Expert בחברת 888 אחזקות, כמי שאמון על אסטרטגיית ה- SEO של הארגון. בעבר היה VP of SEO Services ב- Angora Media Group. במסגרת תפקידו כמנהל תחום קידום אורגני, היה אחראי על קידום תאגידים כמו תנובה, דואר ישראל, תאגיד התקשורת בינת, מיטב דש, אמריקן לייזר, השף הלבן ועוד.

  • נמרוד דקר

    כל הכבוד עופר , מחכה לכלי שלך בצפייה

  • דפנה

    איזה יופי שאתה בונה סכמה! היא הרבה יותר ידידותית למשתמש! 🙂