هیچ چیز به اندازه یک وب سایت کند خسته کننده نیست.
یک وب سایت کند نه تنها برای کاربر نهایی، بلکه برای بهینه سازی موتورهای جستجو (SEO) نیز مضر است. به این معنی که می تواند باعث شود وب سایت شما در نتایج موتورهای جستجو رتبه پایین تری داشته باشد. این باعث بازدید کمتر از صفحه و درآمد کمتر تبلیغات یا تبدیل مشتری برای شما می شود.
در زیر نه روشی را به اشتراک می گذارم که می توانید وب سایت خود را سریعتر بارگذاری کنید. در حالی که این مقاله برخی نکات کلی را به اشتراک می گذارد، برخی از آن ها را نیز فقط برای سایت های وردپرسی شامل می شود. در طول مقاله، من به وضوح نشان میدهم که چه نکاتی برای کاربران WP است و کدام یک میتواند برای همه باشد.
چرا سرعت وب سایت شما مهم است
سرعت وب سایت شما به دو دلیل مهم است:
- تجربه کاربر شما
- سئو
زمانی که صحبت از تجربه کاربر به میان می آید، آزمایشات تحقیقاتی گوگل نشان می دهد که سرعت بیشتر سایت منجر به رضایت بیشتر کاربران، افزایش بهره وری و زمان بیشتر کاربران برای مرور می شود.
علاوه بر این، تحقیقات Kissmetrics نشان داد که 40٪ از مردم اگر یک سایت بیشتر از سه ثانیه طول بکشد، آن را رها می کنند. 47 درصد از کاربران انتظار دارند یک صفحه در دو ثانیه یا کمتر بارگذاری شود.
به طور کلی، سرعت سایت شما تاثیر بیشتری بر رضایت کاربر نسبت به “زنگ و سوت” اضافی دارد. مهم نیست که یک سایت چقدر عالی به نظر می رسد: اگر خیلی آهسته بارگذاری شود، کاربران کلیک می کنند.
در مورد سئو، گوگل از سرعت سایت به عنوان یکی از عوامل متعددی که رتبه را تعیین می کند (که صفحه شما در نتایج جستجو چقدر بالا ظاهر می شود) استفاده می کند.
کسب اطلاعات بیشتر: 7 عنصر یک وب سایت خوب
برای تعیین رتبه بندی، گوگل سرعت صفحه را در پلتفرم های دسکتاپ و موبایل فاکتور می کند. اگر سرعت سایت شما در حد یکسان نباشد، ممکن است با جریمه های رتبه بندی مواجه شوید.
Bing همچنین از سرعت صفحه به عنوان یک عامل استفاده می کند.
دلیل اهمیت سرعت سایت این است که موتورهای جستجو می خواهند کاربران را به سایت هایی با بهترین تجربه و اطلاعات کلی راهنمایی کنند. اگر سایت شما به طور غیرقابل تحمل کند باشد، کاربران نمی توانند به تمام اطلاعات عالی که شما دارید دسترسی پیدا کنند.
چگونه سرعت وب سایت خود را بررسی کنیم
برای اینکه بفهمید وب سایت شما کند است یا نه، از یکی از بسیاری از ابزارهای رایگانی که برای گزارش درست طراحی شده است استفاده کنید. در اینجا چندین مورد وجود دارد:
- Google’s PageSpeed Insights: ابزار بسیار خود گوگل. توصیه های موبایل و دسکتاپ را ارائه می دهد.
- Pingdom: برای تمام سطوح مهارت مفید است. عملکرد سایت را بررسی می کند، آن را درجه بندی می کند و تاریخچه عملکرد را ردیابی می کند تا بتوانید ببینید سرعت سایت شما چگونه تغییر کرده است.
- GTmetrix: یکی از محبوب ترین ابزارهای موجود. GTmetrix میزان بارگیری سایت شما را تجزیه و تحلیل می کند و امتیازات PageSpeed و YSlow را بررسی می کند. همچنین پیشنهاداتی در مورد چگونگی بهبود زمان بارگذاری ارائه می دهد.
- YSlow: صفحات وب را در مورد نحوه مطابقت با دستورالعمل های تعیین شده با عملکرد بالا درجه بندی می کند. همچنین اجزای مختلف وب سایت را خلاصه می کند و به شما امکان می دهد تجزیه و تحلیل را مشاهده کنید، توصیه هایی در مورد چگونگی بهبود سایت خود ارائه می دهد. YSlow یک افزونه کروم برای آزمایش سرعت وب سایت ها ارائه می دهد.
مورد علاقه شخصی من، PageSpeed Insights گوگل است. استفاده از آن آسان است و نتایج به وضوح ارائه می شوند. همچنین پیشنهادات را بر اساس «باید اصلاح»، «در نظر گرفتن اصلاح» و «قوانین تصویب شده» سازماندهی میکند.
من هم Pingdom را دوست دارم و در ادامه مقاله به آن بیشتر اشاره خواهم کرد.
بدانید که نتایج می تواند از ابزاری به ابزار دیگر متفاوت باشد. این کاملاً طبیعی است زیرا آنها معیارهای متفاوتی دارند و از مکان های مختلف جهان برای آزمایش سایت استفاده می کنند.
اکنون، بیایید به روش هایی بپردازیم که می توانید سرعت سایت خود را افزایش دهید و جذابیت مشتری وب سایت خود را افزایش دهید.
9 راه برای افزایش سرعت بارگذاری وب سایت
1. برنامه میزبانی خود را بهبود بخشید
این یکی از ساده ترین راه هایی است که می توانید سرعت وب سایت خود را افزایش دهید: به سرور خود نگاه کنید.
اغلب زمانی که برای اولین بار شروع به کار می کنیم، راه ارزان را طی می کنیم و برای میزبانی اشتراکی ثبت نام می کنیم. با این حال، همانطور که سایت ها در استفاده و محتوا رشد می کنند، کندتر می شوند. می توانید با ارتقای برنامه میزبانی خود (انتقال به یک VPS یا گزینه اختصاصی) با این مشکل مبارزه کنید.
برای نشان دادن، من قبلاً در برنامه مشترک اصلی Bluehost بودم. چند ماه پیش متوجه شدم سرعت سایتم کند شده است. من تمام تلاشم را کردم تا آن را سریعتر کنم، اما به نظر میرسید که هیچ چیز کار نمیکند. بنابراین، تصمیم گرفتم به برنامه میزبانی مدیریت شده وردپرس Bluehost تغییر دهم.
پس از ارتقاء از برنامه مشترک اولیه خود، فورا متوجه تفاوتها شدم.
دلیل بسیار سریعتر آن ساده است: شما منابع اختصاصی دریافت می کنید. این بدان معنی است که شما مجبور نیستید پهنای باند، رم، CPU و غیره را با دیگران به اشتراک بگذارید. همچنین، محدودیت های پهنای باند نیز بسیار بالاتر است. علاوه بر این، Bluehost دارای Varnish است – که یک گزینه کش بسیار بهینه است که تعداد بازدیدکنندگان بیشتری را نسبت به میزبانی مشترک امکان پذیر می کند.
یک یادداشت سریع در مورد VPS در مقابل میزبانی اختصاصی:
میزبانی VPS احتمالاً گزینه ای است که می خواهید با آن بروید. این “در فضای ابری” است، به این معنی که در چندین رایانه، گاهی اوقات حتی صدها، توزیع می شود. این یک راه حل مقیاس پذیر است و راه حلی مقرون به صرفه تر از میزبانی اختصاصی است. وبلاگ نویسان و کسب و کارهای متوسط/کوچک این گزینه را بسیار جذاب می دانند.
سرورهای اختصاصی مانند شما هستند که یک جعبه بزرگ را اجاره می کنید. اساساً مانند داشتن رایانه شخصی است. بزرگترین مزیت اختصاصی VPS این است که شما کنترل کامل دارید، زیرا همه منابع را برای خود دارید. با این حال – معمولاً بسیار گران تر است. و برخلاف VPS، انعطاف پذیری کمتری دارد، زیرا شما کامپیوترهای متعددی ندارید.
2. درک درخواست های HTTP
سایت ها عمدتاً به دلیل درخواست های HTTP بسیار زیاد (یا خیلی بزرگ) کند هستند. هنگامی که درخواست های HTTP را درک می کنید، بهتر می توانید آنها را حذف کنید.
هر زمان که مرورگر وب شما یک فایل (صفحه، تصویر و غیره) را از یک وب سرور واکشی می کند، این کار را با استفاده از HTTP انجام می دهد – این پروتکل انتقال ابرمتن است. HTTP یک پروتکل درخواست/پاسخ است، به این معنی که رایانه شما درخواستی را برای برخی از فایلها ارسال میکند (مثلاً «فایل «home.html» را برای من دریافت کنید)، و سرور وب پاسخی را ارسال میکند («فایل اینجاست»، به دنبال آن خود فایل)
راههای زیادی برای کاهش یا حذف درخواستهای HTTP وجود دارد که این مقاله بعداً به آنها میپردازد.
با این حال، برای اینکه ببینید یک صفحه در سایت شما چند درخواست HTTP دارد، می توانید یک تست سرعت در Pingdom انجام دهید.
می بینید که Learntocodewith.me/blog 23 درخواست دارد.
با Pingdom، می توانید درخواست ها را بر اساس اندازه فایل و زمان بارگذاری مرتب کنید. این به شما امکان می دهد بزرگ ترین مقصران را ببینید. تصویر زیر در صفحه اصلی Learntocodewith.me من گرفته شده است:
همانطور که می بینید، تصویر بزرگ من زمان زیادی برای بارگذاری دارد.
3. تصاویر را به اینترنت دوستانه تبدیل کنید
اندازه سایت به طور کلی، و اندازه تصویر به طور خاص، تفاوت زیادی در سرعت سایت شما ایجاد می کند. هرچه محتوا/تصاویر شما بزرگتر باشد سرعت سایت کندتر می شود.
برخی از راههای اساسی برای مقابله با این امر، کاهش اندازه فایلهای تصاویر در سایت، کاهش تعداد تصاویری که استفاده میکنید، یا حذف کامل آنها است. (به همین دلیل است که سال گذشته وقتی سایت را دوباره ویرایش کردم، تصاویر برجسته را از حلقه وبلاگ خود حذف کردم.)
اما نداشتن تصویر در سایت شما خسته کننده است! به جای حذف آنها، تصاویر را قبل از آپلود در سایت خود بهینه کنید:
- تغییر وضوح: کاهش “کیفیت” تصویر (و در نتیجه اندازه فایل)
- فشرده سازی تصویر: افزایش کارایی ذخیره سازی داده های تصویر
- برش تصویر: هنگام برش، قسمت های غیر ضروری را برش می دهید و بنابراین اندازه تصویر را کوچکتر می کنید.
شما می توانید این نوع تغییرات را در یک ابزار برتر مانند فتوشاپ یا یک برنامه رایگان مانند Gimp ایجاد کنید. حتی ابزارهای درون مرورگر مانند picresize.com وجود دارد.
برای کاربران مک، یک برنامه رایگان به نام ImageOptim وجود دارد که “پارامترهای فشرده سازی را بهینه می کند، ابرداده های ناخواسته و پروفایل های رنگی غیر ضروری را حذف می کند.”
در وردپرس، یک افزونه رایگان به نام Smush وجود دارد که اطلاعات پنهان موجود در تصاویر را حذف می کند. Smush تصاویر را هنگام آپلود آنها در وردپرس اسکن می کند و از ماندن اطلاعات غیر ضروری در آن جلوگیری می کند. با حفظ کیفیت تصویر، حجم فایل را کاهش می دهد.
4. از پلاگین ها به قدر نیاز استفاده کنید (فقط سایت های WP)
پلاگین bloat می تواند با ایجاد فایل های اضافی بیش از حد، عملکرد سایت شما را به میزان قابل توجهی کاهش دهد و در نتیجه زمان بارگذاری را افزایش دهد.
سعی کنید تا حد امکان از استفاده از افزونه ها خودداری کنید. به نظر من، نمی توان به طور کامل از افزونه ها اجتناب کرد. اما راه هایی وجود دارد که می توانید تعداد کلی را کاهش دهید.
برای شروع، اگر راه آسانی برای استفاده از یک افزونه وجود دارد – این کار را انجام دهید. (به عنوان مثال: افزونه Google Analytics. در عوض، فقط کد رهگیری را به صورت دستی به فوتر وب سایت خود اضافه کنید.)
همچنین هر 4-6 ماه یک بار برای بررسی افزونه های خود زمان بگذارید. هر یک را ارزیابی کنید و اگر:
- شما دیگر از آن استفاده نمی کنید.
- کاری را که قرار است انجام دهد انجام نمی دهد.
- این در حال فراخوانی توابع منسوخ شده است
- افزونه های جدید و بهبود یافته ای وجود دارند که بهتر کار می کنند
- علاوه بر اشغال فضا، افزونه های قدیمی وردپرس اغلب مسئول آسیب پذیری های امنیتی هستند. (درباره آن فکر کنید: این یک بسته کد شخص ثالث در سایت شما است.) دلیل دیگری برای پایین نگه داشتن تعداد افزونه ها است.
5. اسکریپت های خارجی را کاهش دهید
آیا می دانید تکه هایی از کد جاوا اسکریپت که برای افزودن یک ویژگی یا کتابخانه اضافی به سایت خود اضافه می کنید؟ این اسکریپت های خارجی هر بار که صفحه جدیدی بارگذاری می شود، درخواست های HTTP را ایجاد می کنند.
در اینجا چند نمونه از اسکریپت های خارجی وجود دارد که می توانند سرعت سایت شما را کاهش دهند:
- کادرهای فیس بوک “لایک صفحه من”.
- بوت استرپ (اگر از طریق CDN وارد شود)
- مجموعه آیکونها مانند Font Awesome (همچنین وقتی با CDN وارد میشود)
- سیستم های اظهار نظر خارجی (مانند Disqus)
- جعبههای پاپآپ و ابزارهای مشابه (مانند SumoMe)
- خدمات تجزیه و تحلیل وب سایت (یعنی Google Analytics یا Mixpanel)
- فونت های خارجی (به عنوان مثال فونت های گوگل)
این بدان معنا نیست که باید از همه اینها اجتناب کنید (که به هر حال انجام آن دشوار است). فقط حواستان به این باشد.
برای اینکه بفهمید کدام اسکریپتها بهخصوص بزرگ هستند، میتوانید به Pingdom برگردید تا ببینید کدام فایلها بیشترین زمان را برای بارگذاری دارند.
6. بهینه سازی فایل های JS و CSS
دو راه برای انجام این کار وجود دارد: کوچک سازی و gzipping (یا فشرده سازی). به گفته نابغه CSS کریس کویر:
“کوچک سازی کارهایی مانند حذف فضای خالی، حذف نظرات، حذف نیم ویرگول های غیر ضروری، کاهش طول کد هگزا…”
در همین حال Gzipping:
“همه رشته های تکراری را پیدا می کند و آنها را با نشانگرهای اولین نمونه از آن رشته جایگزین می کند.”
برای بهترین نتیجه، میخواهید از Minifying و Gzipping با هم استفاده کنید.
با این حال، gzipping در سطح سرور انجام می شود: برای انجام آن باید آن را پیکربندی کنید. کریس کویر در اینجا در مورد آن صحبت می کند.
برای شروع، در اینجا چند ابزار کوچک سازی وجود دارد:
- (افزونه وردپرس) BWP Minify: به شما امکان می دهد فایل های CSS و جاوا اسکریپت خود را ترکیب و کوچک کنید
- (افزونه وردپرس) W3 Total Cache: این یکی از محبوب ترین پلاگین های عملکردی است.
- WillPeavy: مینیفایر رایگان HTML، CSS یا JS
7. از حافظه پنهان استفاده کنید
کش صفحه زمانی است که صفحات وب فایل های ثابت (مانند اسناد و تصاویر HTML) را ذخیره می کنند، که به بازدیدکنندگان اجازه می دهد سریعتر به آن صفحه دسترسی پیدا کنند، زیرا پایگاه داده مجبور نیست هر بار که درخواستی وجود دارد، هر فایل را بازیابی کند.
اما نکته ای که در کش وجود دارد این است که در بیشتر موارد فقط برای بازدیدکنندگان تکراری کار می کند. بازدیدکنندگانی که برای اولین بار از سایت بازدید می کنند، هنوز سایت را در حافظه پنهان نخواهند داشت، زیرا صفحه باید حداقل یک بار فایل ها را قبل از ذخیره آنها بارگیری کند.
اگر کاربر وردپرس هستید، میتوانید افزونهای را برای فعال کردن کش نصب کنید. در اینجا برخی از افزونه های کش محبوب وجود دارد:
W3 Total Cache: محبوبترین افزونه عملکرد (افزونهای که در Learntocodewith.me استفاده میکنم)
WP Super Cache: پیشنهاد شده برای سایت های پربازدید با سرورهای ضعیف، به نظر می رسد اغلب به روز می شود (ایجاد شده توسط Automattic)
اگر از وردپرس استفاده نمی کنید، می توانید سایت خود را برای کش در سطح سرور پیکربندی کنید. Digital Ocean تعداد انگشت شماری از آموزش های مفید در حافظه پنهان دارد.
8. بارهای اضافه وب سایت را حذف کنید
“چمدان” می تواند چیزهای زیادی باشد – بسیاری از آنها قبلاً مورد بحث قرار گرفته اند (تصاویر، افزونه ها و اسکریپت های خارجی).
چند نمونه رایج دیگر از چمدان های وب سایت:
کدهایی که در وبسایت شما جمع میشوند (مانند زمانی که برای اصلاح سریع وارد میشوید، بدون در نظر گرفتن مؤثرترین روش برای اجرای تغییرات)
پایگاههای دادهای که گسترده شدهاند – این امر بهویژه در مورد سایتهای تجارت الکترونیکی با سفارشهای زیاد صدق میکند.
پشتیبانگیری بیش از حد در سطح سرور انجام شده است
برای کاربران وردپرس – افزونهها، تمها، ویرایشهای ذخیرهشده پست و صفحه، و کتابخانههای رسانهای عظیم
راه اصلی برای تمیز کردن “چمدان” اضافی این است که هر چند وقت یکبار وارد آن شوید و یک تعمیر دستی انجام دهید.
در اینجا چند نکته حرفه ای اضافی وجود دارد:
- نظرات هرزنامه یا رد بک هایی را که نیاز ندارید حذف کنید.
- فایل های رسانه ای مانند دانلودهای PDF را به صورت خارجی در آمازون S3 ذخیره کنید (کاری که من انجام می دهم)
- برای کاربران WP: نصب های قدیمی وردپرس را روی سرور خود حذف کنید.
- برای کاربران WP: از افزونه ای مانند WP-Optimize استفاده کنید که به شما امکان می دهد پایگاه داده خود را با کارایی بیشتری تمیز کنید.
9. از یک شبکه تحویل محتوا (CDN) استفاده کنید
من CDN ها را برای آخرین بار ذخیره کردم زیرا این “پیشرفته تر” است، به خصوص برای یک تازه کار.
CDN اساساً بسیاری از سرورهای بهینه شده در سراسر جهان است که محتوای وب را بر اساس موقعیت جغرافیایی آنها به کاربران ارائه می دهد. این به معنای بهبود عملکرد بزرگ برای کاربران سایت است. زیرا، مثلاً، اگر شخصی به سایت شما در هند دسترسی داشته باشد، محتوای وب را از سروری در نزدیکی خود بازیابی می کند، نه در سراسر جهان در یوتا.
در اینجا چیزی است که می توانید در CDN ذخیره کنید:
- فایل های JS
- فایل های CSS
- تصاویر
- سایر فایل های آپلود شده (مانند فیلم ها، فایل های PDF)
اگر در یک سایت وردپرسی هستید و قبلاً از افزونه محبوب W3 Total Cache استفاده میکنید، در اینجا چند خبر خوب وجود دارد: این افزونه با MaxCDN ادغام میشود، بنابراین میتوانید اساساً در کمترین زمان روی CDN اجرا کنید. (در شرایط دیگر، انتقال دارایی های سایت شما به یک CDN ممکن است چندان ساده نباشد.)
با این حال، در اینجا یک نکته منفی برای CDN ها وجود دارد: آنها می توانند گران شوند. به خصوص اگر از پهنای باند زیادی استفاده می کنید.
اما برای سایتهای بزرگتر، با بازدیدکنندگان زیادی از سراسر جهان، CDN اساسا یک ضرورت است. و همه سایت های “بزرگ” بدون شک از یکی استفاده می کنند.
با این حال، اگر به تازگی یک وبلاگ را راه اندازی کرده اید، یا یک برنامه کوچک می سازید، CDN ضروری نیست. (هیچ، من حتی از یکی برای سایتم استفاده نمی کنم … هنوز.)