عناوین
سرعت پایین بارگذاری صفحه یکی از دلایل اصلی عدم توجه لازم از سوی کاربران نسبت به یک وبسایت است. بنابراین در این نوشته به معرفی برخی روشهای بارگذاری سریع تر وبسایت یا وبلاگ جهت افزایش ترافیک ورودی آن پرداختهایم.
کاهش اندازه واقعی وبسایت
اگر وبسایت شما در زمانی کندتر از سه ثانیه بارگذاری میشود، به احتمال زیاد بازدیدکنندگان، آن را حتی قبل از آن که صفحه اصلی بارگذاری شود ترک میکنند. استفاده از فرمت نادرست برای تصاویر باعث سنگین شدن وبسایت شده و تجربه کاربری بازدیدکنندگان را ناخوشایند میکند.
بیش از ۷۰ درصد صفحههای وب موبایل بالاتر از ۱ مگابایت حجم دارند و ۱۲ درصد نیز بالاتر از ۴ مگابایت هستند. به خاطر داشته باشید که دانلود یک صفحه ۱٫۵ مگابایتی در سرعت مناسب شبکه ۳G به ۷ ثانیه زمان نیاز دارد. بهترین رویه این است که حجم صفحههای خود را زیر ۰٫۵ مگابایت حفظ کنید.
تفاوت ها!
تفاوت بین فرمتهای JPG ،PNG و GIF را بشناسید و مطمئن شوید که از مورد مناسب برای تصاویر وبسایت خود استفاده میکنید. بر اساس گزارش وبسایت GlobalStats، در سال ۲۰۱۸ بیشترین دقت صفحه نمایشهایی که کاربران استفاده کردهاند به صورت زیر بوده است:
۲۲٫۵% از دقت صفحه نمایش ۳۶۰×۶۴۰ (موبایل) استفاده کردهاند.
۱۱٫۷۳% از دقت صفحه نمایش ۷۶۸×۱۳۶۶ استفاده کردهاند.
۸٫۲۶% از دقت صفحه نمایش ۱۰۸۰×۱۹۲۰ استفاده کردهاند.
۴٫۹۱% از دقت صفحه نمایش ۶۶۷×۳۵۷ (موبایل) استفاده کردهاند.
۲٫۹۴% از دقت صفحه نمایش ۹۰۰×۱۴۴۰ استفاده کردهاند.
این تعداد بیش از ۵۰% از همه کاربران وب را تشکیل میدهد، بنابراین باید این آمار را در هنگام افزودن تصاویر به وبسایت در نظر داشته باشید.
وبسایت خود را برای موبایل طراحی کنید
بر اساس تحقیقی که از سوی گوگل در سال گذشته در مورد سرعت موبایل صورت گرفته است:
میانگین زمان موردنیاز برای بارگذاری یک صفحه فرود موبایل ۲۲ ثانیه بوده است. با این حال ۲۳% از بازدیدکنندگان وبسایتهای موبایل صفحهای را که بارگذاری آن بیش از ۳ ثانیه طول بکشد ترک میکنند. این یک مشکل عمده است.
بیش از ۷۵% از وبسایتهای موبایل روی یک اتصال ۳G در مدتی بیش از ۱۰ ثانیه بارگذاری میشوند. از آنجا که بیش از نیمی از ترافیک وب از منبع دستگاههای موبایل ناشی میشود، این وضعیت یک مشکل بزرگ است. بنابراین باید اندازه وبسایت را پایین نگه داشت تا کاربران اینترنت موبایل خوشحال بمانند و وبسایت را ترک نکند.
اگر از یک CMS مانند وردپرس، جوملا یا دروپال استفاده میکنید، افزونههایی وجود دارند که به مناسبسازی وبسایت برای موبایل کمک میکنند.
ابزار هایی برای ریسپانسیو
همچنین میتوانید از ابزارهایی مانند bMobilized یا Duda Mobile برای تبدیل وبسایت دسکتاپ به نوع موبایل استفاده کنید. با این حال بهترین رویه این است که وبسایت موبایل را همیشه جدا نگهدارید تا مطمئن شوید که بهترین تجربه کاربری را در اختیار کاربران موبایل قرار میدهید.
همچنین باید یک نسخه ساده شده از وبسایت را با استفاده از پروژه Accelerated Mobile Pages گوگل که به اختصار AMP نامیده میشود طراحی کنید. با استفاده از AMP سرعت بارگذاری صفحهها روی گوشیهای موبایل افزایش مییابد. راهنماییهای صریحی در مورد جاوا اسکریپت و CSS وجود دارند؛ اما منافع آنها ناچیز هستند.
در هر حال هر کاری که میخواهید انجام بدهید، باید مطمئن شوید که وبسایت موبایل شما یک گزینه سبک محسوب میشود. همچنین همواره سعی کنید حجم صفحهها را پایینتر از ۰٫۵ مگابایت نگهدارید.
وبسایت خود را minify کنید
اگر کد وبسایتتان را از صفر خودتان نوشتهاید و به طور منظم آن را ویرایش میکنید، با پیشرفت پروژه وبسایت، احتمالاً روشهای بهینهتری برای انجام کارها مییابید و از این رو باید مطمئن شوید که همواره کد وبسایتتان را بهینه نگهداری میکنید.
اگر از نسخه HTTP/1.1 استفاده میکنید، باید فایلهای CSS ،HTML و جاوا اسکریپت خود را minify کنید. اگر از یک CDN مانند Cloudflare استفاده میکنید، یک برگه خاص برای بهبود سرعت وجود دارد که در آن گزینهای به نام Auto Minify قرار داده شده است. اگر از یک سرویس آنلاین وبسایتساز مانند Squarespace یا Weebly استفاده کردهاید، این کار احتمالاً قبلاً صورت گرفته است.
اما پس از هرگونه ترکیب منابع یا minify کردن همه چیز وبسایت خود را تست کید تا از بارگذاری صحیح آن مطمئن شوید. گزینههای مختلف را تست کنید و ببینید کدام یک برای وبسایت شما بهتر است. در هر صورت دقت کنید که اگر از HTTP/2 استفاده میکنید، احتمالاً minify یا ترکیب کردن منابع کمکی به بهبود سرعت بارگذاری صفحه نمیکند.
اجتناب از بارگذاری اسکریپتهایی که لازم نیستند
این که چندین فایل جاوا اسکریپت را پیش از آن که مورد نیاز باشند بارگذاری کنید، باعث میشود که سرعت بارگذاری کلی صفحه وبسایت به صورت غیرضروری کاهش یابد. همچنین در صورت امکان سعی کنید از بارگذاری اسکریپتها از وبسایتهای شخص ثالث اجتناب کنید.
بیشتر بخوانید :
بخش اول افزایش سرعت سایت با ۹ راهکار عالی بهبود سئو
درخواست کردن این فایلها موجب کاهش سرعت بارگذاری صفحه میشود و همچنین ریسک امنیتی نیز با خود به همراه دارد. در حد امکان فایلها را در سرورهای خود نگهداری کنید.
defer & async
شما میتوانید از defer یا async برای به تأخیر انداختن بارگذاری فایلهای جاوا اسکریپت خاص استفاده کرده و فشار روی دستگاه بازدیدکننده را کاهش و همچنین سرعت بارگذاری صفحهها را افزایش دهید. همچنین در مورد اسکریپتهای کوچک میتوان آنها را مستقیماً درون سندهای HTML به صورت inline آورد. البته این کار در صورت استفاده از HTTP/2 موجب افزایش سرعت نمیشود و شاید سرعت را کاهش نیز بدهد.
Async به مرورگر اعلام میکند که به تجزیه سند HTML در زمانی که فایلهای جاوا اسکریپت همچنان در حال دانلود هستند ادامه بدهد. بدین ترتیب مکث موردنیاز در زمان دانلود شدن کامل فایل رخ میدهد.
در عین حال، defer به مرورگر اعلام میکند که فایلهای جاوا اسکریپت را پس از این که مرورگر کار تجزیه کل سند را تمام کرد اجرا کند. مرورگر به طور پیشفرض تجزیه سندهای HTML را زمانی که فایلهای جاوا اسکریپت واکشی شده اجرا شوند متوقف میکند.
در چاگذاری اسکریپت ها دقت فرمائید
Inline کردن کدهای جاوا اسکریپت در فایلهای HTML موجب میشود که تعداد فایلهای موردنیاز مرورگر برای دانلود پیش از نمایش صفحه کاهش یابد. شما میتوانید کدهای جاوا اسکریپت را با افزودن محتوای هر فایل جاوا اسکریپت بین تگهای <script> به صورت inline در آورید. در این مورد توجه داشته باشید که در صورت استفاده از HTTP/2 این کار کمک چندانی به بهبود سرعت بارگذاری صفحه نمیکند.
شما میتوانید بارگذاری ابزارهای Google Analytics ،Facebook Pixel و دیگر ابزارهای تحلیلی را بدون این که تأثیری روی کارکرد صفحه داشته باشد به تأخیر بیندازید.
در نهایت باید گفت که میبایست بررسی کنید آیا کدهای ردگیری، ابزارهای تحلیلی، امکانات اضافی و تبلیغاتی که روی صفحه دارید واقعاً ضروری هستند یا نه. در حد امکان سعی کنید از گزینههای سبکتر استفاده کنید و اگر ارزشی برای بازدیدکنندگان شما ندارند حذف کنید.
استفاده از یک ابزار کَش و CDN
«شبکه تحویل محتوا» (Content Delivery Network) یا به اختصار CDN وبسایت شما را روی سرورهایی در سراسر جهان کپی میکند و بدین ترتیب زمان مورد نیاز برای انتقال دادهها را با عرضه وبسایت از محل جغرافیایی نزدیکتر به کاربر کاهش میدهد. محتوای استاتیک را نیز میتوان از سوی سرورهای CDN کش کرده و تحویل داد.
- مقاله ای که حتما توصیه می شود مطالعه بفرمائید : معرفی کلود فلیر برای افزایش سرعت سایت
کلودفلیر یکی از بزرگترین CDN های موجود است؛ اما Akamai و Amazon CloudFront نیز جایگزینهای مناسبی محسوب میشوند. باید اطمینان حاصل کنید که از کش کردن در مرورگر نیز برای بهبود سرعت بارگذاری وبسایت خود برای بازدیدکنندگان تکراری بهره میگیرید. کش کردن مرورگر با دانلود کردن فایلهای وبسایت روی دستگاه محلی کاربر انجام میپذیرد.
بدین ترتیب کاربران در موارد بعدی که از وبسایت بازدید میکند برخی فایلهای وبسایت را از دستگاه محلی خود بارگذاری میکنند و دیگر برای دانلود آنها از سرور شما درخواست نمیدهند.
از شر افزونههای غیرضروری خلاص شوید
افزونهها تنها در موارد ضرورت باید استفاده شوند. این وضعیت در هر حالت باید در نظر شما باشد. در مورد هر ویژگی که میتوان با افزودن کد یا CSS اضافه کرد، نباید از افزونه استفاده شود. برای نمونه میتوانید از روشهای تزریق کد و همچنین سفارشیسازی CSS در پلتفرمهای مختلف استفاده کنید.
افزونهها میتوانند موجب مصرف بالای CPU یا حافظه در سرور شوند و این امر میتواند موجب کند یا متوقف شدن بارگذاری وبسایت شود. اگر از وردپرس استفاده میکنید، این احتمال وجود دارد که از همه ویژگیهای داخلی آن بهره نمیگیرید و بنابراین میتوانید این موارد را با استفاده از افزونهای به kام Clearfy غیرفعال کنید.
همواره افزونههایی که استفاده میکنید را در نظر داشته باشید و اگر از برخی امکانات محدود یک افزونه استفاده میکنید بهتر است که کلاً آن را حذف کنید و به جای آن از افزونههای سبکتر برای انجام همان کار بهره بگیرید.
تنظیم سرور برای افزایش سرعت وبسایت
تأخیر سرور تأثیر منفی زیادی روی سرعت بارگذاری صفحه و رتبه صفحه (PageRank) وبسایت شما دارد. گوگل توصیه میکند که پارامتر «زمان بارگذاری نخستین بایت» (Time to First Byte) یا TTFB باید کمتر از ۱٫۳ ثانیه باشد.
این طولانیترین تأخیری است که یک دستگاه پیش از آغاز دانلود کردن یک صفحه باید داشته باشد. با این حال زمان میانگین TTFB صفحه وبسایتها بالاتر از ۲ ثانیه است که بسیار بیشتر از مقادیر توصیه شده محسوب میشود.
میزبانهای اشتراکی معمولاً دلیل بروز این مسئله هستند؛ اما برخی تنظیمات روی سرور نیز میتوانند به بهبود زمان پاسخدهی سرور کمک کنند.
از آخرین نسخه PHP که وبسایت شما پشتیبانی میکند استفاده کنید. برای نمونه آخرین نسخه ۷٫۲ از PHP بهبودهای مناسبی برای سرعت ارائه کرده است.
از حالت «Keep-Alive» استفاده کنید.
HTTP/2 را فعال کنید.
از مزیت امنیت انتقال صریح HTTP یا به اختصار HSTS استفاده کنید.
پشتیبانگیریهای کامل خود را به زمان شب موکول کنید.
اگر وبسایت شما با وردپرس ساخته شده است، باید اطمینان حاصل کنید که از میزبانی استفاده میکنید که برای میزبانی وردپرس بهینهسازی شده است. بدین ترتیب تنظیمات سرور میزبان برای بهرهگیری بیشترین عملکرد از وردپرس پیکربندی میشود.
تست وبسایت
اینک که با روشهای بهبود سرعت بارگذاری صفحههای وبسایت آشنا شدید، نوبت آن رسیده است که میزان سرعت بارگذاری صفحههای وبسایت خود را اندازهگیری کنید.
در ادامه برخی از ابزارهای آنلاین محبوب برای تست وبسایت را ارائه کردهایم:
varvy.com: این ابزار سرعت بارگذاری و عملکرد صفحههای دسکتاپ و موبایل را اندازهگیری میکند و راهنماییهای ارزشمندی در مورد بهبود وبسایت ارائه میکند.
Google PageSpeed Insight: این ابزار گوگل که اخیراً بهروزرسانی شده است سرعت بارگذاری صفحههای وبسایت را اندازهگیری کرده و پیشنهادهایی در جهت بهبود آن ارائه میکند.
GTmetrix: این وبسایت یک ابزار عالی با توصیههای قابل اجرا است.
WebPageTest: این ابزار آنلاین وبسایت شما را با استفاده از دستگاههای مختلف و سیستمهای عامل متفاوت از مکانهای گوناگون تست میکند.
Pingdom: این ابزار کاملاً محبوب مشابه WebPageTest است و رابط کاربری زیبایی دارد.
جمع بندی
شما میتوانید سایت موبایل خود را با استفاده از لینکهای فوق تست کنید و از نتایج آن برای بهبود سرعت بارگذاری و عملکرد وبسایت بهره بگیرید. توجه داشته باشید که بهترین رویههای توصیه شده به طور مداوم در حال تغییر هستند.
برای مثال اگر از HTTP/2 استفاده میکنید، بسیاری از توصیههای این راهنما در مورد وبسایت شما موضوعیت نخواهد داشت، بنابراین سعی کنید به طور مرتب این توصیهها را دنبال کرده و بر اساس آخرین استانداردها وبسایت خود را بهینهسازی کنید.
منبع : بلاگ فرادرس