آدینه گراف مجموعه کاملی از خدمات شامل بازاریابی دیجیتال, سئو سایت, سوشال مدیا,طراحی سایت, مارکت پلیس و کوچینگ و مشاوره ، طراحی گرافیکی، موشن گرافیک و… است تا نیازهای شما را در تمام مراحل مرتفع کند.

سئو

آموزش افزایش سرعت

۱۳ روش موثر برای افزایش سرعت سایت + بهترین ابزار های تست سرعت

افزایش سرعت سایت دیگر یک انتخاب نیست! کاربران همین الان می‌خواهند نیازشان را در کمترین زمان ممکن برطرف کنید. اگر نمی‌توانید پس می‌روند سراغ سایت سریع‌تر که رقیب شما هم هست.اگر شما هم به دنبال روش‌های درست تست سرعت سایت و روش‌هایی برای بالا بردن سرعت سایت هستید چند دقیقه همراه ما باشید، قطعا موثرترین روش‌ها را در همین مقاله پیدا خواهید کرد.

سرعت سایت (Site speed) چیست؟

سرعت سایت به معنای سرعت بارگذاری و سرعت رسیدن کاربر به هدفش است. مثلاً اگر صفحه اصلی سایت خیلی سریع باز شود اما بارگذاری کامل صفحه گالری محصولات ۱5 ثانیه طول بکشد یعنی سایت شما در کل سریع نیست.سرعت سایت از موارد سئو تکنیکال است و تاثیر بسیاری بر سئو دارد؛ به این معنی که هر چقدر سرعت بارگذاری سایت شما پایین تر باشد، از نظر سئو بهتر است.

سرعت هر صفحه (Page speed) وابسته به عناصر موجود در آن مثل تصاویر، افکت‌ها، اطلاعات موردنیاز برای پردازش و … بستگی دارد. اما وقتی درباره سرعت کل سایت صحبت می‌کنیم عواملی مثل سرور میزبان و کش (Cache) مطرح می‌شود.

پس در کل سرعت سایت مفهومی جامع‌تر دارد. وقتی کاربر آدرس سایت شما را در مرورگر خود وارد می کند و بعد از بازدید چند صفحه، به صفحۀ خرید (هدف) منتقل می‌شود، بیشتر سرعت سایت را لمس می‌کند.

چرا سرعت سایت مهم است؟

بر اساس یک مطالعه ، تقریبا نیمی از کاربران وقتی وارد یک وب‌سایت می‌شوند انتظار دارند آن سایت در عرض ۲ تا 3 ثانیه لود شود و اگر انتظارشان در عرض 3 ثانیه برآورده نشود سایت را ترک می‌کنند. از طرف دیگر حدود ۷۸% کسانی که آنلاین خرید می‌کنند اگر تجربه خوبی از وب‌سایت به دست نیاورند و سرعت آن کم باشد دیگر برای خرید به آن مراجعه نمی‌کنند و جالب‌تر اینکه ۴۴% از آنها این تجربه‌ی بد را به اطرافیانشان هم انتقال می‌دهند. داده‌هایی که از این تحقیقات به دست آمده نشان می‌دهد یک ثانیه تاخیر در زمان بارگذاری صفحه می‌تواند منجر به کاهش 7٪ از آمار فروش، 11٪ از بازدید صفحات و 16٪ از رضایت مشتری شود.افزایش سرعت سایت

پس اگر به فکر افزایش بازدید و رضایت کاربران هستید، باید هر میلی‌ثانیه در سرعت بارگذاری وب‌سایت برایتان مهم باشد.از طرفی بالا بودن سرعت سایت یکی از مهمترین فاکتورهای سئو نیز محسوب‌ می‌شود که گوگل برای رتبه‌بندی سایت‌ها به آن توجه دارد.

در حالت کلی دو دلیل برای اهمیت سرعت سایت داریم:

  1. سئو (SEO)
  2. تجربه کاربران 

تاثیر سرعت سایت در سئو وب سایت

تأکید گوگل بیشتر روی ایجاد تجربه کاربری خوب است. سریع بودن سایت هم بخشی از تجربه کاربری خوب حساب می‌شود.سرعت سایت یکی از فاکتورهای مهم رتبه‌بندی گوگل است پس در کل اگر سایت کندی دارید فکر رسیدن به رتبه‌های بالا را از سر خود بیرون کنید.

دومین تاثیر سرعت سایت روی سئو در مرحله ایندکس کردن اتفاق می‌‌افتد. وقتی ربات‌های گوگل صفحه‌ای از وبسایت شما را کشف می‌کنند یا خودتان وجود سایت و صفحه‌ای جدید را به گوگل اطلاع می‌دهید، ربات‌های بررسی کننده صفحه به سراغش می‌آیند. مدت زمانی که ربات‌ها به هر صفحه اختصاص می‌دهند محدود است.

در سرچ کنسول گوگل گزارشی به نام Crawl Stats وجود دارد که نشان می‌دهد ربات‌های گوگل برای دانلود صفحات سایت چقدر زمان گذاشته‌‌اند. هرچه این زمان (برحسب میلی‌ثانیه) کمتر باشد یعنی صفحه‌های جدید یا به روز‌رسانی شده زودتر در نتایج جستجوی گوگل دیده می‌شوند.

تأثیر سرعت سایت در تجربه کاربران

قطعا شما هم مثل دیگران از بین دو وبسایت فروش که قیمت‌هایشان یکسان است، ترجیح می‌دهید از سایتی خرید کنید که سریع‌تر است. به ویژه زمانی که چند دقیقه بیشتر وقت ندارید و دوست دارید در کمترین زمان ممکن خرید خود را انجام دهید.

این یک مثال ساده بود اما خیلی‌ وقت‌ها هم اگر باز شدن سایتی خیلی طول بکشد به راحتی تب آن را می‌بندیم و می‌رویم سراغ سایتی دیگر در نتیجه محتوای اون صفحه هر چقدر هم با کیفیت باشد،دیده نخواهد شد.به همین سادگی تأخیر در بارگذاری سایت می‌تواند باعث از دست رفتن بازدیدکننده‌، مشتری و در نتیجه کاهش درآمد شود.

طبق تحقیقات گوگل، زمان ماندن بازدیدکنندگان در صفحه، در سایت‌های سریع (بارگذاری کمتر از 5 ثانیه) در مقایسه با سایت‌های کند (بارگذاری بیشتر از 19 ثانیه)، ۷۰ درصد بیشتر است. از طرف دیگر در سایت‌های سریع، نرخ پرش (Bounce Rate) هم ۳۵ درصد کمتر است.

بیشتر بدانید : نرخ پرش چیست ؟

بهترین ابزارهای تست سرعت سایت

زمانی که شما از سایتی بازدید می‌کنید مرورگر شروع به ذخیره کردن بخش‌هایی از وب‌سایت می‌کند تا دفعات بعدی با سرعت بالاتری همان وب‌سایت را بارگذاری کند. به این عمل، کش (cash) گفته می‌شود.ممکن است وقتی صفحه‌ی وب‌سایت خود را باز می‌کنید، در ابتدا تصور کنید خبری از کندی سرعت نیست! اما این فرایند کش مرورگر است که باعث ایجاد این برداشت نادرست می‌شود! بنابراین شما شاهد سرعت واقعی وب‌سایت نبوده‌اید!

 کنترل سرعت سایت یک وظیفه‌ی مهم برای مدیران وب سایت‌ها شمرده می‌شود. پس اگر به نحوه‌ی صحیح مدیریت یک وب سایت توجه می کنید، ابتدا به کمک این ابزارها سرعت سایت خود را بسنجید و در صورت مشاهده‌ی کندی سرعت از روش‌هایی که در این مقاله عنوان شده، استفاده نمایید.

برای تست سرعت سایت راه‌ها و ابزارهای مختلفی وجود دارد. ۴ ابزاری که در ادامه معرفی کردیم اولاً رایگان‌اند، دوماً از جنبه‌های مختلفی که در ادامه توضیح می‌دهیم بهتر و کاربردی‌تر هستند.

۱. page speed insights

Page Speed Insights یکی از ابزارهای رایگان برای تست سرعت سایت و سنجش تجربه کاربران که توسط خود گوگل راه اندازی شده است. تنها مشکل این ابزار محدودیت آن برای کاربران ایرانیست! باید قبل از ورود به این صفحه آی پی خود را تغییر دهید.

شاخص‌هایی که PSI (مخفف Page Speed Insights)  برای اندازه‌گیری سرعت وبسایت و سنجش تجربه کاربران دارد مبتنی بر استاندارهای گوگل هستند. یعنی همان شاخص‌‌هایی که گوگل برای رتبه‌بندی وبسایت‌ها استفاده می‌‌کند.هر کدام از این شاخص‌ها ضریب و وزن متفاوتی دارند. میزان تاثیرگذاری شاخص‌ها در PSI با درصد مشخص شده و در نهایت یعد از یک محاسبه با در نظر گرفتن کل شاخص‌‌ها، به عددی بین ۱ تا ۱۰۰ می‌رسیم.

این نمره سرعت شماست که بالای گزارش برای دو نوع دستگاه موبایل و رایانه‌های شخصی جدا از هم گزارش می‌شود. هر چه عدد گزارش شده بزرگتر باشد یعنی سرعت و تجربه کاربران از وبسایت شما بهتر است.

۲. جی تی متریکس (Gtmetrix)

شاید محبوب‌ترین ابزار تست سرعت حداقل در ایران همین ابزار باشد. جی تی متریکس سه نمره نهایی بر اساس سه روش اندازه‌گیری مختلف برای سرعت وبسایت گزارش می‌دهد. این سه عدد که در تصویر زیر با کادر قرمز مشخص شده‌اند را در ادامه به ترتیب توضیح می‌دهیم.

۱. PageSpeed Score

PageSpeed Score امتیاز سرعت وب‌سایت که به صورت درصد نمایش داده می‌شود و مبتنی بر همان سرویس تست سرعت گوگل است. البته این روش سنجش عملکرد وبسایت در جی تی متریک کمی دستکاری شده و یک رتبه‌بندی براساس حروف لاتین (A, B, C ,…) هم به این درصد اضافه کرده است.که A بالاترین امتیاز است.

۲. YSlow Score

روش YSlow مبتنی بر ۲۳ شاخص عملکردی است که شرکت یاهو برای سنجش سرعت و عملکرد وبسایت‌‌ها استفاده می‌کند. این ۲۳ شاخص وزن و تاثیر متنوعی روی نمره نهایی دارند. معمولاً عددی که در این روش به دست می آید فاصله کمی با PageSpeed Score دارد.

۳. Fully Loaded Time

این شاخص مدت زمان بارگذاری کامل وبسایت را نشان می‌دهد. این زمان ممکن است از تجربه خودتان طولانی‌تر باشد چون جی تی متریکس در این شاخص زمانی را در نظر می‌گیرد که صفحه به طور کامل بارگذاری شده و تا ۲ ثانیه هیچ ارتباطی با اینترنت برقرار نکند. یعنی امکان دارد وبسایتی در ظاهر کامل بارگذاری شده باشد اما همچنان در حال دریافت فایل‌ یا ارتباط با سرور باشد. هر وقت این ارتباط قطع شد یعنی صفحه Fully Load شده است.

۳. webpagetest

با این سرویس رایگان، می‌توانید یک بررسی کامل از زمان بارگذاری و عوامل تاثیرگذار در کندی وبسایت به دست ‌آورید.البته گزارش webpagetest جامع و تخصصی است. با این ابزار می‌توانید مشکلات امنیتی، تصاویر پرحجم، منابع اضافی، پردازش‌های زمان‌بر و دیگر مشکلات احتمالی را پیدا کنید.

۴. website speed test

اگر یک وب‌سایت وردپرسی دارید از ابزار رایگان website speed test استفاده کنید. این ابزار سرعت بارگذاری صفحه‌ی سایت، تعداد درخواست‌ها و سایز صفحه‌ی سایت را در اختیار شما قرار می دهد.

۵. گوگل سرچ کنسول (search console)

سرچ کنسول ابزاری برای سنجش عملکرد و حضور وبسایت در نتایج گوگل است.اما گوگل در آخرین به‌روزرسانی سرچ کنسول گزارش جدیدی به نام Core web vitals اضافه کرد که سرعت وبسایت را مبتنی بر همان روش Page Speed گوگل به صورت مداوم اندازه‌گیری و گزارش می‌دهد.در این گزارش خبری از اعداد و ارقام پیچیده نیست. فقط سه سطح ضعیف، نیازمند بهینه‌سازی و خوب دارد.

کدام از ابزارهای بالا بهتر و دقیق‌تر است؟

چند نکته مهم در بررسی سرعت سایت که قبل از استفاده از هر ابزاری باید بدانید:

  • اگر شما با اینترنت پرسرعت و با کیفیت عالی یک وبسایت سنگین و پرحجم را باز کنید، شاید بارگذاری کامل آن فقط یک ثانیه طول بکشد. اما کاربری که به هر دلیلی با اینترنت ضعیف و کم سرعت بخواهد همین سایت را باز کند شاید ۳۰ ثانیه منتظر بماند. این نکته را هم در نظر بگیرید که عواملی مثل اختلالات شبکه اینترنت ‌می‌تواند این تجربه را بدتر هم بکند.
  • کل صفحات یا مراحلی که کاربر دنبال می‌کند باید سریع باشد نه فقط یک صفحه.اگر یک صفحه (مثل صفحۀ اصلی سایت) خیلی سریع است نباید معیاری برای کل وبسایت باشد.

پس برای تست سرعت سایت باید ۳ روش مجزا را در نظر بگیرید:

  1. یک تست با رایانه و اتصال اینترنت خودتان
  2.  تست با یک سرور (رایانه‌ای که سخت‌افزار قدرتمندی دارد و همیشه به اینترنت با پهنای باند بالا وصل است)
  3.  تست میانگین سرعت سایت از جمعیت بزرگی از کاربران

در هر کدام از این حالت‌ها امکان دارد نتایج متفاوتی به دست آورید، اما در نهایت میانگین سرعت و تجربه کاربران از وبسایت شما مهم است؛ یعنی همان تستی که PSI انجام می‌دهد.

اولویت اول باید با گزارش PSI و گزارش Core web vitals در سرچ کنسول باشد چون گوگل هم برای سنجش سرعت و تجربه کاربری سایت همان را در نظر می‌گیرد و در رتبه‌بندی سایت‌ها تأثیر می‌دهد. اگر بتوانید وبسایت خود را برای این تست بهینه‌سازی کنید مطمئن باشید در تست با سایر ابزارها هم نتایج خوبی می‌گیرید.

اولویت دوم با تست‌هایی است که با سرور انجام می‌شود. می‌توانید این تست‌ها را در بازه‌های زمانی مختلف تکرار کنید. بخشی از گزارش جی تی متریکس (Gtmetrix) مبتنی بر همین روش است. سروری را هم که می‌خواهید تست از آن انجام شود را خودتان انتخاب می‌کنید و حتی می‌تواند سرعت اینترنت پایین را شبیه‌سازی کند.

اولویت آخر هم با تست‌هایی است که توسط رایانه و اتصال اینترنت خودتان انجام می‌شود. این تست‌ها برای پیدا کردن عواملی که باعث کندی سایت شده‌اند مفید است، اما نتیجه همیشه درست نیست. تست‌هایی که با ابزار Google Lighthouse انجام می‌شود از این روش است.

افزایش سرعت سایت با ۱۳ روش ساده و موثر

در وب‌سایت‌های مختلف روش‌های زیادی برای بالا بردن سرعت سایت نام برده می‌شود. اما ما در این مقاله قصد داریم به ۱۰ روش موثر و ساده‌تر بپردازیم که اجرای آن سختی‌های زیادی به همراه نداشته باشد. قطعاً با اجرای این موارد شاهد افزایش چشمگیر سرعت وب‌سایتتان خواهید بود.

۱. از تصاویر کمتر و کم حجم‌تر استفاده کنید

همانطور که می‌دانید یکی از مهمترین عوامل موثر بر سرعت بارگذاری سایت، حجم صفحات است.تصاویر تاثیر زیادی در افزایش حجم صفحات می‌گذارند. بهتر است برای فعالیت‌های گرافیکی از فرمت PNG و برای تصاویر طبیعی از JPG استفاده شود.

یک راه حل ساده و سریع برای کاهش حجم عکس‌ها، بدون افت کیفیت

شما می‌توانید با مراجعه به سایت  compressor ، عکس‌هایی که میخواهید بهینه کنید را آپلود نمایید و با حجمی کمتر از قبل و بدون افت کیفیت تحویل بگیرید. همچنین می‌توانید با کمک ابزاهایی مثل فتوشاپ، JPEG Imager و… این کار را به راحتی انجام دهید.

۲. از افزونه‌ی کش مرورگر استفاده کنید

هربار که صفحه ای از یک وب‌سایت را باز می‌کنید، سرور سایت اطلاعاتی را از پایگاه داده و فایل‌های PHP دریافت می‌کند و در قالب Html به شما نمایش می‌دهد. اما این پروسه طولانی و زمان‌بر است.برای کوتاه کردن آن کافیست یک افزونه‌ی کش نصب کنید.

اینگونه با اولین load سایت بخشی از اطلاعات صفحه که معمولاً ثابت است (مثل تصاویر و فایل‌های css) در حافظه سیستم کاربر ذخیره می‌شود. حالا اگر کاربر مجدداً وارد همان صفحه شود، دیگر اطلاعات، مراحل طولانی اولیه را طی نمی‌کنند و از کش دریافت می‌شوند.

اگر وب‌سایت شما وردپرسی است می‌توانید از افزونه‌های زیر استفاده نمایید:

  • WP Rocket
  • WPFFPC
  • WP Super Cach
  • W3 total cache

۳. با تبلیغات اسپم خداحافظی کنید

اگر سایتی  تبلیغات محور دارید و از این راه کسب درآمد می‌کنید، بهتر است تعداد تبلیغات را مدیریت کنید. تعداد تبلیغات زیاد علاوه‌ براینکه قشنگ نیست و باعث اسپم تلقی شدن سایتتان می‌شود، سرعت سایت را نیز کند می‌کند.

گوگل، الگوریتمی به نام فرد را مامور مبارزه با سایت‌هایی کرده است که حجم تبلیغات آن‌ها، با محتوایی که تولید می‌کنند، هیچ تناسبی ندارد.

۴. از قالب‌های مناسب استفاده کنید

بسیاری از وبسایت‌ها از سیستم‌های مدیریت محتوا و سایت‌ساز مثل وردپرس استفاده می‌کنند.سعی کنید از قالب‌هایی استفاده کنید که سبک‌ و بهینه تر هستند و با کدنویسی استاندارد بهینه سازی شده اند.

یکی از راه‌‌ها انجام تست سرعت روی نسخه دموی قالب است. معمولاً هر قالب یک نسخه پیش‌نمایش دارد. می‌توانید همان دمو را با PSI تست کنید. البته باید در نظر بگیرید که امکان دارد سروری که نسخه دمو روی آن نصب شده سرور بهتر یا بدتری از سرور خودتان باشد.

طراحی وب سایت

اگر از خدمات طراحی سایت وردپرس شرکت‌های مختلف استفاده کرده‌اید، حتماً از استاندارد بودن طراحی آن مطمئن شوید. در همین راستا تیم آدینه گراف بعد از طراحی هر وب سایت ، یک استعلام معتبر از سرعت اجرای وب سایت طراحی شده، در اختیار کاربران قرار می‌دهد.

۵. از CDN استفاده کنید

CDN مخفف کلمۀ Content Delivery Network است و به معنی شبکۀ توزیع محتوا است.

اگر کاربرانی از کشور‌های مختلف به سایت شما سر می‌زنند، پیشنهاد می‌کنیم به سراغ CDN بروید.با فعال سازی CDN اطلاعات سایت در سرور‌هایی از سرتاسر جهان ذخیره می‌شود. اینگونه اطلاعات برای هر کاربر از نزدیک‌ترین سرور به شخص بارگذاری می‌شود و نه از سرور اصلی سایت ما. این فرآیند باعث می‌شود سرعت لود سایت افزایش یابد.

۶. از فشرده‌ساز Gzip استفاده کنید

هنگامی که کاربری وارد سایت می‌شود، از همان لحظه اول، تا زمانی که تعاملی انجام دهید، درخواست‌های مختلف و پی‌درپی به‌صورت فایل برای سرور ارسال می‌شوند. سرور، برای اینکه بتواند فایل‌ها را بررسی کند و به این درخواست‌ها جواب بدهد، به زمان نیاز دارد؛ پس در نتیجه، هر چه این Request ها فشرده‌تر باشند، سرعت پاسخگویی سرور هم بیشتر شده و سایت زودتر بارگذاری می‌شود.

برای فشرده و بهینه‌تر کردن فایل‌ها، Gzip روی سایت شما نصب می‌شود و قبل از اینکه صفحات سایت یا استایل‌شیت‌ها را برای مرورگر بفرستد، آن‌ها را تا 70% فشرده می‌کند.

چگونه Gzip را فعال کنیم؟

قبل از فعالسازی، بهتر است که به سایت Giftofspeed رفته و فعال بودن یا فعال نبودن Gzip در سایتتان را چک کنید.در صورتی که Gzip روی سایتتان فعال نبود، به شرکت هاستینگ‌تان تیکت بزنید و بخواهید که آن را برایتان فعال کنند.

یک روش دیگر هم برای فعال‌سازی Gzip در وردپرس وجود دارد.فقط کافیست افزونه WP Super Cache استفاده کنید. این افزونه علاوه بر اینکه حجم تصاویر سایت را بهینه می‌کند، Gzip را نیز روی سایتتان فعال کرده و سرعت بارگذاری را کاهش می‌دهد.

نکته: دقت کنید که استفاده از پلاگین‌های بیش‌ازحد در وردپرس، خود یکی از دلایلی است که باعث می‌شود سرعت سایتتان کم شود. علاوه‌براین استفاده از پلاگین‌های مختلف و بعضاً غیر معتبر، امنیت سایتتان را به خطر می‌اندازد.

۷. فعالیت‌های پس زمینه را کنترل کنید

زمانی که ما در صفحه‌ی سایت در حال مشاهده‌ی مطالب هستیم، ممکن است فعالیت‌هایی در پس ‌زمینه در حال انجام باشند. مثلاً افزونه‌‌های پشتیبان‌گیر(backup) در حال تهیه نسخه پشتیبان باشند، یا برنامه‌هایی که از قبل توسط cron jobsها ایجاد کرده‌ایم، اجرا می‌شوند.

این اعمال می‌توانند در سرعت وب‌سایت اثر داشته باشند. بنابراین بهتر است در میزان استفاده از آنها دقت بیشتری به خرج دهیم. همچنین زمان‌بندی اجرای آنها را به ساعاتی که وب‌سایت متحمل ترافیک کمتری است موکول کنیم.

۸. کدها را تمیزکاری و مرتب کنید

با تمیز کد زدن، حذف جاهای خالی، فرمت‌های اضافی، توضیحات کد، ویرگول‌ها، کدهای اضافی و خیلی از موارد غیر ضروری دیگر، سرعت بارگذاری صفحه به شکل غیرقابل‌باوری افزایش پیدا می‌کند؛ پس لطفاً این نکات را جدی بگیرید و به‌کار ببرید.

یکی از ابزارهایی که برای تمیزکاری کدهای CSS خیلی به دادتان می‌رسد، CssNano است. با استفاده این ابزار می‌توانید حجم کدهایتان را تا حد زیادی کاهش دهید و سرعت سایتتان را زیاد کنید.

۹. تعداد ریدایرکت‌ها را کاهش دهید

 ریدایرکت یعنی انتقال کاربر به یک مکان جدیدتا به حال توچه کرده اید گاهی با لینک‌هایی مواجه می‌شوید که با کلیک روی آن بعد از بازشدن آدرسی از سایت به صورت اتومات به صفحه‌ی جدیدی انتقال داده می‌شوید. این همان ریدایرکت است. با کاهش ریدایرکت‌ها می‌توان سرعت سایت را افزایش داد.

برای چک کردن ریدایرکت‌های سایتتان می‌توانید از Redirect mapper استفاده کنید؛ اگر ریدایرکتی به نظرتان غیرضروری بود، آن را پاک کنید.

۱۰. فایل‌های چند رسانه‌ای را در هاست خود میزبانی نکنید.

اگر در سایت خود از ویدیو و پادکست‌های متعدد استفاده می‌کنید، بهتر است آنها را مستقیماً در هاست خود بارگذاری نکنید.برای افزایش سرعت و کاهش هزینه‌های مصرف پهنای باند یک هاست آپلود ویدیو تهیه کنید یا از وب‌سایت‌هایی مثل آپارات کمک بگیرید.

۱۱. حذف جاوا اسکریپت‌هایی که Render-Blocking می‌کنند

Render-Blocking به عملی که مانع تحویل گرفتن (رندر کردن) محتوای صفحه توسط مرورگر گفته میشود.در واقع، مرورگر قبل از اینکه شروع به رندر کردن صفحه کند، با نشانه‌گذاری‌های HTML یک درخت DOM برای آن می‌سازد.

در طول این فرآیند (یعنی تجزیه و تحلیل درخت DOM) اگر مرورگر به موردی (مثل کد جاوا اسکریپت) برخورد کند، عملیات را متوقف و به آن رسیدگی می‌کند.گوگل اصلاً رابطه خوبی با اسکریپت‌های خارجی که بارگذاری محتوای ابتدایی روی صفحه نمایش  را به تعویق می‌اندازند، ندارد.

در تصویر زیر تفاوت نمایش محتوای ابتدایی و بقیه محتوای صفحه را می‌بینید و فکر می‌کنم متوجه شوید که محتوای ابتدایی صفحه (Above the fold) چرا این‌قدر مهم است. در واقع نمایش اولیه همان چیزی است که کاربر را در صفحه نگه می‌دارد؛

 

چگونه از بلاک شدن رندر جلوگیری کنیم؟

برای شروع باید متوجه شوید اصلاً صفحۀ شما دچار مشکل Render-Blocking هست یا نه! برای این کار کافی است سایت خود را با همان ابزار گوگل تست کنید. Google PageSpeed Insights به شما می‌گوید چه قسمت‌های در حال حاضر، بلاکرهای سایت شما هستند.

بعد از تشخیص وجود رندر بلاک ها حالا نوبت به راه های حذف آن ها میرسد:

1- از آوردن کدهای جاوا در Header خودداری کنید

آوردن اسکریپت در هدر باعث می‌شود اولین رسم محتوا در صفحه (یا تجزیه درخت DOM) با وقفه روبرو شود. بهتر است اسکریپت‌ها را در فوتر صفحه بیاوریم.

2- اسکریپ‌های ضروری را خطی کنید

گاهی اوقات ممکن است کد جاوا اسکریپ آنقدر ضروری باشد مجبور باشید آن را حتماً در هدر سایت بیاورید. در چنین مواقعی، بهتر است به‌جای اسکریپت خارجی (External)، از اسکریپت خطی (Inline) استفاده کنید.اسکریپت‌های خطی، بر خلاف اسکریپت‌های اکسترنال که محتوا را از یک منبع خارجی می‌خوانند، داخل همان صفحه بارگذاری می‌شوند.

فقط دقت کنید که اگر از اسکریپت Inline در هدر استفاده می‌کنید، حتماً حجم آن فشرده باشد. مواردی که گفته شد، درباره کدهای JQuery هم صدق می‌کند.

۱۲. از حالت lazy load استفاده کنید

اگر از تصاویر و ویدیوهای متفاوت در وب‌سایت استفاده کرده‌اید بهتر است حالت lazy load یا همان بارگذاری کند را فعال کنید. در این روش به جای load شدن یک‌باره‌ی همه‌ی تصاویر و ویدیو‌ها، بارگذاری متناسب با بخش قابل روئیت صفحه انجام می‌شود. یعنی هربار که کاربر به سمت پایین صفحه اسکرول کند، تصاویر آن بخش بارگذاری می‌شوند. این روش تاثیر خوبی در بالا بردن سرعت سایت خواهد داشت. برای فعال کردن آن نیز می‌توانید از افزونه‌هایی همچون WP Rocket استفاده نمایید.

۱۳. برای نسخۀ موبایل از Google AMP استفاده کنید

AMP (مخفف Accelerated Mobile Page)، یک تکنولوژی است که کمک می‌کند سایت‌های نسخۀ موبایل، در سریع‌ترین حالت ممکن بارگذاری شوند.گوگل سایت‌هایی را که AMP ساخته‌اند پیدا و محتوای آن‌ها را در هاست خودش ذخیره می‌کند. با این کار هر بار کاربری با موبایلش وارد سایت شما شود، گوگل سریعاً محتوایی که استاندارد AMP دارد را از هاست خودش بارگذاری کرده و نمایش می‌دهد.

چگونه صفحه AMP بسازیم ؟

برای این کار شما باید نسخۀ دیگری از سایتتان بسازید که استانداردهای پروژۀ AMP در آن رعایت شده باشد. بعد از ساختن AMP، آدرس سایت در نسخۀ موبایلی به چیزی مشابه site.com/page/amp تغییر می‌کند و با یک علامت (مثل عکس زیر) در نتایج جستجو نشان داده می‌شود.

توجه: AMP علی‌رغم خوبی‌هایی که دارد، همیشه هم به نفع سایت نیست. مثلاً طراحی UI با محدودیت‌هایی روبرو می‌شود، گاهی کاربر برای نظر دادن باید به نسخۀ غیر AMP منتقل شود (یعنی عملاً دوبار یک صفحه را ببیند) و حتی ممکن است بخشی از دیتاهای گوگل آنالیتیکس را از دست بدهید

 

جمع‌بندی

ما سعی کردیم در این مقاله تمام مواردی که برای افزایش سرعت سایت و روش‌های بهینه‌سازی آن می‌دانستیم،به شما منتقل کنیم. اگر راه حل دیگری بلدید که می‌توانیم به مقاله اضافه کنیم حتماً ما را در جریان بگذارید؛ اگر هم سوالی داشتید یا جایی از مقاله برایتان مبهم بود، حتماً در بخش نظرات مطرح کنید،تا در کوتاهترین زمان پاسختان را بدهیم.

دیدگاه بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *