gemplanLogo

הופכים את אתר הוורדפרס ל- PWA!

1 min read

הופכים את אתר הוורדפרס ל- PWA!

תוכן עניינים:

1 min read

תוכן עניינים:

כבר בשנת 2018 יותר ממחצית הטראפיק לאתרי אינטרנט הגיע מהמובייל. גדילה של 50.3% משנת 2017. בשנת 2022 רוב הטראפיק מגיע מהמובייל.

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

התשובה היא – אפליקציית ווב – Progressive Web Apps

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

מה צריך כדי להפוך אתר ל PWA?

בצעו התאמה לפי הצ’קליסט של גוגל ל- PWA

גוגל יצרו צ’קליסט שמאגד את כל המרכיבים הבסיסים שצריך כדי להיות PWA. הצ’קליסט של גוגל ליצירת PWA:

האתר מוגש באמצעות HTTPS

  •       הדפים בטאבלט ובנייד רספונסיביים
  •       כל כתובות האתרים נטענות גם במצב אופליין
  •       מטא דאטה מסופקים כדי להוסיף למסך הבית
  •       טעינה ראשונה מהירה גם במצב G3
  •       האתר עובד בדפדפנים שונים
  •       מעברים בין עמודים לא מרגישים שהם חוסמים את הרשת
  •       לכל דף יש URL

תוכלו להשתמש גם ב- Lighthouse tool של גוגל כדי לאמת את רוב הפריטים ברשימה בצורה אוטומטית ולא לעשות את זה ידנית אחד אחד.

יצירת PWA מושלם!

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

צקליסט חובה ל- PWA  מושלם:

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

פרונט אנד אפליקטיבי

וורדפרס הינה מערכת מבוססת PHP. אפשר להפוך את אתר האינטרנט ל PWA גם על בסיס פרונט אנד שכתוב ב-PHP אך זה יגרע מחווית השימוש האפליקטיבית. כדי לייצר חווית אפליקציה ברמה גבוהה יותר, מומלץ לבנות את הפרונט אנד בשפת פיתוח מבוססת Java Script  כגון  AngularJS, React or Vue. לכל שיטה יש את היתרונות והחסרונות שלו, תלוי מה אתם מחפשים. וורדפרס עובד מצויין עם React ויש יותר ויותר התאמות ופלאגינים שתומכים בשילוב הנפלא הזה.

לקריאה נוספת – פרונט אנד, בק אנד ופול סטאק – מה זה אומר?

את כל אלו תוכלו לעשות ידנית דרך קוד האתר או לחלופין להשתמש בפלאגינים של וורדפרס >>

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

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

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

2 פלאגינים מומלצים לאפליקציות ווב – PWA:

  1.   Super Progressive web apps

אחד מהפלאגינים הפופולרים והקלים לשימוש!

הוא ידוע בזכות תכונות ההתאמה האישית שלו והיכולת ליצור אופליין קליברים ( caliber .)

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

יתרונות Super Progressive web apps

  • הוספת איקון של האתר ללמסך הבית
  • אפשרות לשלוח פוש נוטיפיקיישן
  • התקנה פשוטה ומהירה בוורדפרס
  • הסרה נקיה – בהסרה מתבצעת מחיקה של כל הקבצים והמידע מה DB
  • התאמה טובה למנועי החיפוש
  1. WordPress Mobile Pack

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

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

יתרונות WordPress Mobile Pack

  • הפיצרים המרכזיים קיימים בגירסה החינמית
  • השידרוג במחיר נוח ופותח עוד הרבה אפשרויות למשתמשים מקצועיים
  • תבניות הנושא מביאות look&feel אפליקטיבי שמאפשר לשפר את חווית השימוש באתר ולדמות אותו יותר לאפליקציה.
  • אפשרות לשלוח פוש נוטיפיקיישן
  • יש אפשרות לבחור אילו דפים יופיעו באפליקצית ווב ואילו לא
  • לגולשים יש את היכולת להוסיף את אתר האינטרנט הנייד שלך למסך הבית של הטלפון שלהם
  • חיבור נוח לגוגל אנליטיקס
  1. Progressive WordPress

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

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

 יתרונות Progressive WordPress

אפשרות להוסיך את אייקון האתר למסך הבית

אפשרות לגלישה אוף ליין

אפשרות לשלוח פוש נוטיפיקיישן

תמיכה ב AMP – Accelerated Mobile Pages

פרטיות – הפלאגין לא משתמש ואוסף קוקיז

אפשרות לבצע פיתוחים בהתאמה אישית על האפליקציה

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

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

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

אהבתם את המאמר? יש עוד!
הצטרפו לניוזלטר שלנו וקבלו תוכן איכותי ישירות לאימייל שלכם

Ellipse 188
asdfllasdf
Ellipse 214

בלוג

GemPlan - Tips & Tricks

Accessibility Toolbar

asdf1234ascda
Vector spark

בוא נעשה דברים מעניינים יחד

אנחנו זמינים כאן

או השאירו פרטים ונחזור אליכם

Group 1000004084
asdfasdf234