افزایش سرعت سایت: ۹ تکنیک برای بالا بردن سرعت سایت شما

یکی از مهم‌ترین کارهایی که باید برای بهینه سازی سایت خود انجام دهید؛ افزایش سرعت سایت است. در ادامه راهکارهای افزایش سرعت سایت را خواهید آموخت. پس با من همراه باشید.

• دوره افزایش سرعت سایت

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

کاربران باید ابتدا سایت شما را بارگیری کنند تا بتوانند به محتوای شما دسترسی پیدا کنند!

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

ابتدا بیایید کمی بیشتر با سرعت سایت آشنا شویم.

منظور از سرعت سایت چیست؟

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

برای سنجش سرعت سایت معیارهای متفاوتی وجود دارد اما لازم است بدانید امروز معیار اصلی سنجش سرعت سایت توسط گوگل؛ core web vitlas است.

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

• سرعت سایت چیست؟
• Core Web Vitals چیست؟

چگونه سرعت سایت را تست کنیم؟

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

• gtmetrix
• pagespeedinsight
• Pingdom Speed Test
• Uptrends
• WebPageTest
• Varvy Pagespeed Optimization
• dotcom-monitor

تکنیک‌های افزایش سرعت سایت

در ادامه ۹ روش برای بالا بردن سرعت سایت را توضیح خواهم داد که با رعایت آن‌ها می‌توانید سرعت سایتتان را افزایش دهید.

۱. برای میزبانی سایت خود بیشتر هزینه کنید

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

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

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

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

واقعا چقدر تفاوت ایجاد می‌کند؟

براین اساس، سایت آمازون تحقیقی را انجام داد. تفاوت فقط ۱۰۰ میلی ثانیه (یک واحد زمانی که حتی انسان نمی‌تواند آن را درک کند) کافی بود تا فروش آنها را یک درصد کاهش دهد. Walmart نیز نتایج مشابه‌ای را به دست آورد.

اگر واحد زمانی به این کوچکی چنین تاثیر مستقیمی بر میزان فروش دارد پس ثانیه‌های بیشتر چه اثری بر فروش می‌گذارند؟

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

• پوگو استیکینگ Pogo Sticking چیست

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

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

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

• سئو تکنیکال چیست

۲. درخواست‌های HTTP را کاهش دهید!

برای ارائه و عملکرد یک صفحه وب، نیازمند یک فایل هستیم. در میان این فایل‌ها می‌توان HTML, CSS, Java Script، تصاویر و فونت‌ها را نام برد. هر کدام از این فایل‌ها نیز به درخواست HTTP جداگانه‌ای نیاز دارند. هر چه تعداد درخواست‌های HTTP بیشتر باشد، صفحه آهسته‌تر بارگیری می‌شود.

حالا اگر شما نیز مانند بیشتر افرادی که با آنها صحبت می‌کنم هستید، احتمالا فکر می‌کنید ″ نیازی نیست نگران آن باشم. می‌دانم چه می‌کنم.″ بیشتر از ۹۰ درصد وب‌سایت‌هایی که با آن روبرو می‌شوم مراقب این نکته هستند اما مشکل از جای دیگر است: عده کثیری از طراحان وب، صرف نظر از مهارت و تجربه، سرعت صفحه را در اولویت قرار نمی‌دهند. اکثر آنها حتی نحوه انجام آن را نیز نمی‌دانند. این حقیقت غم‌انگیزی است.

مشکل از اینجا شروع می‌شود:

برای اکثر موضوعات یک یا چند فایل CSS و چندین فایل جاوا اسکریپت بارگذاری می‌شود. برخی از این فایل‌ها مانند Jquery یا Font Awesome معمولا از سرور دیگری بارگیری می‌شوند. این باعث می‌شود که مدت زمان بارگذاری یک صفحه بطور چشمگیری افزایش یابد.

این موضوع وقتی بدتر می‌شود که متوجه افزوده شدن فایل‌های اضافی CSS و جاوا اسکریپت توسط افزونه‌ها می‌شوید.

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

• تمام فایل‌های جاوا اسکریپت را به یک فایل تبدیل کنید
• تمام فایل‌های CSS را به یک فایل تبدیل کنید
• افزونه‌هایی که فایل‌های CSS یا جاوای خود را بارگیری می‌کنند، کاهش یا حذف کنید. در بعضی موارد مانند Gravity Forms این گزینه را دارید که بارگیری آنها را غیرفعال کنید.
• برای تصاویر تکراری از اسپیریت استفاده کنید.
• هر زمان که ممکن است از فونت‌هایی مانند FontAwesome یا Ionic Icons به جای فایل‌های تصویری استفاده کنید. در این صورت فقط نیاز به بارگیری یک فایل است.

۳. استفاده از اسلش پایانی Trailing Slash

به اسلشی که در انتهای URL قرار می‌گیرد Trailing Slash گفته می‌شود.

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

تاثیر اسلش پایانی چیست؟

هنگامی که URL بدون اسلش پایانی باشد، سرور به دنبال فایلی با آن نام است. اگر فایلی با آن نام پیدا نکند، URL را به عنوان یک فهرست، راهنمایی می‌کند. سپس در آن فهرست فایل پیش فرض را جستجو می‌کند.

به عبارت دیگر، با حذف اسلش انتهایی، سرور را مجبور می‌کنید تا تغییر مسیر ۳۰۱ را اجرا کند. درحالی که این تغییر مسیر به نظر شما سریع می‌باشد اما کمی طول می‌کشد.

• (این بد است) https://example.com
• (این نیز بد است) https://example.com/services
• (این خوب است)   https://example.com/
• (این نیز خوب است) https://example.com/services/

۴. فعال کردن فشرده سازی Gzip

با فعال کردن فشرده سازی GZIP می‌توان کاهش چشمگیری در مدت زمان دانلود فایل‌های HTML, CSS, و Java Script ایجاد کرد. آنها به اندازه فایل‌های فشرده کوچکتر دانلود می‌شوند. سپس بعد از رسیدن به مرورگر از حالت فشرده خارج می‌شوند.

نگران نباشید! نیاز نیست کاربران شما هیچ کار اضافه‌ای انجام دهند. تمام مرورگرهای جدید (گوگل کروم، فایرفاکس) از GZIP پشتیبانی می‌کنند. مرورگران از قبل بطور خودکار GZIP را برای تمام درخواست‌های HTTP پردازش می‌کنند.

۵. فعال کردن حافظه مرورگر Cash

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

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

۶. کوچک کردن (Minify) فایل‌های CSS و JS

Minify کردن فایل‌های جاوا اسکریپت و CSS فضاهای سفید موجود در درون فایل را از بین می‌برد. با این کار اندازه فایل کوچک‌تر می‌شود. در نتیجه زمان بارگیری صفحه نیز کاهش می‌یابد و باعث افزایش سرعت صفحه می‌شود.

خوشبختانه، این یک فرایند دستی نیست. چندین ابزار آنلاین در دسترس هستند تا یک فایل را به نسخه کوچک شده خود تبدیل کنند.

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

• W3 Total Cache
• WP Super Cache
• WP rocket

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

۷. در اولویت قراردادن محتوای بالای صفحه (Above-the-Fold)

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

این بدین معناست که هر عنصری که در قسمت بالای صفحه قرار دارد، در شروع کد HTML صفحه باشد تا مرورگر ابتدا آنها را دانلود و ارائه دهد.

همچنین لازم است که فایل‌های CSS و جاوااسکریپت مورد نیاز برای بالای صفحه به صورت اینلاین (درون صفحه) قرار داشته باشد.

• اصطلاحات تخصصی سئو

۸. بهینه سازی فایل‌های رسانه

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

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

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

بهینه سازی تصاویر

• فرمت ایده‌آل را انتخاب کنید. JPG برای تصاویر عکاسی مناسب است. درحالی که GIF یا PNG مناسب تصاویری با بخش‌های بزرگی از رنگ جامد هستند. فایل‌های PNG ۸ بیتی مناسب تصاویری بدون شبکه آلفا هستند (پس‌زمینه شفاف). فایل‌های ۲۴ بیتی برای تصاویری با کانال آلفا هستند.
• مطمئن شوید که سایز تصاویر مناسب هستند. اگر تصویری با عرض ۸۰۰ پیکسل در وب‌سایت شما نمایش داده شود، استفاده از تصویری با عرض ۱۶۰۰ پیکسل بی‌فایده است.
• فایل تصویر را فشرده کنید. جدا از بهترین برنامه ویرایش تصویر، Adobe Photoshop از قابلیت فشرده سازی تصویر بسیار عالی برخوردار است. همچنین می‌توانید از افزونه‌های رایگان وردپرس نیز استفاده کنید. مانند: WWW Image Optimizer و TinyJPG. این برنامه‌ها بطور خودکار تصاویر بارگذاری شده را فشرده می‌کنند.

بهینه سازی ویدیو

• فرمت دلخواه را انتخاب کنید. در اکثر مواقع MP4 بهترین گزینه است. زیرا MP4 کوچکترین سایز فایل را تولید می‌کند.
• اندازه (ابعاد) بهینه را براساس اندازه صفحه بازدیدکنندگان ارائه دهید.
• اگر در پس‌زمینه از ویدیو به عنوان یک عنصر طراحی استفاده می‌شود، موزیک صوتی را حذف کنید.
• فایل ویدیو را فشرده کنید. من اکثر اوقات از Adobe Premiere استفاده می‌کنم. Camtasia نیز مورد خوبی است.
• طول فیلم را کاهش دهید.
• به جای ارائه ویدیوها از سایت خودتان، آنها را در یوتیوب یا آپارت بارگذاری کنید. سپس از کد iframe آنها استفاده کنید.

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

براساس اجرای تصویر، دو روش برای مدیریت این مسئله وجود دارد:

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

۹. استفاده از CDN و کش

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

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

سخن پایانی

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

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

• کد نویسی سئو چیست
• آموزش سئو تکنیکال
• بهینه سازی محتوا: راهنمای گام به گام بهینه سازی محتوا برای سئو