سرعت صفحه در سایت چیست؟
- سئودانان
- سئو و بهینه سازی
سرعت صفحه یک عنصر حیاتی برای موفقیت وب سایت شما است. علاوه بر اینکه یکی از فاکتورهای شناخته شده رتبه بندی است، یک معیار کاربردی مهم نیز به شمار می رود.
هیچ کس (مردم یا موتورهای جستجو) نمی خواهند وقت خود را در انتظار بارگذاری صفحات شما بگذرانند، به خصوص زمانی که ده ها وب سایت دیگر در همین موضوع وجود دارند که سریعتر بارگذاری می شوند.
خبر خوب این است که سئودانان راههایی برای بهبود سرعت صفحهتان با بهینهسازی زیرساختهای وبسایت و پیروی از برخی بهترین شیوههایی که وجود دارد را به شما میگوید.
سرعت صفحه چیست؟
سرعت صفحه تعداد ثانیه هایی است که یک صفحه بارگذاری می شود تا زمانی که به طور کامل در دسترس کاربران قرار گیرد.
سرعت صفحه نباید با “سرعت وب سایت” اشتباه گرفته شود. سرعت وب سایت میانگین سرعت صفحه نمونه ای از صفحات یک سایت است.
سرعت بارگذاری یک صفحه خاص ممکن است با میانگین متفاوت باشد (ممکن است کندتر یا سریعتر باشد)، به همین دلیل مهم است که به صورت جداگانه سرعت همه صفحات خود را آزمایش و بهینه کنید.
در آوریل 2010، گوگل رسما اعلام کرد که سرعت صفحه بخشی از الگوریتم رتبه بندی گوگل است .
دلایل اصلی که آنها را مجبور به اضافه کردن سرعت صفحه به عنوان یک عامل رتبه بندی کرد عبارتند از:
– وب سایت های سریع باعث خوشحالی کاربران می شود و زمان بیشتری را در یک وب سایت می گذرانند.
– وب سایت های سریع هزینه های عملیاتی را کاهش می دهند (پهنای باند کمتر و استفاده بهتر از منابع سرور)
– وب سایت های سریع فروش بیشتری (و به طور کلی تبدیل) ایجاد می کنند.
به سرعت به امروز، سرعت صفحه اکنون مهمتر از همیشه است.
آمار نشان میدهد که وبسایتهایی که سرعت بارگذاری آهسته دارند، مشتریان خود را از دست میدهند، زیرا اکثریت بزرگی از کاربران حاضر نیستند بیش از ۳ ثانیه برای بارگذاری یک وبسایت صبر کنند.
علاوه بر این، تعدادی از مطالعات نشان می دهد که بین رتبه بندی گوگل و سرعت صفحه همبستگی وجود دارد. وب سایت هایی که در رتبه های اول گوگل قرار دارند سریعتر از وب سایت هایی که در مکان های پایین ظاهر می شوند بارگذاری می شوند.
سرعت صفحه یک فاکتور رتبه بندی صفحه است به این معنی که بر هر صفحه به طور جداگانه تأثیر می گذارد و نه کل وب سایت
سرعت ایده آل صفحه چقدر است؟
به طور غیر رسمی، سرعت صفحه ایده آل برای وب سایت های دسکتاپ و موبایل کمتر از 3 ثانیه است. من می گویم “غیر رسمی” زیرا این عددی است که از نظرسنجی ها و مطالعات کاربران بدست می آید و عدد رسمی مورد استفاده الگوریتم های گوگل در طی فرآیند رتبه بندی نیست.
روشی که گوگل با سرعت صفحه برخورد می کند این است که صفحات را به «واقعاً خوب» و «بسیار بد» دسته بندی می کند.
این بدان معنی است که اگر یک وب سایت خیلی کند باشد، ممکن است تأثیر منفی بر رتبه بندی آن داشته باشد. در غیر این صورت، الگوریتم با تمام وب سایت ها یکسان رفتار می کند.
میتوانید ویدیوی زیر را از گوگل تماشا کنید که در مورد نحوه برخورد گوگل با سرعت صفحه و به طور کلی سرعت سایت بحث میکند.
به عنوان یک قانون کلی، شما باید تمام اقدامات لازم را انجام دهید تا اطمینان حاصل کنید که وب سایت شما در سریع ترین زمان ممکن بارگذاری می شود.
وب سایت های کند تجربه کاربری بدی را ارائه می دهند و این بدان معناست که آنها پول و مشتریان خود را از دست می دهند.
15 روش برای افزایش سرعت صفحه
- تصاویر خود را فشرده و بهینه کنید
- تحویل ویدیوها را بهینه کنید
- فعال کردن کش
- CSS و JS را کوچک کنید
- اسکریپت های مسدود کننده رندر را حذف کنید
- از اسکریپت ها به صورت ناهمزمان استفاده کنید
- از حافظه پنهان مرورگر استفاده کنید
- از بارگذاری و واکشی اولیه منابع استفاده کنید
- به یک میزبان سریعتر بروید
- افزونه های غیر ضروری را غیرفعال کنید
- نرم افزار CMS و افزونه های خود را ارتقا دهید
- به آخرین نسخه PHP ارتقا دهید
- استفاده از یک شبکه تحویل محتوا (CDN) را در نظر بگیرید
- DB خود را بهینه کنید
- از ماژول سرعت صفحه گوگل استفاده کنید
در اکثر موارد، یک صفحه وب به دلیل تعداد و اندازه تصاویر کند است. تصاویر با کیفیت خوب و سایر عناصر بصری برای SEO و قابلیت استفاده مهم هستند، بنابراین حذف کامل آنها یک گزینه نیست.
کاری که باید در عوض انجام دهید این است که سعی کنید اندازه فایل آنها را بدون کاهش کیفیت آنها به حداقل برسانید.
توصیه های زیر را دنبال کنید:
از اندازه مناسب تصاویر استفاده کنید – قبل از آپلود تصویر در وب سایت خود، اندازه آن را به حداکثر عرض مورد نیاز خود تغییر دهید.
به عنوان مثال، اگر حداکثر عرضی که تصاویر را در وبلاگ خود نشان می دهید 1200 پیکسل باشد، آپلود تصاویر بزرگتر از این اتلاف است.
میتوانید از ابزارهایی مانند Photoshop ، Gimp یا Pixelmator برای باز کردن یک تصویر، تغییر ابعاد آن و صادرات به یک فرمت سازگار با وب مانند jpg یا png استفاده کنید.
استفاده از بهینه ساز تصویر (بسیار مهم) – مرحله بعدی استفاده از بهینه ساز تصویر است. تصاویری که از طریق فتوشاپ یا پیکسلماتور صادر می شوند، در مورد اندازه فایل بهینه به طور کامل بهینه نمی شوند.
ابزارهایی مانند imageOptim (برای کاربران مک) یا فشردهکننده تصویر میتوانند به طور چشمگیری اندازه فایل یک تصویر را بدون تأثیر بر کیفیت آن کاهش دهند.
به اسکرین شات زیر نگاه کنید. هر دو تصویر دقیقاً یکسان به نظر می رسند و ابعاد یکسانی دارند. اندازه فایل تصویر سمت راست 56 درصد کوچکتر است.
نمونه فشرده سازی تصویر
این دو مرحله به تنهایی حجم تصاویر شما را کاهش می دهد و تاثیر زیادی بر سرعت بارگذاری صفحه شما به خصوص در دستگاه های تلفن همراه خواهد داشت.
از تصاویر واکنش گرا استفاده کنید: وردپرس را به آخرین نسخه ارتقا دهید تا بتوانید از تصاویر واکنش گرا استفاده کنید،
کاری که این ویژگی انجام می دهد دو چیز است:
– هنگامی که یک تصویر را در کتابخانه رسانه وردپرس آپلود می کنید، به طور خودکار مجموعه ای از تصاویر را ایجاد می کند که اندازه های متفاوتی دارند.
– هنگامی که یک صفحه بارگذاری می شود و بسته به وضوح، به طور خودکار اندازه تصویر معادل را به کاربران نشان می دهد.
این به این معنی است که در تلفن همراه یک تصویر با اندازه کوچکتر به کاربران ارائه می شود و این باعث بهبود سرعت صفحه موبایل، به خصوص در صفحاتی با تصاویر زیاد می شود.
اگر از وردپرس استفاده نمیکنید، میتوانید از یک توسعهدهنده کمک بگیرید تا تصاویر واکنشگرا را در CMS خود پیادهسازی کند. این قابلیتی است که در هر وب سایتی قابل پیاده سازی است.
یادداشت مهم:
تصاویر ریسپانسیو جدید که به طور خودکار توسط وردپرس ایجاد می شوند، حتی اگر تصویر اصلی بهینه شده باشد، به طور کامل بهینه نمی شوند.
این بدان معنی است که یا باید از یک سرویس فشرده سازی تصویر برای انجام این کار برای شما استفاده کنید، یا با استفاده از imageOptim یا هر نرم افزار دیگری، تصاویر را به صورت دستی بهینه کنید.
کاری که من به صورت ماهانه انجام میدهم این است که همه تصاویر ماه (که در زیر /wp-content/uploads/[year][month] یافت میشود)، در رایانه شخصی خود، بهینهسازی آنها با استفاده از imageOptim و بارگذاری مجدد آنها به سرور است.
از بارگذاری تنبل استفاده کنید: این تکنیکی است که در آن مرورگرها تصاویر را در یک صفحه یا پست در زمانی که نیاز دارند بارگذاری می کنند، یعنی زمانی که کاربران صفحه را به پایین اسکرول می کنند و نه همه تصاویر را یکجا (این رفتار پیش فرض است).
با انجام این کار، صفحات سریعتر بارگذاری می شوند، به خصوص در تلفن همراه.
خبر خوب این است که تعدادی افزونه وجود دارد که می تواند به شما کمک کند این کار را بدون نیاز به تغییر در وب سایت خود انجام دهید.
Native Lazyload – یک افزونه وردپرس توسط گوگل که از ویژگی مرورگر بومی استفاده می کند. تنها کاری که باید انجام دهید این است که افزونه را نصب کرده و آن را فعال کنید. هیچ گزینه ای برای پیکربندی وجود ندارد.
WP-ROCKET – یک افزونه ممتاز وردپرس است که از بارگذاری تنبل تصاویر و ویدیوها پشتیبانی می کند. این افزونه ای است که من در وب سایت خود از آن استفاده می کنم.
2.آماده سازی فیلم ها را بهینه کنید.
یکی دیگر از عناصری که می تواند سرعت صفحات شما را به میزان قابل توجهی کاهش دهد، اگر به درستی بهینه سازی نشود، ویدیوها هستند.
هنگام جاسازی ویدیوها در محتوای خود، باید بهترین روش ها را دنبال کنید:
آپلود ویدیوها در یک سرویس استریم : بهترین راه برای به حداقل رساندن تأثیر ویدیوها بر سرعت بارگذاری صفحه این است که آنها را در یک سرویس پخش جریانی مانند YouTube یا Vimeo آپلود کنید و سپس آنها را در وب سایت خود جاسازی کنید.
با انجام این کار، سرور شما مسئول پخش محتوای ویدیویی نیست، اما محتوا مستقیماً از ارائه دهنده می آید.
پخش خودکار ویدیو را غیرفعال کنید : مطمئن شوید که از پخش خودکار استفاده نمی کنید. علاوه بر اینکه یک تجربه کاربری بد است، بارگذاری صفحه را نیز به میزان قابل توجهی کاهش می دهد.
از بارگذاری تنبل استفاده کنید: تکنیک بارگذاری تنبل را می توان برای ویدیوها نیز اعمال کرد. ویدئوها فقط از منبع خارجی بارگیری می شوند، زمانی که در نمای کاربر باشند و نه زمانی که صفحه بارگیری می شود.
iframe ویدیو را با یک تصویر پیشنمایش جایگزین کنید:این تکنیک دیگری است که میتوانید استفاده کنید. در حالی که منتظر بارگذاری یک ویدیو هستید، یک تصویر پیشنمایش را به کاربران نشان میدهید. Wp-rocket دارای این ویژگی داخلی است.
3. کش را فعال کنید
کش مکانیزمی است که به سرعت صفحه کمک زیادی می کند و برای همه وب سایت ها ضروری است.
به عبارت ساده، هنگامی که از کش استفاده می کنید ، سرور نسخه های HTML ایستا از صفحات وب شما را ایجاد می کند و به جای اینکه هر بار درخواستی برای یک صفحه وجود دارد، صفحات را از ابتدا تولید کند، آن ها را به کاربران نشان می دهد.
برای فعال کردن کش در وب سایت وردپرس خود، می توانید از یک افزونه کش مانند wp-rocket یا wp super cache استفاده کنید.
این پلاگین ها تمام قوانین کش لازم را به فایل .htacess شما اضافه می کنند و حتی یک کش جداگانه برای کاربران موبایل و یک کش برای کاربران وارد شده ایجاد می کنند.
پیکربندی افزونه ساده است و نیازی به دانش فنی نیست
این باعث می شود که فرآیند سریعتر شود، منابع سرور کمتری مورد نیاز است و کاربر تجربه بهتری کسب کند.
مکانیسم کش به اندازه کافی هوشمندانه است که بفهمد چه زمانی در یک صفحه تغییری ایجاد می شود یا چه زمانی یک صفحه ذخیره نمی شود، بنابراین تجربه کلی وب سایت یکسان است.
4. CSS و JS را کوچک کنید
Minification فرآیندی است که تمام کاراکترهای غیر ضروری را از فایلهای CSS و JS (مانند کامنتها و فضاهای سفید) حذف میکند و این باعث میشود آن فایلها حجم کمتری داشته باشند.
کوچک سازی حجم فایل های CSS و JS را کاهش می دهد
Minification عملکرد را تغییر نمی دهد، اما اندازه فایل را کاهش می دهد و این به معنای زمان بارگذاری سریعتر است.
برای افراد غیر فنی، CSS و JS فایل هایی هستند که توسط انواع وب سایت ها و پلتفرم ها استفاده می شوند. CSS مسئول استایل یک صفحه و JS برای عملکرد است.
سه راه برای فعال کردن Minification در وب سایت شما وجود دارد:
1 – بررسی کنید که آیا CMS شما از این گزینه پشتیبانی می کند یا خیر. به طور معمول این مورد در قسمت “بهینه سازی سرعت” یا پیشرفته یافت می شود.
2 – اگر از وردپرس استفاده می کنید، بررسی کنید که آیا این گزینه در تنظیمات قالب شما موجود است یا خیر.
3 – از یک پلاگین کوچک سازی مانند wp-rocketیا autoptimize استفاده کنید.
5. اسکریپت های مسدود کننده رندر را حذف کنید
هنگامی که یک صفحه بارگذاری می شود، مرورگر سعی می کند تمام منابع تعریف شده در هدر را بارگیری کند و سپس با بقیه صفحه ادامه دهد.
منابع سرصفحه ممکن است شامل اسکریپت Google Analytics، پیکسل فیس بوک، اسکریپت تبلیغات گوگل و بسیاری دیگر از اسکریپت های مورد نیاز وب سایت شما برای عملکرد صحیح باشد.
اگر هر یک از این منابع به سرعت بارگیری نشود، بارگذاری صفحه به تاخیر می افتد.
کاری که می توانید برای جلوگیری از این وضعیت انجام دهید دو چیز است:
- سعی کنید هیچ منبع یا اسکریپت خارجی (مگر اینکه واقعاً ضروری باشد) به هدر وب سایت اضافه نکنید.
اسکریپت های مسدود کننده رندر را به پاورقی وب سایت منتقل کنید. اگر این خیلی فنی به نظر می رسد، می توانید از wp-rocket یا کمک یک توسعه دهنده برای انجام این کار برای شما استفاده کنید.