כבר כמה חודשים שאני רוצה לחשוף אחד מה"נשקים הסודיים" שלי להאצת אתרים ("שיפור זמן טעינה") – פרמטר שעם הזמן נעשה יותר ויותר חשוב ב 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), וגם גיליתי שזה פועל שונה בדפדפנים שונים. לפעמים זה אפילו לא באמת הופך לכפתור אמיתי (אבל לחיצה על האייקון מקפיצה פופאפ של שיתוף). אני לכל הפחות מסמן פה כיוון ואומר שכדאי לשים לב לדברים האלה. נשבע לכם שחסכתי כמעט שנייה מטעינה של כל עמוד באתר בזכות הדבר הזה, וזה המון.