چگونه سرعت صفحه و ترافیک وب‌سایت‌مان را بهبود دهیم؟

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

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

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

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

۱. صرفه‌جویی در بودجه میزبانی وب (Web Hosting)

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

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

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

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

(همچنین بخوانید: همه چیزهایی که باید درباره منطق فازی بدانید)

میزان تفاوت ایجاد شده چه‌قدر است؟

بر اساس مطالعه‌ای که آمازون انجام داده است، تفاوتِ تنها  ۱۰۰ms (واحد زمانی که یک انسان حتی نمی‌تواند آن را درک کند)، برای کاهش یک درصدی فروش کافی است. اگر این واحد کوچک زمان تاثیر بسیار زیادی روی فروش داشته باشد، تصور می‌کنید زمان بیش‌تر چه تاثیری روی آن خواهد داشت؟ اما این موضوع متوقف نمی‌شود، زیرا سرعت بارگذاری وب‌سایت شما به‌سرعت یا به‌آرامی، بر رتبه‌بندی ارقام جست‌وجو و هزینه‌های پرداخت به ازای هر کلیک تاثیر می‌گذارد.

راهکار:

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

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

۲. کاهش فراخوان‌ها از HTTP

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

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

بیشتر تم‌ها یک یا چند فایل CSS و چندین فایل جاوا اسکریپت را بارگذاری می‌کنند. بعضی از آن‌ها مانند جی‌کوئری (Jquery) یا FontAwesome معمولا از راه دور از یک سرور دیگر بارگیری می‌شوند که به‌طور قابل توجهی زمان لازم برای بارگذاری صفحه را افزایش می‌دهد.

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

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

۳. استفاده از اسلش در انتهای لینک

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

چگونه این اتفاق می‌افتد؟

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

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

https://example.com (نامناسب)

https://example.com/services (نامناسب)

https://example.com/ (مناسب)

https://example.com/services/ (مناسب)

 ۴. فعال‌سازی فشرده‌سازی

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

نگران نباشید؛ بازدیدکنندگان شما نیازی به انجام کار اضافی ندارند زیرا تمام مرورگرهای مدرن از GZIP پشتیبانی می‌کنند و به‌طور خودکار آن را برای تمام درخواست‌های HTTP پردازش می‌کنند.

(همچنین بخوانید: قبل از ارزش‌آفرینی داده‌های موجود را بررسی کنید)

۵. فعال کردن کش مرورگر

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

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

 ۶. کاهش منابع

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

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

از جمله پلاگین‌های محبوب کش، عبارتند از:

W3 Total Cache، WP Super Cache، WP Rocket. ممکن است برای انجام  درست تنظیمات به کمی تلاش نیاز داشته باشید، زیرا کاهش حجم وقفه ایجاد می‌کند، پس هنگامی که موفق به کاهش حجم همه موارد شدید، لازم است که وب‌سایت خود را کاملا آزمایش کنید.

۷. اولویت‌بندی محتوای بالای صفحه

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

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

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

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

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

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

فرمت ایده‌آل را انتخاب کنید. فرمت JPG مناسب برای تصاویر عکاسی است، در حالی که GIF یا PNG برای تصاویر با زمینه‌های بزرگ بهتر است. فایل‌های 8 بیتی PNG برای تصاویر بدون کانال آلفا (پس زمینه شفاف) و فایل‌های 24 بیتی برای تصاویر با کانال آلفا مناسب هستند. مطمئن شوید که تصاویر به‌درستی سایز شده‌اند. اگر یک تصویر در عرض 800 پیکسل در وب‌سایت شما نمایش داده شود، هیچ مزیتی برای استفاده از یک تصویر گسترده 1600 پیکسل وجود ندارد.

نرم‌افزار فتوشاپ علاوه‌بر داشتن برنامه ویرایش عکس، دارای قابلیت فشرده‌سازی تصویر بسیار عالی نیز هست. شما همچنین می‌توانید از پلاگین‌های رایگان وردپرس مانند WWW Image Optimizer، Imsanity و TinyJPG استفاده کنید که به‌صورت خودکار تصاویر آپلود شده را فشرده می‌کنند.

(همچنین بخوانید: پرسش‌هایی که راهنمای شما در تیم‌سازی موفق هستند)

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

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

برای فشرده‌سازی ویدئوها می توانید از نرم افزار Adobe Premiere یا Camtasia استفاده کنید.

کاهش طول ویدئو

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

دو راه برای رسیدگی به این موضوع وجود دارد:

۱. تصاویر در داخل HTML وب‌سایت شما با استفاده از src ارائه می‌شود که مرورگر را قادر می‌سازد تا انتخاب، دانلود و نمایش تصویر مناسب بر اساس اندازه صفحه نمایش دستگاه مورد استفاده بازدیدکننده را نشان دهد.

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

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

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

(همچنین بخوانید: اقتصاد امن و سرمایه‌هایی که باید کارآفرینی کنند)

منبع