بهینه سازی سرعت صفحه: اندازه گیری ها ، ابزارها و نحوه بهبود

سرعت صفحه یک نکته مهم برای کار SEO شما است ، اما موضوع پیچیده ای است که تمایل دارد بسیار فنی باشد. مهمترین موارد برای درک سرعت صفحه سایت شما چیست و چگونه می توانید شروع به پیشرفت کنید؟ در نسخه این هفته جمعه Whiteboard جمعه ، بریتنی مولر آنچه را که باید برای شروع کار بدانید می رود.

توجه: به اشتباه به جای "BigQuery" "BigML" را گفت.





برای باز کردن نسخه با وضوح بالا در یک برگه جدید ، روی تصویر تخته سفید کلیک کنید!

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

در همان سطح اساسی می خواهم به طور خلاصه چگونگی بارگیری یک صفحه وب را توضیح دهم. به این ترتیب می توانیم سر خود را ببندیم که چرا این همه اهمیت دارد.

نحوه بارگیری یک صفحه وب


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

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

مواردی که می تواند باعث کند شدن سایت شما شود
برخی از متهمین رایج ترین چیست؟

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

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

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

گزارش تجربه کاربر Chrome
این معیارهای کاربر واقعی Chrome است. متأسفانه ، این فقط برای وب سایتهای بزرگ و پرطرفدار در دسترس است ، اما شما داده های خوبی را از آن می گیرید. این برنامه در BigQuery قرار دارد ، بنابراین برخی از دانش بنیادی SQL مورد نیاز است.

فانوس دریایی
Lighthouse ، یکی از موارد دلخواه من ، درست در Chrome Dev Tools موجود است. اگر در یک صفحه وب هستید و بر روی Inspect Element کلیک می کنید و Chrome Dev Tools را باز می کنید ، در سمت راست سمت راست که می گوید Audit است ، می توانید یک گزارش Lighthouse را درست در مرورگر خود اجرا کنید.



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

بینش صفحه سرعت
صفحه Speed ​​Insights واقعاً جالب است. آنها اکنون گزارش تجربه کاربری Chrome را درج کرده اند. اما اگر شما جزء آن سایت های بزرگ نیستید ، حتی نمی توانید سرعت صفحه واقعی خود را اندازه بگیرید. در ادامه می خواهیم چگونگی پیکربندی سایت خود را بررسی کرده و مطابق با آن بازخورد ارائه دهید و به آن نمره دهید. فقط چیز خوبی است که باید از آن آگاهی داشته باشید. این هنوز هم ارزش خوبی را ارائه می دهد.

سرعت و عملکرد وب سایت تلفن همراه خود را تست کنید
من نمی دانم عنوان این چیست؟ اگر این کار را کردید ، لطفاً در زیر نظر دهید. اما در testmysite.thinkwithgoogle.com قرار دارد . این یکی واقعا جالب است زیرا سرعت موبایل سایت شما را آزمایش می کند. اگر به پایین بروید ، مستقیماً آن را با ROI برای تجارت یا وب سایت خود پیوند می دهد. ما می بینیم که Google با استفاده از معیارهای واقعی ، اعدام می کند و آن را به درصد افرادی که از دست می دهید متصل می کند زیرا سایت شما این کند است. این یک روش درخشان برای جلب همه ما در سوار شدن و مبارزه با برخی از این پیشرفت ها است.

Pingdom و GTmetrix محصولات غیر Google یا ابزارهای غیر Google هستند ، اما بسیار مفید نیز هستند.

معیارهای سرعت سایت
بنابراین برخی از معیارها چیست؟

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

اولین رنگ مشروب چیست؟
اولین رنگ محتوا وقتی ظاهر می شود که محتوای اول ظاهر می شود. این ممکن است بخشی از ناو یا نوار جستجو یا هر آنچه ممکن است باشد باشد. - این اولین رنگ موفقی است.

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

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

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

راه های بهبود سرعت صفحه شما
HTTP / 2
HTTP / 2 قطعاً می تواند همه چیز را سرعت ببخشد. تا چه حد ، شما باید به نوع تحقیق بپردازید و آزمایش کنید.

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

فعال کردن ذخیره و استفاده از شبکه تحویل محتوا (CDN)
ذخیره سازی بسیار مهم است. قطعاً تحقیقات خود را انجام دهید و مطمئن شوید که به درستی تنظیم شده است. با CDN ها ، در سرعت بخشیدن به یک سایت بسیار ارزشمند است ، اما می خواهید مطمئن شوید که CDN شما به درستی تنظیم شده است.

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

منابع را به حداقل برسانید
همچنین می توانید منابع را به حداقل برسانید. بنابراین واقعاً خوب است که بدانید که minification ، bundling و compression چه کاری انجام می دهند ، بنابراین می توانید برخی از این مکالمات فنی تر را با توسعه دهندگان یا با هر شخص دیگری که در سایت کار می کند ، داشته باشید.

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

من واقعاً ممنونم که این نسخه جمعه Whiteboard را امتحان کرده اید و به زودی همه شما را خواهم دید. خیلی ممنون. به امید دیدار.