20 راه برای افزایش سرعت وب سایت و افزایش نرخ تبدیل در سال 2023

دسترسی سریع به محتوا  (برای مشاهده هر بخش بر روی آن کلیک کنید)

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

اولین قدم برای به حداقل رساندن درخواست های خود این است که بفهمید سایت شما در حال حاضر چه تعداد درخواست تولید می کند تا به عنوان یک معیار از آن استفاده کنید. اگر از Google Chrome استفاده می‌کنید، می‌توانید از ابزارهای توسعه‌دهنده مرورگر برای مشاهده تعداد درخواست‌های HTTP استفاده کنید.

روی صفحه‌ای که می‌خواهید آنالیز کنید کلیک راست کنید و روی «Inspect» کلیک کنید، سپس بر روی زبانه «Network» کلیک کنید. (اگر برگه "شبکه" را نمی بینید، ممکن است لازم باشد نوار کناری Developer Tools را با کشیدن حاشیه سمت چپ به سمت چپ گسترش دهید.)

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

کاهش این تعداد درخواست باعث افزایش سرعت سایت شما می شود، فایل های خود را بررسی کنید و ببینید که کدام یک از آنها غیر ضروری هستند. ممکن است بلافاصله متوجه چیزی نشوید، اما برخی از آنها احتمالاً نامزدهای اصلی برای ترکیب هستند، که در مراحل بعدی به آنها خواهیم رسید.

اکنون که می دانید سایت شما چند درخواست دارد، می توانید روی کاهش این تعداد کار کنید. بهترین مکان برای شروع استفاده از فایل های HTML، CSS و جاوا اسکریپت است، این نکته را توجه داشته باشید که این فایل‌ها بسیار مهم هستند، زیرا ظاهر سایت شما را تعیین می‌کنند، آنها همچنین به تعداد درخواست هایی که سایت شما هر بار که کاربر از آن بازدید می کند اضافه می کنند.

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

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

راه‌های مختلفی برای کوچک‌سازی و ترکیب فایل‌ها وجود دارد، اگر سایت شما روی وردپرس اجرا می‌شود، افزونه‌هایی مانند WP Rocket این فرآیند را نسبتاً ساده می‌کنند. اگر این افزونه را نصب کرده‌اید، به تب “Static Files” بروید و فایل‌هایی را که می‌خواهید کوچک‌سازی و ترکیب کنید بررسی کنید، این مورد می تواند شامل فایل های HTML، CSS و جاوا اسکریپت و همچنین فونت های گوگل باشد.

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

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

اگر اسکریپت های شما به صورت همزمان بارگیری می شوند، هر بار به ترتیبی که در صفحه ظاهر می شوند، بارگذاری می شوند. از طرف دیگر، اگر اسکریپت های شما به صورت ناهمزمان بارگذاری شوند، برخی از آنها به طور همزمان بارگذاری می شوند.

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

با استفاده از همان برگه «Static Files» افزونه WP Rocket، گزینه‌های کنار «Render-blocking CSS/JS» را علامت بزنید. روی "ذخیره تغییرات" کلیک کنید، سپس سایت خود را تست کنید تا مطمئن شوید همه چیز به درستی بارگیری می شود.

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

اگر سایت وردپرسی دارید، می توانید از افزونه WP Rocket که در بالا ذکر شد استفاده کنید تا به راحتی بارگذاری جاوا اسکریپت به تعویق افتاده را فعال کنید. به سادگی کادر کنار «بارگیری فایل‌های JS به تعویق افتاده» را علامت بزنید و آماده هستید، اما اگر یک سایت HTML دارید، باید با یک فایل جاوا اسکریپت خارجی را قبل از تگ قرار دهید.

علاوه بر مدت زمانی که طول می کشد تا صفحه شما به طور کامل بارگذاری شود، می خواهید به مدت زمانی که برای شروع بارگذاری طول می کشد نیز نگاهی بیندازید. زمان برای اولین بایت یا TTFB، مدت زمانی است که مرورگر باید قبل از دریافت اولین بایت داده خود از سرور منتظر بماند. گوگل TTFB کمتر از 200 میلی ثانیه را توصیه می کند.

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

✔️ جستجوی DNS
✔️ پردازش سرور
✔️ واکنش

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

برای دسترسی به این اطلاعات در Developer Tools، روی برگه «Network» کلیک کنید و ماوس را روی آیتم بالایی در ستون «Waterfall» قرار دهید. سرعت ttfb کروم وب سایت خود را افزایش دهید. شما همچنین می توانید از هر تعداد ابزار شخص ثالث رایگان مانند WebPageTest برای تست سایت خود از یک مرکز داده استفاده کنید. اگر TTFB شما کمتر از 200 میلی‌ثانیه است، در وضعیت خوبی هستید، اگر نه، ممکن است چند مشکل مختلف در ریشه وجود داشته باشد. به طور کلی، بیشتر مشکلات مربوط به TTFB کند ناشی از مشکلات شبکه، ایجاد محتوای پویا، پیکربندی وب سرور و ترافیک است.

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

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

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

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

اگر از یک DNS کند استفاده می کنید، این زمان طول می کشد تا مرورگرها سایت شما را پیدا کنند. تغییر به یک ارائه دهنده DNS سریعتر می تواند روند را سرعت بخشد.

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

✔️ هاست اشتراکی
✔️ میزبانی VPS (سرور مجازی)
✔️ سرور اختصاصی

هاست اشتراکی ارزان ترین گزینه است و اغلب می توانید آن را با حدود 100 هزار تومان در ماه دریافت کنید. این گزینه برای سایت های کم ترافیک خوب است، میزبانی اشتراکی هنگام افزایش ترافیک و برای سایت های با حجم بازدید بالا مناسب نیست. با میزبانی اشتراکی، منابع خاصی مانند CPU، فضای دیسک و RAM را با سایت های دیگری که روی همان سرور میزبانی می شوند به اشتراک می گذارید.

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

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

اگر در نقطه ای هستید که سطح ترافیک شما زمان پاسخگویی سرور شما را کند می کند، ممکن است زمان آن رسیده باشد که از هاست اشتراکی به VPS یا از VPS به سرور اختصاصی تغییر دهید.

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

صفحات با تعداد زیادی تصاویر و محتوا، اغلب ممکن است بیش از 100 کیلوبایت حجم داشته باشند. در نتیجه، حجم آن‌ها و دانلود کند هستند، می‌توانید با فشرده‌سازی زمان‌های دانلود سرعت آن‌ها را افزایش دهید.

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

تست gid به شما می گوید که حجم صفحه شما فشرده نشده است، که بعداً می توانید از آن به عنوان یک معیار برای اندازه گیری نتایج فشرده سازی استفاده کنید. در زیر آن، تحلیلی خواهید دید که چقدر می‌توانید اندازه صفحه را از نظر اندازه و درصد با استفاده از ابزاری مانند Gzip کاهش دهید . این فشرده سازی شامل HTML، CSS، جاوا اسکریپت، متن ساده و فایل های XML است.

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

Gzip یک فرمت فایل و برنامه نرم افزاری است که اساسا رشته هایی از کدهای مشابه را در فایل های متنی شما قرار می دهد، سپس به طور موقت آنها را جایگزین می کند تا فایل ها کوچکتر شوند. این گزینه به خوبی با CSS و HTML کار می کند، زیرا این فایل ها معمولا دارای کد و فضای خالی تکراری هستند. اکثر وب سرورها می‌توانند فایل‌ها را قبل از ارسال برای دانلود با فرمت Gzip فشرده کنند، این می تواند زمان دانلود را تا حدود 70 درصد کاهش دهد. از آنجایی که 90 درصد از ترافیک اینترنت امروزی از طریق مرورگرهایی که از Gzip پشتیبانی می‌کنند، عبور می‌کند، این یک گزینه عالی برای افزایش سرعت سایت شما است.

اگر مطمئن نیستید که سایت شما Gzip را فعال کرده است، می توانید از checkgzipcompression.com برای مشاهده استفاده کنید. فقط URL سایت خود را وارد کنید، و اگر Gzip را فعال کرده باشید، چیزی شبیه به این خواهید دید:

gzip را چک کنید

اگر Gzip را فعال نکرده‌اید، این مشکل را در اسرع وقت برطرف کنید. اگر سایت شما بر روی وردپرس اجرا می شود، هر دو افزونه WP Rocket و W3 Total Cache از فعال کردن Gzip پشتیبانی می کنند، در W3 Total Cache، تنها کاری که باید انجام دهید این است که کادر کنار «فعال کردن فشرده‌سازی HTTP (gzip) را علامت بزنید.

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

اولین باری که شخصی به وب سایت شما می آید، قبل از اینکه بتواند از صفحه شما استفاده کند، باید سند HTML، فایل های جاوا اسکریپت و تصاویر را دانلود کند که ممکن است بیش از 30 مورد و 2.4 ثانیه باشد، زمانیکه کش مرورگر فعال شد، بعد از بارگیری صفحه، اجزای مختلف در حافظه پنهان کاربر ذخیره شدند، برای بازدیدهای بعدی فقط چند مؤلفه باید دانلود شوند که تقریباً 2 ثانیه از زمان بارگذاری را کاهش داد.

40-60٪ از بازدیدکنندگان روزانه سایت شما با حافظه پنهان خالی وارد می شوند، بنابراین بسیار مهم است که صفحه خود را برای این بازدیدکنندگانی که برای اولین بار بازدید می کنند سریع کنید. اما فعال کردن حافظه پنهان می تواند زمان قابل توجهی از بازدیدکنندگان بازگشتی را کاهش دهد و تجربه کاربری بهتری را ارائه دهد. نحوه تنظیم کش بستگی به این دارد که سایت خود را با وردپرس یا HTML ایستا اجرا کنید، با W3 Total Cache سرعت وب سایت خود را در وردپرس افزایش دهید.

اگر یک سایت وردپرسی دارید، می توانید از افزونه ای مانند W3 Total Cache استفاده کنید تا به راحتی کش را فعال کنید، پس از نصب آن، در قسمت «تنظیمات عمومی» به «حافظه پنهان صفحه» بروید و کادر کنار «فعال کردن» را علامت بزنید.

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

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

هنگامی که تنظیمات خود را پیکربندی کردید، باید فوراً بهبودهایی را در زمان بارگذاری خود مشاهده کنید. W3 Total Cache ادعا می کند که کاربران آن 10 برابر پیشرفت در نتایج Google PageSpeed و تا 80٪ در پهنای باند پس از پیکربندی کامل افزونه صرفه جویی کرده اند. اگر سایت HTML ایستا دارید، می توانید کش کردن توسط در فایل htaccess. خود را فعال کنید.

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

کاهش اندازه تصاویر، می تواند تأثیر زیادی بر مدت زمان بارگذاری صفحه داشته باشد. در یک مطالعه، تغییر اندازه 22 مگابایت تصاویر به 300 کیلوبایت منجر به کاهش 70 درصدی زمان برای تعامل یا مدت زمانی که کاربر برای تعامل با یک سایت نیاز دارد، کاهش یافت.

اگر سایت شما بر روی وردپرس اجرا می شود، WP Smush یک گزینه عالی است، کادر کنار «Automatically Smush my images on upload» را علامت بزنید، و همه تصاویر جدید شما بدون یک ثانیه کار اضافی فشرده می شوند، همچنین می توانید از این افزونه برای تغییر اندازه خودکار تمام فایل های جدیدی که آپلود می کنید استفاده کنید. حداکثر عرض و ارتفاع را تنظیم کنید، و هر تصویری که از آنها فراتر رود "مشکل" خواهد شد.

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

انواع فایل های تصویری

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

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

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

در نهایت، GIF ها فقط باید برای گرافیک های کوچک یا ساده کمتر از ۱۰×۱۰ پیکسل، یک پالت رنگی با ۳ رنگ یا کمتر، و برای تصاویر متحرک استفاده شوند. هنگامی که اندازه ها و قالب های تصویر خود را درست انجام دادید، می توانید مطمئن شوید که کدی که برای پیاده سازی آنها استفاده می کنید نیز درست است. به ویژه، مطمئن شوید که از کدهای خالی src تصویر اجتناب کنید.

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

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

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

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

اگر می خواهید شروع به استفاده از CDN کنید، بهترین گزینه های شما MaxCDN و Cloudflare هستند. Cloudflare سرویس CDN را با ویژگی های امنیتی و بهینه سازی ترکیب می کند. گزینه ای که انتخاب می کنید بستگی به این دارد که آیا آن ویژگی های اضافی را می خواهید یا فقط می خواهید روی بهبود سرعت تمرکز کنید.

علاوه بر میزبانی فایل های سایت خود بر روی CDN، می توانید از پلتفرم های میزبانی خارجی برای برخی از فایل های بزرگتر خود نیز استفاده کنید، این موضوع به ویژه برای فیلم ها ارزشمند است. به عنوان مثال، فرض کنید می خواهید یک فیلم آموزشی به سایت خود اضافه کنید. شما فایل ویدیویی را ایجاد، ویرایش و بارگزاری می کنید.

اولین فکری که به ذهن شما می رسد، این باشد که ویدیو را مستقیماً از طریق ویرایشگر FTP یا WordPress در سایت خود آپلود کنید، اما این کار را نکنید!!! وقتی ویدیوها را روی سرور خود بارگزاری می کنید، فضای زیادی را اشغال می کنند، فایل های ویدئویی به راحتی می توانند بیش از 100 مگابایت را اشغال کنند. اگر از سرور اشتراکی استفاده می کنید، فضای محدودی دارید و حتی اگر بتوانید ویدیوهای بزرگ را در ارائه دهنده هاست خود آپلود کنید، احتمالاً تجربه کاربری ضعیفی را ارائه می دهد.

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

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

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

به عنوان یک قاعده کلی، از قرار دادن CSS در کدهای HTML (مانند div یا سرفصل های خود) مانند CSS درون خطی تصویر بالا اجتناب کنید. اگر تمام CSS خود را در شیوه نامه خارجی خود قرار دهید، کد تمیزتری دریافت خواهید کرد، این موضوع باعث کاهش حجم کد شما و ایجاد کدهای تکراری کمتر می شود.

هنگام تنظیم سبک های خود، همچنین بهتر است فقط از یک شیوه نامه CSS خارجی استفاده کنید، زیرا شیوه نامه های اضافی درخواست های HTTP را افزایش می دهند. اگر مطمئن نیستید که CSS شما در حال حاضر چگونه تنظیم شده است، می توانید از این ابزار تحویل CSS برای پیدا کردن آن استفاده کنید. URL خود را وارد کنید و گزارشی با تمام فایل های CSS خارجی خود خواهید دید.

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

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

هنگامی که این کار را انجام دادید، می توانید از PageSpeed Insights استفاده کنید تا مطمئن شوید که مشکلی با رندر مسدود کردن CSS ندارید. اگر قبلاً از افزونه ای مانند WP Rocket استفاده می کنید، این نباید مشکلی باشد. اگر همچنان مشکل رندر مسدود کردن دارید، تنظیمات افزونه خود را دوباره بررسی کنید یا توصیه‌های Google را برای بهینه‌سازی تحویل CSS دنبال کنید.

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

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

اگر سایت خود را بر روی وردپرس اجرا می کنید، فعال کردن آن به آسانی نصب یک افزونه است. گزینه های زیادی وجود دارد که می توانید از آنها برای شروع استفاده از بارگذاری تنبل در سایت خود استفاده کنید. Lazy Load یک افزونه بسیار ساده است که از jQuery.sonar برای بارگذاری تصاویر تنها زمانی استفاده می کند که در مرورگر کاربر قابل مشاهده باشند، تنها کاری که باید انجام دهید این است که آن را نصب و فعال کنید سپس افزونه به طور خودکار تشخیص می دهد که یک تصویر برای کاربر قابل مشاهده است و آن را بارگذاری می کند.

اگر قبلاً از WP Rocket استفاده می‌کنید، می‌توانید از این افزونه برای فعال کردن بارگذاری تنبل نیز استفاده کنید. تنظیمات WP Rocket خود را باز کنید، سپس روی برگه "Basic" کلیک کنید. در بخش LazyLoad، کادر کنار «فعال کردن تصاویر» را علامت بزنید.

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

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

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

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

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

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

Plugin Performance Profiler یک گزینه قوی برای شناسایی افزونه هایی است که باعث ایجاد مشکل در سایت شما می شوند. به‌علاوه، این بسیار سریع‌تر و آسان‌تر از غیرفعال کردن دستی افزونه‌ها به‌صورت جداگانه و اجرای آزمایش‌های سرعت سایت است (و همیشه می‌توانید به محض اینکه استفاده از آن را تمام کردید، آن را غیرفعال کنید).

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

همپوشانی در عملکرد را شناسایی کنید

در بیشتر موارد، افزونه هایی که در سایت خود نصب کرده اید، هدف مشخصی دارند و ممکن است نتوانید آنها را از سایت خود حذف کنید. خوشبختانه، افزونه‌های زیادی وجود دارند که می‌توانند بیش از یک هدف را انجام دهند و یافتن آنها می‌تواند به شما در حذف افزونه‌هایی که فقط یک هدف را انجام می‌دهند کمک کند.

به عنوان مثال، افزونه‌های WP Rocket و WP Total Cache در این صفحه، هر دو برای بهبود سرعت سایت بسیار مفید هستند و هر دو گزینه‌های عالی هستند، اما با توجه به اینکه آنها بسیاری از اهداف یکسانی را دنبال می کنند، به احتمال زیاد به هر دو نیاز ندارید. اگر هر دوی آنها را روی سایت خود نصب کرده بودید، می توانید ویژگی هایی را که در هر کدام از آنها استفاده می کنید ارزیابی کنید و ببینید که آیا هر کدام می توانند هر کاری را که نیاز دارید انجام دهند، سپس همه آن ویژگی‌ها را در افزونه‌ای که انتخاب می‌کنید فعال کنید و دیگری را غیرفعال کنید.

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

به عنوان مثال، بسیاری از صاحبان سایت از یک افزونه برای اضافه کردن کد رهگیری گوگل آنالیتیکس به هدر خود استفاده می کنند. و در حالی که این فرآیند را برای کاربرانی که در ویرایش کد راحت نیستند بسیار آسان می کند، ضروری نیست. اگر افزونه Insert Headers and Footers (یا افزونه مشابه) را برای ویرایش سایر قسمت‌های تگ هدر خود نصب کرده‌اید، می‌توانید کد Google Analytics خود را از داشبورد مدیریت خود کپی کنید، سپس آن را در اینجا جای‌گذاری کنید، تغییرات خود را ذخیره کنید و کد رهگیری شما نصب می شود. اگر افزونه ای برای ویرایش هدرها و پاورقی ها نصب نکرده اید، می توانید به صورت دستی آن را از طریق FTP سایت خود به هدر خود اضافه کنید.

یکی دیگر از افزونه های اساسی که ممکن است نصب کرده باشید، افزونه فونت است. این افزونه‌ها به گونه‌ای طراحی شده‌اند که تغییر فونت‌های سایت شما را آسان می‌کنند، اما اگر یکی را نصب کرده‌اید، می‌توانید آن را با چند خط کد حذف کنید. به Google Fonts بروید و فونتی را که می خواهید در سایت خود استفاده کنید انتخاب کنید. در قسمت «Embed»، کدهای HTML و CSS برای آن فونت را خواهید دید، کد HTML را به هدر خود و CSS را به شیوه نامه CSS سایت خود در هر کجا که می خواهید از فونت انتخابی خود استفاده کنید اضافه کنید، شما می توانید این کار را با هر تعداد فونت که می خواهید انجام دهید. بنابراین می توانید به طور کامل نحوه نمایش تمام متن های موجود در سایت خود را بدون یک افزونه شخصی سازی کنید.

تغییر مسیر اغلب هنگام جابجایی و حذف صفحات ضروری است و بهترین راه برای از بین بردن مشکلات پیوندهای شکسته است. اما وجود تعداد زیاد آنها می تواند درخواست های HTTP اضافی ایجاد کند که می تواند بر سرعت تأثیر منفی بگذارد (به ویژه در دستگاه های تلفن همراه).

می توانید با استفاده از ابزار Screaming Frog شروع کنید تا به سرعت تمام تغییر مسیرهای موجود در سایت خود را شناسایی کنید. یک اسکن سایت را اجرا کنید، سپس بر اساس ستون "کد وضعیت" مرتب کنید تا همه 301 تغییر مسیرها را در سایت خود مشاهده کنید، شما می توانید از طریق این تغییر مسیرها نگاه کنید تا ببینید آنها چه کاری انجام می دهند و مطمئن شوید که هدف لازم را دنبال می کنند.

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

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

به عنوان مثال، اگر از Gravatar برای نظرات وبلاگ استفاده می کنید، ممکن است متوجه شوید که بارگذاری تصاویر کاربر مقدار قابل توجهی به زمان بارگذاری شما اضافه می کند. یا اگر سایت شما برای اشتراک گذاری آسان پست ها با توییتر یا اینستاگرام ادغام شده است، ممکن است تعداد درخواست های HTTP سایت شما را افزایش دهد.

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

دانستن اینکه چه ویژگی هایی به زمان بارگذاری شما اضافه می کنند به شما کمک می کند تا سرعت سایت خود را بهتر درک کنید. همچنین می تواند به شما در تصمیم گیری آگاهانه تر در مورد ویژگی هایی که در آینده به سایت خود اضافه می کنید کمک کند.

همانطور که برای بهبود سرعت سایت خود کار می کنید، ایده خوبی است که بر نحوه تغییر آن در طول زمان نظارت کنید. این مهم است حتی پس از رسیدن به زمان قابل قبول بارگذاری صفحه.

همانطور که در این مقاله دیدید، عوامل زیادی بر سرعت سایت شما تأثیر می گذارند، بنابراین تقریباً در هر زمان می تواند تغییر کند. نظارت بر زمان بارگذاری به طور منظم می تواند به شما کمک کند تا هر مشکلی را زودتر متوجه شوید و سایت خود را در وضعیت خوبی نگه دارید.

نحوه انجام تست سرعت وب سایت

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

علاوه بر نظارت بر زمان بارگذاری روی دسکتاپ، باید به میزان بارگیری سایت شما در دستگاه های تلفن همراه توجه ویژه ای داشته باشید. همانطور که در بالا ذکر کردیم، تجربه کاربر تلفن همراه اکنون بر تمام رتبه بندی سایت شما تأثیر می گذارد، به علاوه، به نفع شماست که یک سایت سریع و کاربرپسند برای کاربران تلفن همراه ارائه دهید.

می‌توانید با استفاده از ابزار Google's Test My Site برای بررسی سرعت صفحه خود شروع کنید. برای شروع کافیست URL خود را وارد کنید.