هفت نکته برای بهینه سازی سرعت صفحه در سال 2023

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

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

در کنسول جستجوی گوگل شروع به کار کنید

آیا می خواهید بدانید که آیا بهینه سازی Core Web Vitals چیزی است که باید در مورد آن فکر کنید؟ از گزارش تجربه صفحه در استفاده کنید کنسول جستجوی گوگل بررسی کنید که آیا هر یک از صفحات وب سایت شما خیلی کند بارگذاری می شود.

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

تست سرعت وب سایت را اجرا کنید

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

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

از نکات اولویت دار برای بهینه سازی برای بزرگترین نقاشی محتوا استفاده کنید

نکات اولویت دار یک ویژگی جدید مرورگر است که در سال 2022 منتشر شد. این ویژگی به صاحبان وب سایت اجازه می دهد تا اهمیت یک تصویر یا منابع دیگر را در صفحه نشان دهند.

این امر به ویژه هنگام بهینه سازی اهمیت دارد بزرگترین محتوا نقاشی، یکی از سه معیار Core Web Vitals. مدت زمانی که طول می کشد تا محتوای صفحه اصلی پس از باز ، صفحه ظاهر شود را اندازه گیری می کند.

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

افزودن ویژگی fetchpriority=”high” به عنصر img که بیشترین محتوای رنگ را بر عهده دارد، دانلود سریع آن را تضمین می کند.

برای بهینه سازی از بارگذاری تنبل تصویر بومی استفاده کنید

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

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

امروزه مرورگرها پشتیبانی می کنند بارگذاری تنبل بومی با ویژگی loading=”lazy” برای تصاویر. به این ترتیب، می توانید بدون نیاز به دانلود کتابخانه جاوا اسکریپت، از مزایای بارگذاری تنبل بهره مند شوید.

منابع مسدودکننده رندر را حذف و بهینه کنید

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

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

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

با تعامل متریک Next Paint جدید بهینه سازی کنید

گوگل معیار جدیدی را به نام اعلام کرد تعامل با نقاشی بعدی. این متریک سرعت پاسخ‌دهی سایت شما به ورودی کاربر را اندازه‌گیری می‌کند و احتمالاً در آینده به یکی از Core Web Vitals تبدیل خواهد شد.

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

به طور مداوم بر عملکرد سایت خود نظارت کنید

تست‌های سرعت یکباره سایت می‌توانند مشکلات عملکردی را در وب‌سایت شما شناسایی کنند، اما ردیابی نتایج تست شما و تأیید بهینه‌سازی‌های شما را آسان نمی‌کنند.

DebugBear به طور مداوم وب سایت شما را کنترل می کند تا در صورت وجود هرگونه مشکلی به شما هشدار دهد. این ابزار همچنین نشان دادن تأثیر کار خود را به مشتریان و به اشتراک گذاشتن نتایج آزمایش با تیم خود آسان می کند.

DebugBear را با یک دوره آزمایشی رایگان 14 روزه امتحان کنید.