تسريع مدونة بلوجر افضل 8 طرق لزيادة سرعة تحميل قالب بلوجر

شرح طريقة تسريع مدونة بلوجر، طريقة زيادة سرعة تحميل مدونة بلوجر

0

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

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

وفي الاسفل ستجد كل ما يخص كيفية تسريع مدونة بلوجر من اكواد أو طرق وسأوضح طريقة قياس سرعة المدونة ونصائح لتسريع مدونة بلوجر الى اعلى درجة.

يمكنك شراء قالب بلوجر سريع لتتفادي مشاكل السرعة ومن هذة القوالب قالب مبتكر، قالب بلوجر سريع جداً يمكنك الاعتماد عليه في التصدر لمحركات البحث.

قبل أن ننتقل الي كيفية زيادة سرعة تحميل مدونة بلوجر، دعونا نعرف كيف نقيس سرعة تحميل المدونة أولا ؟

كيفية قياس سرعة المدونة

هناك طرق عديدة لقياس سرعة مدونتك او موقعك ، ولكن دعونا نعرض أهم تلك الطرق :

قياس سرعة المدونة بإستخدام موقع Page Speed Insights

موقع Page Speed Insights هو أداة من جوجل لقياس سرعة المواقع الإلكترونية. ولقياس سرعة المدونة عن طريق موقع Page Speed Insights ، قم بالذهاب الي الموقع من هنا ، وقم بوضع رابط مدونتك وأخيراً أضغط علي Analyze أو تحليل إن كانت لغة متصفحك هي العربية .

قياس سرعة المدونة بإستخدام موقع Page Speed Insights

وبعدها تظهر لك سرعة تحميل موقعك بحيث أن السرعة ما بين 0:50 فهي سيئة وما بين 50:90 فهي إلي حد ما جيدة وبين الـ 90 فما فوق فهي ممتازة .

ويظهر لك في الأسفل بعض معايير قياس سرعة تحميل موقعك، دعني اوضح لك بعضها:

شرح لبعض المعايير المهمة لآداة جوجل Page Speed Insights

آداة جوجل Page Speed Insights هي آداة توفرها جوجل كما ذكرنا سابقا لقياس سرعة تحميل المواقع الالكترونية، ويمكنك من خلالها قياس سرعة تحميل قالب بلوجر. وفي الاسفل بعض اهم معايير الاداة وشرحهم.

معيار الـ First Contentful Paint

وهو يقيس سرعة أول شئ يظهر في موقعك، أي أنه يقيس أول شئ ملون كالـ Header مثلاً في موقعك .

معيار الـ First Meaningful Paint

وهو يقيس سرعة أول شئ له معني يظهر في موقعك، أي أنه يقيس سرعة ظهور الـ Header كاملاً في موقعك

معيار الـ Speed Index

وهو يقيس سرعة إكتمال تحميل الموقع من حيث الشكل.

معيار الـ First CPU Idle

وهو يقيس المدة التي يأخذها المعالج حتي يتوقف وينتهي من تحميل كامل الموقع.

معيار Time to Interactive

وهو يقيس الوقت الذي بعده يمكن للمستخدم التفاعل مع موقعك كالبحث عن تدونية أو كتابة تعليق وهكذا.

وينبغي عليك تحليل هذه المعايير والتعرف علي المشاكل التي تُعيق تحميل موقعك؛ ولننتقل الي الموقع الثاني لقياس سرعة تحميل موقعك:

قياس سرعة تحميل المدونة بإستخدام موقع Gt Metrics

وموقع GT Metrics شبيه أيضاً بأداة جوجل والميزة هنا أنه يعطيك تقرير مُفصل عن المشاكل الموجودة في موقعك وأيضاً يعطيك حلول لهذه المشاكل .

قياس سرعة تحميل المدونة بإستخدام موقع Gt Metrics

وبعد أن ناقشنا طرق قياس سرعة تحميل الموقع، دعونا ننتقل الي طرق زيادة سرعة تحميل الموقع؛ وسوف أعرض طرق زيادة السرعة عن طريق حل المشاكل التي من الممكن أن تبطئ الموقع الخاص بك .

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

تعرف علي افضل 5 قوالب بلوحر تقنية

طرق وكيفية زيادة وتسريع سرعة تحميل مدونة بلوجر

تابع الخطوات في الاسفل لتصل بمدونتك الي السرعة القصوي!

إزالة كل الاكواد التي ليس لها فائدة في المدونة

بعض الإضافات تكون غير ضرورية وحذفها لن يأثر علي المدونة، فقط احتفظ بالإضافات المهمة والتي بدونها لا تصلح المدونة للعمل. وأيضاً تكون هناك إضافات تستخدم الجافا سكريبت Java Script والتي تعيق المدونة بشكل كبير وذلك كبعض السلايدرز Sliders التي تجدونها في العديد من المدونات.

ضغط الصور لتسريع بلوجر

عمل Optimize للصور التي تستخدمها في موقعك من شأنه تسريع القالب وتحسين سرعة التحميل

المشكلة :

Serve images in next-gen formats

Image formats like JPEG 2000, JPEG XR, and WebP often provide better compression than PNG or JPEG, which means faster downloads and less data consumption.

Efficiently encode images

Optimized images load faster and consume less cellular data

الحل :

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

هناك مواقع عديدة تقوم بعمل Optimize للصور بدون التضحية بجودة الصور، ومن المواقع التي أرشحها لكم؛ موقع Short Pixel  وأنا شخصياً أستخدم هذا الموقع. يمكنك أيضاً إستخدام الفوتوشوب لضغط وتقليل حجم الصور.

موقع Short Pixel

تعرف من هنا علي كيفية كتابة مقال احترافي متوافق مع السيو

تحميل اسكريبتات الموقع بطريقة متوازية مع تحميل تنسيق المدونة :

المشكلة

Reduce JavaScript execution time

Consider reducing the time spent parsing, compiling, and executing JS. You may find delivering smaller JS payloads helps with this

Minimize main-thread work

الحل : تحميل الـ Script الخاصة بموقعك بشكل Asynchronously يجعل موقعك يحمل بسرعة ويحسن من سرعة موقعك . وللقيام بهذا إنتقل إلي صفحة تعديل الـ HTML الخاصة ببلوجر وقم بالبحث عن Script وفعل هذه الميزة بوضع كلمة

async=”async”

<script async="async" src="main.js"> </script>

تقليل الوقت اللازم لتحميل خطوط الويب المستخدمة في المدونة

خطوط الويب هي الخطوط التي تُستخدم في المواقع الإلكترونية، وإستخدام خطوط مميزة أمر ضروري ولكن علينا ألا نُكثِر في إستخدام هذه الخطوط، فقط يكفي خطين أو ثلاثة علي الأكثر في المدونة.

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

المشكلة :

Ensure text remains visible during webfont load

Leverage the font-display CSS feature to ensure text is user-visible while webfonts are loading.

الحل : إستخدام هذ خاصية ال، Font-face في ال CSS لتحميل الخطوط.

طريقة استخدام خاصية الـ Font-face كالتالي

@font-face {  font-family: "Open Sans";  src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2");  display: swap;  }

تعرف عن كيفية استخدام خاصية @font-face من موقع MDN.

إستخدام كود الـ Lazy Loading لتأخير تحميل الصور

كود الـ Lazy Load يؤخر تحميل الصور حتي إكتمال تحميل الصفحة، وهو كود هام في علاج بطئ مواقع الانترنت

 ولتقوم بإضافة هذا الكود قم بنسخ الكود أسفل ووضعه فوق وسم الـ . هذا الكود مدمج به إضافة الـ JQuery حتي يعمل بشكل صحيح  :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script type='text/javascript'> // Jquery LazyLoad Script by www.Bloggersstand.com //<![CDATA[ (function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"https://4.bp.blogspot.com/-oA8G9t61JXk/VtLrtkAzObI/AAAAAAAAFTY/EjT6jl2MEFM/s1600/bloggersstand.gif",effect:"fadeIn",threshold:"-50"})});//]]></script>

عمل Minify للقالب أو لكود الـ HTML

تصغير حجم الكود الخاص بالقالب الذي تستخدمه يساعد في زيادة سرعة مدونة بلوجر، ولعمل Minify لقالب بلوجر إذهب لموقع Html Compressor

عمل Minify للقالب أو لكود الـ HTML

وقم بنسخ كود القالب ولصقه هناك وإختار Blogger وإضغط علي Compress.

الاشتراك في شبكة توصيل للمحتوي CDN

في بعض الاحيان يكون الاشتراك في شبكة لتوصيل المحتوي هو أمر رائع حيث تقوم هذه الشبكات المعروفة بال CDNS أو بالـ Content Delivery Network، وتقوم هذه الشبكات بتوزيع المحتوي الخاص بمدونتك الي سيرفرات منتشرة في جميع انحاء العالم .

وتقوم بتوصيل محتوي موقعك الي المستخدم من اقرب سيرفر له، مما يقلل من سرعة تحميل الموقع ويقلل وقت التحميل، كما ان بعض خدمات وشركات توصيل المحتوي بتقديم خدمات اخري حيث يمكنها:

مزايا الـ CDN، وكيف يمكن للـ CDN زيادة سرعة تحميل موقعك؟

  • تقوم بزيادة سرعة تصفح موقعك، وبالتالي تساعد علي تعزيز آداء الموقع.

  • تقوم بعمل تقسيم وتوزيع لل Traffic الخاص بموقعك Load balancing.

  • بعض ال CDNs تحمي المواقع المشتركة بها من هجمات ال ddos وغيره، فيما يوفر حماية اكبر لموقعك، كما انها تحمي مدونتك من الزيارات الوهمية.

  • تقوم بعمل Cashing لموقعك؛ وال Cashing هي خاصية تقوم بتحميل ملفات ال CSS وبعض الصور وبعض ملفات الموقع الاخري في متصفحات المستخدمين مما يزيد من سرعة تحميل الموقع عند زياتهم للموقع مجدداً.

  • بعض ال CDNs توفر خدمة تقليل حجم الصور الموجودة بموقعك كما تجعل هذا الحجم ملائم لحجم ال div الموجودة به الصورة أي انها تقوم بعمل Resize للصور.

عمل Cashing لملفات الـ CSS والصور في موقعك

يمكنك تسريع مدونة بلوجر عن طريقة عمل Cashing لملفات التنسيق CSS والصور واكواد الجافا سكريبت Js في مدونتك

، وبالتالي يتم تخزين هذه الملفات داخل متصفح الزائر وعند زيارته لموقعك مرة أخري يتم تحميل هذه الملفات من جهازه. يمكنك تفعيل خاصية الـ Cashing في مدونة بلوجر عن طريق وضع هذا الكود اعلي الـ

<head>

كود لعمل Cashing مدونة بلوجر Blogger

<meta content='7 days' name='revisit-after'/><meta content='7 days' name='revisit'/><include expiration='30d' path='*.css'/><include expiration='30d' path='*.js'/><include expiration='15d' path='*.jpeg'/><include expiration='15d' path='*.gif'/><include expiration='15d' path='*.png'/><include expiration='15d' path='*.jpg'/>

وتقديراً للمجهود المبذول في كتابة هذا المقال، يمكنك مشاركته مع المهتمين بهذا الموضوع

سجل الآن في منفذ

سجل وضف خدماتك في منفذ أو تصفح الخدمات المتاحة علي المنصة.