۷ روش برای بارگذاری سریع‌تر وبسایت یا وبلاگ شما برای بازدید کنندگان
1397/12/26 17:41 , میلاد صاحب نظر

۷ روش برای بارگذاری سریع‌تر وبسایت یا وبلاگ شما برای بازدید کنندگان

سرعت کم بارگذاری صفحه یکی از دلایل اصلی به دست نیاوردن بازدیدهای کافی سایت‌ها است.

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

  1. حجم یا سایز وبسایت خود را کاهش دهید

حجم یا سایز وبسایت خود را کاهش دهید

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

بیش از ۷۰٪ صفحات وب موبایل بیشتر از ۱ مگابایت حجم دارند و ۱۲٪ آن‌ها بیشتر از ۴ مگابایت حجم دارند! به خاطر داشته باشید که ۷ ثانیه طول می‌کشد تا با یک اتصال 3G خوب، یک فایل با حجم ۱.۵ مگابایت بارگذاری یا دانلود شود.

بنابراین بهترین کار این است که حجم هر صفحه از وبسایت شما کمتر از ۰.۵ مگابایت باشد.

حتما تفاوت بین فرمت‌های JPG، PNG و GIF را بیاموزید و اطمینان حاصل کنید که از وضوح مناسب استفاده کنید.

با توجه به سایت GlobalStats، این‌ها مورد استفاده‌ترین وضوح تصویر در سال ۲۰۱۸ هستند:

  • ۲۲.۵۵٪ از وضوح ۶۴۰×۳۶۰ استفاده می‌کنند(موبایل)
  • ۱۱.۷۳٪ از وضوح ۷۶۸×۱۳۶۶ استفاده می‌کنند
  • ۸.۲۶٪ از وضوح ۱۰۸۰×۱۹۲۰ استفاده می‌کنند
  • ۴.۹۱٪ از وضوح ۶۶۷×۳۷۵ استفاده می‌کنند(موبایل)
  • ۲.۹۴٪ از وضوح ۹۰۰×۱۴۴۰ استفاده می‌کنند

این آمار شامل بیش از ۵۰٪ از همه کاربران می‌باشد، پس وقتی می‌خواهید به وبسایت خود تصویر اضافه کنید، این آمار را در نظر داشته باشید.

  1. وبسایت خود را برای موبایل طراحی کنید

با توجه به تحقیقات انجام شده توسط گوگل در سال گذشته در مورد سرعت صفحات موبایل:

"با توجه به بررسی‌های اخیر، زمان متوسطی که طول می‌کشد تا یک صفحه فرود موبایل بارگذاری شود ۲۲ ثانیه است. ولی ۵۳٪ از بازدید کنندگان سایت‌های موبایلی، اگر زمان بارگذاری یک صفحه از ۳ ثانیه بیشتر طول بکشد، آن سایت را ترک خواهند کرد. این یک مشکل بزرگ است."

بیش از ۷۵٪‌ از سایت‌های موبایل، با یک اتصال  3G خوب، ۱۰ ثانیه یا بیشتر زمان می‌برد تا بارگذاری شوند. بیش از نیمی از ترافیک اینترنت از طریق گوشی‌های موبایل است و این موضوعی نیست که بتوان آن را نادیده گرفت.

بنابراین وبسایت خود را موبایل پسند کنید تا کاربران موبایلی راضی شوند و بتوانید این حجم بزرگ از کاربر را حفظ کنید.

اگر از یک CMS مانند ورد پرس، جوملا یا Drupal استفاده می‌کنید، افزونه‌هایی وجود دارند که می‌توانید برای موبایل پسند کردن وبسایت خود از آنها کمک بگیرید.

همچنین می‌توانید از ابزارهایی مانند bMobilizer یا Duda Mobile برای تبدیل وبسایت رایانه‌ای به وبسایت موبایلی استفاده کنید. با این حساب، گاهی بهترین کار این است که یک وبسایت مجزا طراحی کنید تا مطمئن باشید که بهترین تجربه کاربری را برای کاربران موبایل خود فراهم می‌کنید.

همچنین بد نیست که با بهره‌گیری از پروژه صفحات موبایل افزایش سرعت یافته(AMP)، یک ورژن ساده‌سازی شده از وبسایت خود را برای کاربران موبایلی ارائه دهید. استفاده از صفحات AMP، سرعت بارگذاری صفحات در موبایل را افزایش خواهد داد.

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

به هر حال در هر روشی که انتخاب می‌کنید، اطمینان حاصل کنید که وبسایت موبایل شما تا حد ممکن کم حجم و سبک باشد. حجم توصیه شده برای هر صفحه کمتر از ۰.۵ مگابایت است.

  1. اطمینان حاصل کنید که وبسایت شما متراکم شود

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

کدهای CSS، HTML و جاوا اسکریپت خود را متراکم و با هم ترکیب کنید. برای مثال اگر از یک CDN مانند Cloudflare استفاده می‌کنید، یک تب خاص برای افزایش سرعت وجود دارند که اولین آپشن آن Auto Minify است.

اگر از یک وبسایت ساز استفاده می‌کنید(مانند Squarespace یا Weebly)، پس این کار به صورت پیش‌فرض برای شما انجام می‌شود.

آپشنت auto minify

آپشنت auto minify

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

  1. از بارگذاری اسکریپت‌های غیر ضروری، خودداری کنید

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

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

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

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

Async به مرورگر می‌گوید به parse کردن HTML ادامه دهد و در عین حال، فایل‌های جاوا اسکریپت هم دانلود شوند. سپس بعد از اینکه فایل کاملا دانلود شد، توقف موقت بارگذاری این فایل‌ها اتفاق می‌افتد.

از طرف دیگر، defer به مرورگر می‌گوید که وقتی کار parse کردن کل سند HTML به اتمام رسید، آنگاه فایل‌های جاوا اسکریپت را اجرا کن.

وقتی فایل‌های جاوا اسکریپت در حال گردآوری و اجرا شدن هستند، یک مرورگر به صورت پیش‌فرض فرآیند parse کردن فایل‌های HTML را موقتا متوقف می‌کند.

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

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

می‌توانید بدون هیچ مشکلی از defer و Async روی Google Analytics، Facebook Pixel و دیگر ابزارهای بررسی استفاده کرده و همچنین می‌توانید از ابزارهای گزارش دهی خطا بدون تاثیرگذاری بر کارایی صفحه بهره ببرید.

در آخر، بررسی کنید که آیا کدهای پیگیری، بررسی‌ها، ویژگی‌های اضافه و تبلیغاتی که روی وبسایت خود استفاده می‌کنید واقعا ضروری هستند یا خیر.

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

  1. از caching و یک CDN استفاده کنید

امنیت CDN

امنیت CDN

یک شبکه تحویل محتوا(CDN) سایت شما را روی سرورهای سراسر جهان کپی کرده و با متصل کردن بازدید کنندگان به سروری که از نظر جغرافیایی به آنها نزدیک‌تر است، زمان انتقال داده‌ها را کاهش می‌دهد. همچنین محتوای static نیز توسط سرورهای CDN کش و تحویل داده می‌شوند.

Cloudflare احتمالا معروف‌ترین CDN موجود است، اما Akamai و Amazon CloudFront نیز گزینه‌های خوبی هستند.

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

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

  1. افزونه‌های غیر ضروری را کنار بگذارید

فقط باید هر موقع لازم بود از افزونه‌ها استفاده کنید. چه از Wix، چه از Weebly یا ورد پرس یا هر چیز دیگری که استفاده کنید این قانون برای شما صدق می‌کند. اگر می‌توانید یک ویژگی را به جای استفاده از افزونه، با کدهای CSS به برنامه خود اضافه کنید، باید این کار را بکنید.

افزونه‌ها باعث درگیری شدید CPU یا حافظه در سرور شما می‌شوند و این امر می‌تواند سرعت بارگذاری سایت شما را کاهش داده یا حتی آن را متوقف کنند.

اگر از ورد پرس استفاده می‌کنید، احتمال دارد که از همه ویژگی‌های آن استفاده نکنید. پس می‌توانید آن ویژگی‌ها را با استفاده از افزونه‌ای مانند Clearfy غیر فعال کنید.

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

  1. تنظیمات سرور برای افزایش سرعت بارگذاری وبسایت

تاخیر سرور تاثیر منفی بسیار بزرگی بر سرعت بارگذاری صفحه و رتبه وبسایت شما دارد.

گوگل توصیه می‌کند که زمان ظاهر شدن اولین بایت(TTFB) باید ۱.۳ ثانیه یا کمتر باشد. این بیشترین تاخیری است که پیش از شروع دانلود صفحه توسط دستگاه (بعد از اینکه ارتباط اولیه با سرور برقرار شد) می‌تواند وجود داشته باشد.

با این حساب، یک وبسایت متوسط دارای TTFB بیش از ۲ ثانیه است که بیشتر از زمان توصیه شده توسط گوگل است.

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

  • استفاده از آخرین ورژن PHP که وبسایت شما با آن سازگار است. آخرین ورژن (PHP 7.2) پیشرفت عظیمی در زمینه سرعت بارگذاری سایت داشته است.
  • فعال کردن گزینه “Keep-Alive”
  • فعال کردن HTTP/2
  • بهره‌گیری از ویژگی امنیت انتقال شدید HTTP(HSTS)
  • زمان بکاپ گیری را برای شب‌ها تنظیم کنید.

اگر وبسایت شما در ورد پرس ساخته شده باشد، حتما از هاستی استفاده کنید که مخصوص هاستینگ ورد پرس باشد(مانند Bluehost). این کار باعث می‌شود مطمئن شوید که تنظیمات سرور مخصوصا برای عملکرد ورد پرس تنظیم شده‌اند.

همه نکات را خواندید؟ حالا سایت خودتان را تست کنید

تست مشخصات فنی سایت

تست مشخصات فنی سایت

حالا که از زمان بارگذاری ایده آل، حجم مناسب و زمان ظهور اولین بایت(TTFB) توصیه شده آگاه هستید، از کجا می‌فهمید که این مشخصات در سایت شما چگونه هستند؟

در زیر چند ابزار آنلاین برای تست سایتتان مشاهده می‌کنید:

  • varvy.com: این ابزار سرعت صفحه سایت رایانه و موبایل و عملکرد وبسایت شما را تست می‌کند و راهنمایی‌های ارزشمندی در مورد چگونگی بهبود وبسایت به شما ارائه می‌دهد.
  • Google PageSpeed Insight: این ابزار که اخیرا به روز رسانی شده است، سرعت شما را تست کرده و پیشنهادات خوبی برای بهبود سایت به شما ارائه می‌دهد.
  • Gtmetrix: یک ابزار عالی با مشاوره‌های مفید
  • WebPageTest: وبسایت شما را روی چندین دستگاه ، چندین سیستم‌عامل و چندین موقعیت مختلف تست می‌کند.
  • Pingdom: یک ابزار بسیار محبوب مشابه WebPageTes با یک واسط کاربری خیلی بهتر

می‌توانید سایت موبایل خود را با لینک‌های بالا تست کنید، همچنین می‌توانید از ThinkWithGoogle Mobile Test نیز استفاده کنید. نتایجی که از این سایت‌ها به دست می‌آورید، راهکارهای خوب و مناسبی برای بهبود سایت به شما ارائه می‌دهند.

همچنین میزان تقریبی کاهش زمان بارگذاری صفحه را نیز به شما ارائه می‌دهند(در صورتی که از نکات و مشاوره‌های ارائه شده توسط آن سایت‌ها استفاده کنید).

بهترین اعمال توصیه شده در این زمینه دائما در حال تغییر هستند، بنابراین مرتبا سرعت بارگذاری صفحه وبسایت خود را بررسی کنید تا در صورت لزوم بتوانید سایت خود را بهبود دهید.

برای اینکه بتوانید بینش بهتر و کامل‌تری در مورد چگونگی عملکرد وبسایت خود به دست آورید، به یاد داشته باشید که دامنه خود را روی گوگل و Bing تایید اعتبار کنید.

منبع: makeuseof

 مطالب مرتبط

بهترین قالب‌های رایگان HTML5 و CSS3
۹ چیز که باید در مورد HTML5 بدانید
ایجاد یک فرم HTML و تکمیل خودکار فرم‌ها
آموزش زبان HTML (مقدماتی)
تعامل با فایل‌ها در HTML5
برنامه نویسی شیءگرا چیست؟

از آخرین دوره های آموزشی و تخفیف ها مطلع شوید

با تکمیل فرم زیر ، از اخبار و اطلاعات به روز برنامه نویسی و تکنولوژی عقب نمانید

آخرین مطالب

آموزش جامع SQL Server (جلسه ۱۲)
آموزش جامع SQL Server (جلسه ۱۲)

دستور UPDATE در SQL Server برای تغییر داده‌های موجود در یک جدول، از دستور UPDATE به شکل زیر استفاده ...

آموزش جامع SQL Server (جلسه ۱۵)
آموزش جامع SQL Server (جلسه ۱۵)

دستور DROP TABLE در SQL Server گاهی، لازم است یک جدول که دیگر استفاده‌ای ندارد را حذف کنید. برای ...

آموزش جامع SQL Server (جلسه ۳۵: Window Functionها – بخش ۲)
آموزش جامع SQL Server (جلسه ۳۵: Window Functionها – بخش ۲)

بخش اول از آخرین مبحث دوره جامع آموزش SQL Server در جلسه قبلی بررسی شد. این مبحث که ...

آخرین دیدگاه ها

دیدگاه خود را درباره این پست بنویسید

فرم ارسال نظرات