מ 3.5 ל 1.5 שניות באפס זמן

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

רקע כללי

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

כמה מהר זה מהר?

ההמלצה של גוגל:

  • 2 שניות זמן מקסימלי לטעינה של עמוד
  • 0.2 שניות לזמן תגובה (TTFB – הזמן שלוקח לשרת לשלוח את הבייט הראשון)

איך מודדים זמן טעינה?

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

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

בואו נדבר תכל'ס

כתבתי כבר פוסט על תוספים מומלצים לוורדפרס יש שם המלצה גם על תוספי Caching כגון:

  1. WP Super Cache – תוסף Cache חינמי ונחמד (מאיץ את טעינת האתר ע"י יצירת גרסה סטטית של כל דף באתר והגשתה לגולש במהירות).
  2. WP Rocket – תוסף Cache + דחיסה וצמצום קבצי JS ו CSS. אפילו יותר נחמד ופופולרי שמחליף את ה WP Super Cache (התוסף בתשלום).

ממהר, לממש מהר, בכלום כסף

אני רוצה סופסוף לספר לכם איך לקחתי אתר שלי שהיה כבר בין המהירים בנישה שלו והפכתי אותו להכי מהיר בנישה שלו (זה חלק מהמשוואה אם רוצים לנצח את התחרות ב SEO). ירדתי מ 3.5 ל 1.5 שניות.

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

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

הפתרון: CDN בזול, רבותיי, CDN !

שירותי Content Delivery Network מאפשרים להעלות בצורה פשוטה תוכן מהאתר שלכם לשרתים הפזורים ברחבי העולם כשכל תכליתם היא "לירות" את התוכן הזה במהירות שיא אל הדפדפן ברגע שהם מתבקשים.

היתרונות של שירותי CDN

  • הפחתת העומס מהשרת (השרת מתפנה להתעסק בעיבוד קוד!)
  • התקנה חד פעמית פשוטה יחסית
  • עבודה עם subdomains – מאפשר לדפדפן לטעון את האתר שלכם בכמה ערוצים מקביליים
  • מכל מקום שתגלשו בעולם תקבלו את הנתונים מהשרת הקרוב ביותר אליכם.
    זה מעולה לציון המהירות הכללי של האתר.

מה עושים עם זה?

שירות CDN מתאים במיוחד לתמונות, קבצי CSS, וקבצי JS, ולכל סוגי הקבצים הסטטיים (להבדיל מ ASP, PHP וכו' שדורשים עיבוד).

מי צריך את זה?

שירותי CDN נמצאים איתנו מזה כמה שנים, אבל עד כה השימוש היה מוצדק בעיקר עבור אתרי תוכן גדולים… היום זה כבר ממש זול ונגיש אז למה שלא תשתמשו בקצת טכנולוגיה טובה על מנת לגבור על המתחרים ב SEO? 😉

אני עשיתי את המהלך הזה ורק טוב יצא לי מהסיפור.

שירות CDN שאני באופן אישי משתמש בו לאתרים שלי וממליץ עליו בפה מלא נקרא keycdn

יתרונות:

  • התנסות בשירות ללא עלות או התחייבות
  • לאחר מכן עלות לכל ג'יגהבייט של תעבורה עולה 15 אגורות (גרושים!)
  • שרתים מהירים ומאובטחים

איך זה עובד? יש להם מדריך התקנה מעולה

לאתר תוכן רגיל ההתקנה מאוד פשוטה:

  • הגדרת אתר במערכת (לבחור שרת מסוג pull)
  • יצירת "Zone" לאתר שלך כדוגמת:
    your-site-4234d72.kxcdn.com

לוקח לזה 2 דקות ומאותו רגע יש לכם העתק של כל האתר
אבל מה שמעניין אותנו הם הקבצים הסטטיים, כגון:
http://yourwebsite.com/assets/css/style.css
שעכשיו ירוץ גם מהכתובת החדשה שקיבלתם:
http://yourzone-1c6b.kxcdn.com/assets/css/style.css

כל זה עובד נהדר עם תוסף שיפור מהירות לוורדפרס שתומך ב CDN – כגון wp rocket
שיודע לקחת כתובת URL של CDN כגון http://yourzone-1c6b.kxcdn.com
ולטעון ממנה את כל קבצי ה CSS שלכם או את כל התמונות! ׁ(אתם מגדירים). זה אדיר, אני אומר לכם.

מומלץ לעבוד עם כ 3-4 כתובות שונות (CNAMES) מהן נטענים הקבצים הסטטיים, כך אתם יוצרים טעינה מקבילית* ומואצת עוד יותר. KeyCDN מאפשר ליצור מספר כתובות (CNAMES) ע"י יצירת מספר "Zones"
* למי שרוצה להבין קצת יותר: רוב הדפדפנים מסוגלים באופן טבעי לטעון מקסימום 4 קבצים ברגע נתון (CSS JS PNG וכו'). זה בעייתי אם יש הרבה תמונות וסקריפטים לטעון. הפתרון שמצוין פה, מעבר לכך שהוא עושה שימוש בשרת מהיר נוסף, הוא גם מגדיל את התקרה ל 12-20 קבצים שנטענים במקביל.

אגב, יש אצלם גם אפשרות לקבל כתובות אסתטיות יותר כגון cdn.your-domain.co.il
זה נקרא "Zonealiases" ומצריך עריכת הגדרות DNS על השרת המקורי שלכם.

בקיצור, אתם מוזמנים לגלות את הקסם הזה שנקרא CDN ולהשתמש בו למטרותיכם

טיפ לסיום:

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

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

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

11 תוספים לוורדפרס שעזרו לי להגדיל את התנועה ב 1,790%

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

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

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

לפניכם רשימת התוספים שעזרו לי להגדיל תנועה לאחד האתרים שלי ב 1,790%

זה קרה בשנה וחצי ( וכלל גם עבודה על תוכן וקישורים… ) אבל התוספים הם חלק בלתי נפרד מההצלחה…
והאמת היא שהעליות התחילו די מהר ( כפי שניתן לראות ) :

gethigh-graph

תוספי SEO לוורדפרס

כולם חינמיים פרט ל WP Rocket

  1. יוסט SEO – תוסף נהדר שמאפשר עדכון והוספה של תגיות חשובות כגון TITLE (כותרת דפדפן) בקלות. בנוסף, יוסט נותן לכל עמוד "ציון" בהתאם למילות המפתח החשובות לכם ובהתאם אף מציע פתרונות לבעיות נפוצות. התוסף מכיל שלל אפשרויות נוספות כגון ייצור מפת אתר עבור מנועי חיפוש, הגדרת הנראות בעת שיתוף ברשתות חברתיות ועוד.
  2. SEO Friendly Images – מוסיף אוטומטית תגיות ALT ותגיות כותרת לכל התמונות באתר – עוזר לנוכחות האתר בגוגל תמונות ולתקינות הקוד.
  3. Related Posts – מציג פוסטים קשורים מתחת לכל פוסט – זה עוזר לגולשים למצוא תוכן מעניין ולהישאר באתר ותורם ל SEO בזכות הוספת קישורים פנימיים.
  4. Image Lazy Load – טוען תמונות רק כאשר באמת "מסתכלים עליהן" – תורם רבות לשיפור מהירות האתר (שזה טוב ל SEO).
  5. WP Super Cache – תוסף cache נחמד (מאיץ את טעינת האתר ע"י יצירת גרסה סטטית של כל דף באתר והגשתה לגולש במהירות).
  6. WP Rocket – תוסף Cache אפילו יותר נחמד ופופולרי שמחליף את ה WP Super Cache (התוסף בתשלום).
  7. All 404 Redirect to Homepage – ביצוע הפניות אוטומטיות מכתובות (URLs) ישנות לחדשות. לעולם לא יהיו לכם שגיאות 404 "דף לא נמצא" !
  8. Redirect List – ביצוע הפניות מדויקות מכתובות (URLs) ישנות לחדשות.
  9. Revision Control – מגביל את כמות הגרסאות הישנות הנשמרות אוטומטית עבור כל עמוד/פוסט (וכתוצאה מכך מאיץ את האתר).
  10. Udinra All Image Sitemap – תוסף שיוצר "מפת אתר" נפרדת עבור תמונות – עוזר לנוכחות בגוגל תמונות.
  11. WordPress Social Ring – אמנם לא קשור ישירות ל SEO אבל מאפשר לגולשים לאהוב ולשתף את הדף במדיה חברתית – ובעקיפין תורם מאוד ל SEO.

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

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

נ.ב. בדיקת מהירות פשוטה אפשר לבצע פה   (או פה)    (או פה)

עד 2 שניות טעינה = מדהים !!! (לא לגעת)
עד 4 שניות טעינה = סחתיין (יש מה לשפר)
עד 6 שניות טעינה = אוקי (יש בהחלט מה לשפר)
מעל 6 שניות טעינה = (תתכוננו לשיפוצים)

נ.ב.ב. להלן תוצאה של בדיקת מהירות שביצעתי על האתר המדובר:

בדיקת מהירות

מדובר בפורטל די כבד ועדיין הוא עולה יחסית מהר (פחות מ 2 שניות…)

בהצלחה!

אם הסתבכתם אנחנו פה.