أداء الويب وسرعته: أفضل التقنيات

سرعة التحميل وأداء الويب على شفاه الجميع في مجتمعات تحسين محركات البحث (SEO) و webperf ، وعلى نطاق أوسع في التسويق الإلكتروني والتجارة الإلكترونية.

كما يذكرنا آندي ديفيز ، المستشار والمرجع في أداء الويب:
"السياق يؤثر على التجربة ،
الخبرة تؤثر على السلوك ،
يؤثر السلوك على عائدات الأعمال ".

لذا ، سواء كنت تحاول زيادة أرباحك ، أو تحسين محركات البحث ، أو كليهما ، فأنت ملزم بمعرفة أن الصفحات السريعة ضرورية لجودة تجربة المستخدم الخاصة بك. تساعد السرعة أيضًا في إرسال الإشارات الصحيحة إلى Google ، والتي أخذت السرعة في الاعتبار منذ تحديث تجربة الصفحة.

كما تعلم أيضًا ، يجب أن يلبي الموقع توقعات المستخدمين قبل تلبية توقعات محركات البحث. وبالتالي ، تعد سرعة العرض والتفاعل جزءًا من المتطلبات الأساسية لتجربة مستخدم عالية الجودة ، وذلك لتعزيز التفاعل والتحويلات في المقام الأول! لاحظ على سبيل المثال أنه وفقًا لدراسة أجرتها Google ، فإن 77٪ من مستخدمي الإنترنت يميلون أكثر إلى الطلب على موقع أو تطبيق يتيح لهم إنهاء عملية الشراء بسرعة.

ولكن ما هي التقنيات التي لها التأثير الأكثر وضوحًا على زوارك ، من أجل تقديم تجربة تصفح سلسة وإحساس حقيقي بالسرعة؟

فيما يلي قائمة مرجعية منظمة بواسطة أدوات التحسين ، من أجل سرعة عرض وتفاعلية أفضل.

تحسين سرعة عرض الموقع

كلما كانت الصفحة أخف ، قل الوقت الذي تحتاجه للعرض.
بالإضافة إلى تحسين الموارد ، يمكنك ضبط معدل العرض وأبعاد العناصر المختلفة التي تتكون منها الصفحة لتعزيز الشعور بالسرعة وسهولة الاستخدام. فيما يلي بعض التقنيات الأساسية:

• ضغط الصور لأكثر التنسيقات كفاءة
  يسمح لك الجيل الجديد من تنسيقات WebP (موصى به من قِبل Google) و AVIF (الذي يقدم نتائج أفضل) بتقليل وزن الصور بنسبة تصل إلى 50٪ مقارنةً بصيغة JPEG ، مع الحفاظ على الجودة المرئية المثلى. مع العلم أن وزن الصور يمثل حوالي 50٪ من وزن الصفحات ، فإنه يعد رافعة أساسية لجعل صفحاتك سريعة.
• تكييف عرض الوسائط والصور على الشاشات المختلفة
  قم بتغيير حجم الوسائط والصور وتحديد حجمها بناءً على ما إذا كان المستخدم يزور موقعك من هاتف محمول أو كمبيوتر.
• تقليل وزن موارد الصفحة
  تحسين التعليمات البرمجية الخاصة بك: التصغير (إزالة الأحرف غير الضرورية) من ملفات HTML و JS و CSS ، وضغط الموارد (تنسيقات Gzip و Brotli) ، وفي بعض الحالات التسلسل ، كلها ممارسات جيدة لتقليل وزن الصفحات ، وبالتالي الإسراع العرض في المتصفح.
• تحميل كسول
  تتمثل هذه التقنية في تحميل ما هو مرئي على الشاشة فقط ، بدلاً من تحميل الصفحة بأكملها. بمعنى آخر ، لا يوفر المتصفح سوى الجهد الضروري للغاية فيما يتعلق بما يحتاج الزائر رؤيته على شاشته.
• تحسين الخطوط
  يمكنك تحسين تنسيق الخطوط الخاصة بك (على سبيل المثال WOFF2 ، الذي يوفر 30 إلى 50٪ من حجم الملف) ، وكذلك اختيار عرض النص حتى إذا لم يتم تحميل الخط بواسطة المتصفح ، لتسريع العرض.
• تخلص من حظر الموارد وتحميلها بشكل غير متزامن
  تجنب حظر عرض صفحاتك: يفضل تحميل الموارد بشكل غير متزامن ، خاصة بالنسبة لـ CSS (CSS الهامة) و JS (غير المتزامن والمؤجل) والخطوط (العرض: المبادلة).
  بالطبع ، إذا لم يكن لديك خيار لأن بعض الموارد ضرورية في بداية تحميل الصفحة ، فيجب أن تكون هذه الموارد خفيفة قدر الإمكان.
• اعتماد استراتيجية التخزين المؤقت الصحيحة
  من أجل عرض الصفحات بأسرع ما يمكن للمستخدمين ، قم بتخزين العناصر الثابتة مؤقتًا.
  للقيام بذلك ، تحتاج إلى تحديد المحتوى الديناميكي والمحتوى الثابت مسبقًا ، وتحديد قواعد التخزين المؤقت للمحتوى الثابت: إلى متى وعلى أي ذاكرة تخزين مؤقت (متصفح أو أصل أو CDN).

[دراسة حالة] إدارة زحف روبوت Google

مع وجود أكثر من 26000 مرجع للمنتج ، احتاج 1001Pneus إلى أداة موثوقة لمراقبة أداء مُحسنات محركات البحث والتأكد من أن Google كانت تخصص ميزانية الزحف الخاصة بها على الفئات والصفحات الصحيحة. تعرف على كيفية إدارة ميزانية الزحف بنجاح لمواقع التجارة الإلكترونية باستخدام OnCrawl.

اقرأ دراسة الحالة

تحسين التفاعل: صفحات سريعة الاستجابة

بالإضافة إلى السرعة التي يتم بها عرض العناصر في المتصفح ، فإن القدرة على التفاعل ضرورية لتوفير الرضا التام لمستخدميك.

بخلاف ذلك ، فإنك تعرضهم للإحباط الذي يترجم إلى سلوكيات مثل النقرات الغاضبة ، أو تحريك الماوس بشكل محموم على الصفحة ، أو التمرير العشوائي للتحقق من عمل الصفحة.
في أسوأ الأحوال ، يعود زوار موقعك إلى الصفحة السابقة ، أو يغادرون موقعك للأبد لإجراء بحث جديد على Google ، أو الانتقال إلى منافسيك.
تذكر أنه في حالة وجود تجربة سلبية ، سيذهب 43٪ من مستخدمي الإنترنت إلى موقع منافس لعملية الشراء التالية. لذلك يجب أن تمنح نفسك الوسائل لجذب زوارك ولكن أيضًا للحفاظ عليهم.

غالبًا ما تكون البرامج النصية وجافا سكريبت الطرف الثالث هي المسؤولة عن التفاعل السيئ. في الواقع ، طالما أن المتصفح مشغول باسترداد وتحليل وتنفيذ جافا سكريبت ، فلا يمكنه الاستجابة لتفاعلات المستخدم.

هنا مرة أخرى ، هناك تقنيات لتحسين شفرتك والأطراف الخارجية الخاصة بك ، والسماح للزائرين بالاستمتاع بتجربة مثالية:

• تقليل تأثير الأطراف الثالثة عن طريق تأخير التحميل
  يمكنك البدء في تحميل وتنفيذ البرامج النصية بعد عرض عناصر المحتوى ذات الأولوية على صفحتك. لكن احذر: ضع في اعتبارك أن تأجيل تحميل JavaScript لا يجعلها مجانية من حيث الأداء!
  قد يكون الأمر يتعلق بتأجيل تحميل بعض الوظائف (الدردشة ، والأدوات ، والتتبع ...) بعد عرض العناصر الرئيسية لطمأنة المستخدم ، ولكنه لا يلغي الوقت الذي يحتاجه المتصفح لمعالجة الكود ، يغيره في الوقت المناسب فقط.
• تقليل وقت تنفيذ JavaScript
  قسّم المهام التي تستغرق وقتًا في المتصفح (المهام الطويلة) ، وتأكد أيضًا من تفضيل المعالجة القصيرة استجابة لتفاعلات المستخدم (على سبيل المثال ، تجنب الاستماع بنشاط لأحداث معينة مثل التمرير ؛ واستفد من الأوقات التي يكون فيها المتصفح وقت الفراغ لتشغيل بعض معالجة JavaScript).
• تقليل عمل الخيط الرئيسي
  سيكون المتصفح قادرًا على الاستجابة بشكل أسرع للتفاعلات عن طريق تقليل عدد الطلبات وحجم التبادلات.

وفر الوقت أيضًا: أتمتة تقنيات تحسين موقعك

لقد غطينا للتو جانبين مهمين جدًا من تجربة المستخدم: سرعة العرض والتفاعل. والخبر السار هو أنه يمكن أتمتة جميع التحسينات التي ذكرناها للتو في قائمة التحقق هذه!

أيضًا ، ربما تكون قد ربطت اثنين من صفحات الويب الأساسية الخاصة بـ Google والتي تسمح لك بتقييم هذه الجوانب ، على التوالي: أكبر رسم للمحتوى وتأخر الإدخال الأول.
بالطبع ، يجب أن تفكر أيضًا في تحسين الاستقرار المرئي لصفحاتك للحصول على تجربة مستخدم مثالية ، من خلال العمل على مجموع نقاط التحول في التخطيط التراكمي.

يجب أن تعلم أن هذه المقاييس الثلاثة (LCP و CLS وإجمالي وقت الحظر ، أو TBT ، وهو ما يعادل FID) تمثل 70٪ من النتيجة المنسوبة بواسطة PageSpeed ​​Insights.
لذلك ، منطقياً ، فإن أي شيء تفعله لتسريع صفحاتك وتحسين هذه المقاييس سيكون له تأثير إيجابي على المستخدمين ، وكذلك على نتائج أدائك.
باختصار ، يمكنك تطبيق نفس النهج على تجربة المستخدم الخاصة بك كما تفعل في تحسين محركات البحث (SEO): يضمن المحتوى الجيد والتجربة رضا المستخدم ، ويساهمان في أن تتم فهرسته بشكل أفضل بواسطة Google.

أيضًا ، كما هو الحال في مُحسّنات محرّكات البحث ، يجب الحفاظ على تحسينات webperf بمرور الوقت.
يتطلب هذا الوقت والخبرة لأن التقنيات والمقاييس تتطور بسرعة. علاوة على ذلك ، حتى في الفرق الكبيرة ، لا تمتلك الموارد التقنية دائمًا الوقت أو المعرفة اللازمة للحفاظ على سرعة الموقع بشكل فعال ؛ ونشر الموارد والطاقة لعملية كوماندوز تقع مثل سوفلي أمر محبط للغاية وحتى محبط.

لذلك ، بدلاً من إضاعة الوقت في الصيانة ، والتخوف من الآثار الجانبية في كل تطور للموقع ، ومضاعفة المكونات الإضافية في خطر التحميل الزائد عليها ، فمن الأفضل أتمتة تطبيق جميع تقنيات تحسين الواجهة الأمامية بأداة واحدة!

يجب أن تعلم أنه في معظم الحالات ، بالنسبة لمواقع التجارة الإلكترونية عالية الحركة ، يكون من السهل قياس عائد الاستثمار لحل تحسين webperf.
في الواقع ، قدرت Google أن -0.1 ثانية من وقت التحميل يمكن أن تؤدي إلى + 8٪ تحويلات ، وهو ما يمكن أن يحققه حل تحسين الواجهة الأمامية بسهولة بالغة.
في Fasterize ، وجدنا أنه في كثير من الأحيان ، حتى الزيادة في معدلات التحويل التي تقل عن نقطة واحدة كافية لضمان عائد الاستثمار لحل SaaS الخاص بنا ؛ ناهيك عن الوقت الذي توفره الفرق الفنية.
العمل هو عصب الحرب ، يمكنك إجراء الحساب بنفسك ، ومن السهل القيام بذلك! يتيح لك فهم الفائدة من أتمتة تحسين الأداء وإقناع فرقك الداخلية وإشراكها.

وفر الوقت على جميع الجبهات!