پس از راه اندازی فروشگاه یا سایت وردپرسی، اولین چالشی که ذهن شما را درگیر می کند، سرعت بالا آمدن وردپرس و مخصوصا فروشگاه ووکامرسی شما می باشد. در ادامه مطلب با ما همراه باشید تا با آموزش جی تی متریکس به صورت تصویری، گام به گام به بهترین سرعت ممکن در سایت وردپرسی برسید.
آموزش افزایش سرعت سایت وردپرسی با GTmetrix
بر اساس آخرین آماری که گروه Aberdeen Group در سال 2022 منتشر کرده است، هر یک ثانیه تاخیر در بالا آمدن سایت شما، تاثیرات زیر را به همراه خواهد داشت:
- افزایش 50% نرخ پرش و ترک سایت توسط کاربر
- کاهش 11% آمار بازدید سایت
- کاهش 7% آمار فروش یک سایت
- کاهش 16% رضایت کاربرانی که ممکن است مشتری شما بشوند
بنابراین سرعت لود سایت را میتوان یکی از حیاتی ترین فاکتور های موفقیت یک سایت دانست. در سایت های وردپرسی نیز با استفاده از سایت GTmetrix و همچنین افزونه های افزایش سرعت سایت وردپرس، می توان به بالاترین سرعت ممکن رسید.
سایت GTmetrix چیست؟
سایت GTmetrix یک ابزار آنلاین تست سرعت سایت است که با بررسی و آنالیز سایت شما، راهکارهای مفیدی برای بهبود سرعت سایت به شما ارائه می کند. این سایت در آدرس www.GTmetrix.com قابل دسترس است که در زیر به آموزش جامع آن می پردازیم:
آموزش جی تی متریکس جدید
در ابتدا لازم است بدانید جی تی متریکس در آبان سال 1399، الگوریتم آنالیز خود را با استفاده از API های Lighthouse بروزرسانی کرد و اکنون وب سایت ها را بر اساس آنالیزلایت هاوس بررسی میکند. مطابق با این تغییرات، سایت هایی که بر اساس الگوریتم قبلی رفع اشکال شده بودند، اکنون به مشکل برخورده اند وباید مجددا بر اساس بروزرسانی جدید جی تی متریکس، سایت خود را به روز کنند.
کار با gtmetrix بسیار ساده است، کافی است پس از باز کردن وب سایت GTmetrix.com، آدرس فروشگاه اینترنتی خود را در قسمت Analyze Performance of وارد کنید و منتظر بمانید تا جی تی متریکس سرعت سایت شما را بررسی کند.
البته امکان دارد به علت درخواست های زیادی که به این سایت فرستاده میشود، مدت زمان بیشتری برای بررسی سایت شما طول بکشد که اگر این مدت زمان از یک میزان استاندارد بیشتر شود، جی تی متریکس بررسی سرعت سایت شما را متوقف می کند و شما باید دوباره برای این کار اقدام کنید.
سرانجام فروشگاه اینترنتی شما به صورت کامل آنالیز و بررسی می شود. حال لیستی از تمام مواردی که در سرعت سایت شما موثر هستند را با رنگ ها(GRDE) و درجه های مختلف (PRIORITY) نمایش می دهد، که این رنگ ها و درجه ها نشان دهنده ی وضعیت مورد مذکور در سایت شما هستند.
همچنین جی تی متریکس مشخص می کند ارور موردنظر مربوط به کدام قسمت(TYPE) است.
شما بر این اساس می بایست شروع به رفع خطاهای gtmetrix کنید تا افزایش سرعت بالا آمدن سایت خود را به طور ملموسی احساس کنید. برای اینکه علت خطا و چگونگی رفع آن را مشاهده کنید، می توانید روی گزینه What’s this mean هر مورد کلیک کنید.
به طور کلی تحلیل GTmetrix شامل دو بخش اصلی GTmetrix Grade و Web Vitals است که در ادامه به معرفی آنها و اموزش gtmetrix جدید می پردازیم.
GTmetrix Grade
سیستم امتیازدهی جی تی متریکس مبتنی بر lighthouse است که از سه بخش اصلی تشکیل شده:
1. نمایش امتیاز بر اساس حروف الفبایی
در این بخش با توجه به سطح عملکرد سایت، یک امتیاز از ۸ تا ۳ به وبسایت داده میشود که نشان دهنده میانگین عملکرد وبسایت شما از نظر ساختار و تجربه کاربری بازدید کنندگان است.
2. Performance
این بخش امتیاز سایت شما رو از نظر عملکرد نشان میدهد.
3. Structure
این امتیاز نشان میدهد که وب سایت شما تا چه اندازه از نظر ساختار برای موتورهای جستجو بهینه شده است.
Web Vitals
Web Vitals جی تی متریکس شامل سه بخش اصلی است :
1.LCP: این بخش مشخص کننده میزان زمان لازم برای نمایش طولانی ترین محتوای وب سایت به کاربر است.
2.TBT: این بخش تعیین کننده میزان زمان لازم برای اجرای کدهای اسکریپت در زمان بارگذاری صفحات وب سایت شما است.
CLS.3 : تغییر حالت صفحه توسط کاربر در طول زمان بارگذاری سایت در این قسمت نمایش داده میشود.
آموزش gtmetrix جدید
در قسمت پایین صفحه سایت جی تی متریکس 6 سربرگ وجود دارد که هر کدام اطلاعات مفیدی از تحلیل سایت در اختیارتان قرار می دهد. این سربرگ ها به ترتیب عبارتند از:
-
Summary
-
Performance
-
Structure
-
Waterfall
-
Video
-
History
1. سربرگ Summary
اصلی ترین اطلاعات تحلیلی وب سایت در این قسمت قرار دارد و شامل 3 بخش اصلی است :
1. speed visualization: خلاصه ای کامل از عملکرد صفحات، ساختار و نحوه بارگذاری صفحات به صورت تصویری است.
2. Top Issues: اصلی ترین مشکلاتی که عملکرد وبسایت شما را تحت تاثیر قرار میدهد به صورت دقیق و با جزئیات نمایش می دهد.
3. Page Details: امکان مشاهده اطلاعات مربوط به انواع درخواست صفحات وب سایت شامل تعداد درخواست ها و اندازه آنها فراهم می شود.
2. Performance در جی تی متریکس
تحليل جی تی متریکس در مورد عملکرد وب سایت خود را می توانید در این زبانه مشاهده کنید. این زبانه شامل دو بخش اصلي است :
1.Performance Metrics : با مشاهده جزئیات عملکرد وب سایت بر اساس معیارهای مختلف نظیر نمایش بزرگترین محتوا و زمان کل مسدود کردن، متوجه نقاط قوت و ضعف عملکردتان می شوید.
2. Browser Timings : بررسی زمان مرورگر در این قسمت امکان پذیر است. این زمان تاثیر مستقیمی در عملکرد وب سایت شما ندارد.
3. سربرگ Structure
در این بخش میتوانید به کمک اطلاعات دریافتی عملکرد وب سایت خود را از نظر ساختار، مطابق با معیارهای گوگل بهینه کنید. خطاهای ساختاری در این سربرگ نمایش داده میشود. این خطاها به طور مستقیم روی امتیاز دهی عملکرد وب سایتتان تاثیر ندارد اما با رعایت آنها می توانید زمان لود صفحات وب سایت خود را بهبود دهید.
4. سربرگ Waterfall
چارت واترفال مجموعه ای از تحلیل ها است که رفتار و عملکرد سایت شما را هنگام بارگذاری به تصویر میکشد. هر اسکریپت، فایل های رسانه ای یا منابعی که خارج از صفحه سایت شما فراخوانی میشود، یک درخواست است که در این فهرست نمایش داده میشود. در این بخش شما متوجه می شوید هنگام فراخوانی صفحه مورد نظر، چه درخواست هایی، با چه ترتیبی و چه تعداد دفعاتی رد و بدل می شود.
5. سربرگ Video
با ضبط فيلم از بارگذاری صفحه مورد نظر، امکان مشاهده دقیق سرعت لود عناصر سایت و ترتیب بارگذاری آنها به صورت ویدیویی در این سربرگ فراهم شده است. شما می توانید به طور دقیق مشاهده کنید در چه بخش هایی ممکن است مشکل لودینگ یا وقفه رخ دهد تا در صورت نیاز در راستای بهبود هر کدام اقدام نمایید.
6. سربرگ History
اطلاعات مربوط به عملکرد صفحه مورد نظرتان را در گذر زمان می توانید در این سربرگ مشاهده کنید. در این سربرگ سه نمودار مختلف نمایش داده شده که نشان دهنده عملکرد صفحه مورد نظر وبسایت شما از نظر معیارهای جی تی متریکس (Page metrics)، سایز صفحه و تعداد درخواست های ارسالی (Page sizes and reques counts) و امتیاز صفحه (Page scores) می باشد.
نحوه بالا بردن سرعت سایت در جی تی متریکس
در ادامه یک سری راهکار برای بالا بردن سرعت سایت در gtmetrix، به شما معرفی خواهیم کرد.
۱-آنالیز یا فشرده سازی تصاویر (optimize images)
یکی از موارد رایجی که ممکن است در لیست gtmetrix وضعیت خوبی نداشته باشد و به شما ارور بدهد optimize images است. این مورد مربوط به حجم تصاویری می شود که در سایت خود به کار بردید.
برای رفع این خطا شما می توانید به سادگی optimized version تصویری که خطا دارد را دریافت کنید و در آدرس ذکر شده جایگزین عکس اصلی کنید.
لازم به ذکر است gtmetrix عکس ها را به ترتیب حجم اضافی ای که دارند به شما نشان می دهد پس از همان ابتدای لیست شروع تصحیح عکس ها کنید.
بعد از رفع خطاهای gtmetrix در optimize images دوباره سایت را تست کنید و تغییراتی که در مدت زمان لود سایت (Fully Loaded Time) و سرعت لود صفحه(Page Speed Score) به وجود آمده است را مشاهده کنید.
ممکن است زمان لود سایت تغییر چندانی نکند اما سرعت لود صفحه به وضوح تغییر میکند.
نکته ای که در اینجا باید به آن توجه کنید این است که اسم و پسوند تصویر optimize که از جی تی متریکس دریافت می کنید باید دقیقا مثل اسم و پسوند تصویر اصلی باشد تا وقتی در آدرس مشخص شده آپلود می کنید جایگزین شود.
همچنین افزونه های پرکاربرد زیادی برای بهینه سازی تصاویر وجود دارد که ما در محتوای بهترین افزونه های بهینه سازی تصاویر، بهترین افزونه ها را همراه با لینک دانلود برای شما آماده کرده ایم.
۲- به تعویق انداختن جاوا اسکریپت (Defer parsing JavaScript)
مورد دیگری که ممکن است به شما خطا Defer parsing JavaScript است این مورد مربوط به کدهای JavaScript به کار رفته در سایت شما است.
نیاز نیست نگران باشید شما میتوانید تنها با افزودن یک افزونه به وردپرس خود این خطای gtmetrix را رفع کنید. افزونه ی Speed Booster Pack یکی از افزونه های افزایش سایت وردپرس است.شما با نصب این افزونه و فعال کردن گزینه Defer در قسمت Optimize JavaScript به راحتی این ارور را رفع کنید.
۳– فشرده سازی فایل Minify CSS) CSS )
یکی دیگر از مواردی که ممکن است به شما خطا بدهد قسمت Minify CSS می باشد. در این قسمت شما میتوانید به راحتی ارور را رفع کنید.
کافی است روی optimize version کلیک کنید و فایل فشرده ی CSS خود را دریافت کنید.
سپس باید این فایل را در آدرسی که ذکر شده است جایگزین فایل اصلی کنید. فقط توجه داشته باشید اسم و پسوند فایل جایگزین باید دقیقا مثل اسم و پسوند فایل اصلی باشد.
۴- فشرده سازی فایل Minify JS) JS )
فایل های جاوا اسکریپت هم ممکن است حجم زیادی را به خود اختصاص داده باشند که این یکی دیگر از خطاهای جی تی متریکس را به خود اختصاص می دهد.
رفع این خطا بسیار ساده است کافی است روی optimize version کلیک کنید و فایل فشرده ی JS خود را دریافت کنید.
در این مرحله باید فایل فشرده ی جاوا اسکریپت را در آدرس ذکر شده جایگزین فایل اصلی کنیم.
برای فشرده سازی فایل های JS از افزونه ای که در بالا معرفی شد، می توانید استفاده کنید.
۵- رفع خطای Enable Keep alive
همانطور که در قسمت TYPE مشاهده می کنید این خطا مربوط به سرور سایت شما است.
اگر قابلیت Keep Alive فعال باشد لود تمامی فایل های مربوط به فروشگاه اینترنتی شما به یک باره از سرور درخواست میشوند. که فعال بود این قابلیت باعث افزایش سرعت سایت خواهد شد.
هنگامی که این خطا را در جی تی متریکس مشاهده می کنید می توانید کدی که ذکر می شود را در آخر فایل htaccess. هاست فروشگاه اینترنتی خود قرار دهید و در نتیجه قابلیت Keep Alive را فعال کنید.
تکه کد:
Header set Connection keep-alive
در صورتی که این تکه کد را در فایل htaccess. هاست خود قرار دادید و فروشگاه اینترنتی خود را در جی تی متریکس تست کردید و تغییری ایجاد نشد باید با سرور خود تماس برقرار کنید تا این قابلیت را برای شما فعال کند.
نکات مهم افزایش سرعت بالا آمدن سایت وردپرسی
به منظور افزایش سرعت بالا آمدن سایت وردپرسی، نکاتی که در ادامه گفته ایم را رعایت کنید.
1. استفاده از میزبانی وب قوی
یکی از دلایل افت سرعت سایت، میزبانی یا هاست ضعیف است. بسیاری از صاحبان وب سایت ها برای صرفه جویی از هزینه ها ، از هاست اشتراکی استفاده می کنند. اما این نوع هاست به دلیل شلوغی و تراکمی که دارد سرعت سایت را به شدت کاهش می دهد.
2. موقعیت سرور
موقعیت سرور شما باید نزدیک محلی باشد که بیشترین بازدید کننده را از آنجا دارید. برای مثال اگر شما بخواهید از اصفهان به شمال کشور بروید باید مسافت بیشتری را طی کنید تا اینکه از تهران به آنجا بروید. پس هر چه موقعیت سرور نزدیکتر باشد، سرعت سایت نیز افزایش میابد.
3. بهینه بودن کدها
بهینه نبودن کد ها تاثیر زیادی در کاهش سرعت سایت دارد. این موضوع به طراح سایت بستگی دارد که چقدر کد ها را بهینه بنویسد. اگر از سیستم های مدیریت محتوا آماده استفاده می کنید به این نکته توجه کنید که از شرکتی وب سایت خود را تهیه کنید که این نکته را در نظر بگیرد.
4. بهینه بودن تصاویر
برای جذب کاربر و زیبا کردن یک سایت باید از تصاویر با کیفیت اما حجم کم استفاده کنید. اگر شما یک سایت فروشگاهی دارید باید بدانید که حجم تصاویر بارگذاری شده در سایت ممکن است خرید را برای کاربر سخت کرده و به شدت سرعت را کاهش دهد.
5. ریدایرکت های اصولی
ریدایرکت های غیر ضروری در سرعت سایت تاثیر زیادی دارند. بهتر است همین حالا به سراغ ریدایرکت های زنجیره ای بروید و آن ها را اصلاح کنید؛ چراکه برای هر ریدایرکت کاربر باید زمانی را منتظر بماند تا صفحه لود شود.
6. پلاگین های سایت
پلاگین های استفاده شده در سایت حجم زیادی از کد های HTML و CSS را به وجود می آورد که همین مسئله می تواند سرعت لود سایت را کاهش دهد. بهتر است از پلاگین ها به صورت بهینه استفاده کنید.
7. بهینه کردن تعداد درخواست ها
هر المانی که در سایت استفاده می کنید، برای لود شدن یک request به سرور ارسال می کند. حال اگر این المان ها بیشتر از حد معمول باشد، تعداد درخواست ها افزایش یافته و سرعت سایت افت پیدا می کند. بنابراین برای افزایش سرعت سایت وردپرس، تعداد ریکوئست ها را به حداقل برسانید.
8. آپدیت بودن قالب و افزونه
آپیدیت به موقع افزونه ها و قالب سایت می تواند تاثیر چشمگیری در سرعت سایت داشته باشد. آپدیت هرکدام می تواند حداقل 2 ثانیه به سرعت سایت کمک کند.
افزایش سرعت سایت وردپرسی با افزونه wp-rocket
افزونه راکت یکی از بهترین افزونه های وردپرس برای افزایش سرعت سایت و همچنین بهینه سازی کد ها می باشد. به درخواست مکرر کاربران سیتی سایت، آموزش کار با افزونه wp-rocket را در این مقاله قرار دادیم. همچنین لینک دانلود رایگان افزونه wp rocket در ادامه آمده است.
مزایای افزونه راکت برای افزایش سرعت سایت وردپرسی:
-
قابلیت لود تنبل تصاویر سایت
-
کش کردن صفحات وردپرس
-
پیش بارگذاری کش سایت
-
افزایش سرعت لود تصاویر در وردپرس
-
فشرده سازی فایل های استاتیک
-
رابط کاربری ساده
-
دارای سیستم بهینه سازی دیتابیس
دانلود رایگان افزونه wp rocket
آموزش افزونه wp-rocket
بعد از نصب افزونه Rocket باید کد ” define(‘WP_CACHE’, true); ” را در فایل wp-config.php قرار دهید. بهتر است این کد را بعد از تگ php قرار دهید.
بعد از قرار دادن کد در فایل wp-config.php مطابق تصویر زیر باید به سراغ تنظیمات تب های افزونه راکت برویم:
تب Cache
در ابتدا به سراغ تب Cache می رویم. در این تب احتیاج به تغییرات نیست و حالت پیش فرض آن برای سایت ها کافی است.
تب File Optimaztion
این تب اهمیت زیادی دارد. در این تب تمامی گزینه های Minify را انتخاب کنید. انتخاب این گزینه ها باعث بهبود سرعت سایت می شود. دقت داشته باشید با انتخاب این گزینه ها ممکن است مشکلی بوجود بیاید؛ در برخی از قالب ها، گزینه ی Minify کردن فایل های جاوا اسکریپت در تنظیمات وجود دارد و تغییرات در راکت باعث بهم ریختگی سایت می شود.
تب Database
تب بعدی مربوط به دیتابیس است. در تب Database می توانیم دیتابیس را بهینه سازی کنیم. در این تب گزینه ی Auto Draft مربوط به ذخیره ی خودکار پیش نویس ها و Revision رونوشت مربوط به پست ها است و گزینه ی Transients اطلاعاتی است که به طور موقتی در دیتابیس ذخیره می شود..
برای بهینه سازی دیتابیس باید گزینه ی Optimize که در پایین صفحه وجود دارد را انتخاب کنید تا فایل های اضافی از دیتابیس حذف شود.
تب HeartBeat
این تب بین سرور و real-time data ارتباط برقرار می کند. برای مثال پستی که بدون انتشار می نویسیم یا اعلاناتی که در داشبورد مشاهده می کنیم، به وسیله HeartBeat api مدیریت می شود. نمی توان به طور کلی این api را غیر فعال کرد. اما می توان فعالیت آن را کاهش داد که منجر به بهبود صفحات سایت می شود.
سخن آخر
سرعت سایت یکی از پارامترهای مهم در رضایت کاربران و متقابلا افزایش رتبه سایت در گوگل می باشد. سرعت سایت مخصوصا در فروشگاه های اینترنتی از اهمیت بالاتری برخوردار است. از آنجایی که کاربران از سرعت پایین یک فروشگاه اینترنتی کلافه می شوند، بدون توجه به قیمت ها و بررسی کیفیت محصولات، آن سایت را ترک می کنند. همانطور که در این مطلب آموزش داده شد برای آنالیز سرعت سایت ها میتوان از سایت gtmetrix.com استفاده نمود. البته پیشنهاد می کنیم سرعت وب سایت خود را به کمک سایر ابزارهای تست سرعت آنلاین نیز بررسی کنید. در مطلب ” ابزار تست سرعت سایت ” ابزارهای دیگر معرفی شده که می تواند در افزایش سرعت وردپرس بسیار موثر باشد.
