Google Lighthouse چیست؟

فانوس دریایی گوگل چیست؟

Google Lighthouse یک ابزار رایگان Google است که به شما کمک می کند کیفیت صفحات وب را در وب سایت خود بهبود بخشید.

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

این نرم افزار منبع باز است و هر کسی می تواند از آن در هر صفحه وب استفاده کند.

این که آیا شما یک توسعه دهنده وب، SEO‌کار یا صاحب وب سایت هستید، Google Lighthouse می تواند به شما در افزایش تجربه و عملکرد کلی وب سایت شما کمک کند.

در این، نحوه کار Google Lighthouse و نحوه استفاده از آن برای حسابرسی صفحات وب خود را پوشش خواهیم داد.

Lighthouse گوگل چگونه کار می کند؟

Google Lighthouse با انجام ممیزی برای پنج دسته اصلی بهینه سازی وب سایت کار می کند.

1. عملکرد

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

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

• First Contentful Paint (FCP): اندازه گیری زمانی که اولین متن یا تصویر برای کاربران قابل مشاهده است.
• Largest Contentful Paint (LCP): محاسبه زمان یک صفحه برای بارگذاری بزرگترین عنصر ان برای کاربران.
• Total Blocking Time (TBT): اندازه گیری مقدار زمانی که یک صفحه از واکنش به ورودی کاربر مسدود می شود، مانند کلیک ماوس.
• Cumulative Layout Shift (CLS): اندازه گیری تغییرات ظاهر سایت تا چیدمان کامل المان‌ها و عناصر صفحه.
• Speed Index (SI): شاخصی که نشان می دهد که محتوای یک صفحه چقدر سریع بارگذاری می شود.

Lighthouse نمره عملکرد کلی را به یک صفحه بر اساس نحوه عملکرد صفحه شما برای تمام این معیارها اختصاص می دهد. نمره می تواند هر چیزی از 0 تا 100 باشد.

اگر نمره شما بین 90 تا 100 باشد، نشان می دهد که صفحه شما به خوبی برای تجربه کاربر بهینه شده است.

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

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

2. دسترسی پذیری

تست دسترسی پذیری Lighthouse تجزیه و تحلیل می کند که چگونه افرادی که از فن اوری های کمکی استفاده می کنند می توانند از وب سایت شما استفاده کنند.

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

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

این بخش نیز شبیه به گزارش حسابرسی عملکرد(performance audit report)، گزارش دسترسی به شما نمره 100 را می دهد. هر چه نمره بالاتر باشد، بهتر است.

3. بهترین حسابرسی‌ها

بهترین حسابرسی در Lighthouse بررسی می کند که آیا صفحه شما بر اساس استانداردهای مدرن توسعه وب ساخته شده است یا خیر.

Lighthouse بررسی می کند که آیا:

• منابع بارگذاری شده از سرورهای امن با HTTPS هستند یا خیر.
• تمام تصاویر با نسبت ابعاد صحیح و با وضوح مناسب ظاهر می شوند.
• تمام کتابخانه های جاوا اسکریپت امن و عاری از هر گونه اسیب پذیری هستند.
• صفحه دارای DOCTYPE HTML است
• سیاست امنیت محتوا (CSP) در برابر حملات اسکریپت متقابل سایت (XSS) موثر است.
• صفحه عاری از تمام خطاهای مرورگر است.
• صفحه از چارچوب های منسوخ شده و API های نا‌مناسب فارق است.
• صفحه نقشه‌های متن معتبر دارد.
• صفحه از مسائل ظاهر شده در پانل DevTools Chrome، مانند خرابی درخواست شبکه، اقدامات امنیتی ناکافی و سایر مسائل مرورگر در امان است.
• کدگذاری encoding صفحه با برچسب meta charset تنظیم شده است.
• آیا صفحه اجازه می دهد تا کاربران رمز‌های عبور را کپی کنند.
• صفحه یک تجربه کاربری خوب را با مسدود کردن موقعیت جغرافیایی و درخواست مجوز اطلاع رسانی در بار صفحه ایجاد می کند.

همه این عوامل نمره شما را از 100 تعیین می کنند.

4. جستجوگرها

Lighthouse یک تست برای تجزیه و تحلیل صفحه وب شما برای برخی از جنبه های فنی SEO انجام می دهد.

به طور خاص، بررسی می کند که آیا:

• صفحه وب شما mobile-friendly است.
• صفحه دارای داده های ساختاری معتبر است.
• لینک های داخلی قابل خزیدن هستند.
• صفحه دارای خصیصه hreflang معتبر است.
• تگ های عنوان و توضیحات متا تنظیم شده اند.
• صفحه قابل فهرست بندی است.
• robots.txt معتبر است.
• صفحه دارای برچسب معتبر "rel=canonical" است.
• محتوای صفحه مستقل از افزونه ها است.
• لینک ها در یک صفحه با متن توصیفی معرفی می شوند.
• تصاویر در یک صفحه دارای متنهای جایگزین هستند.
• صفحه دارای برچسب متای viewport با مجموعه عرض یا مقیاس اولیه است.

و سپس یک امتیاز از 100 اختصاص می دهد.

اما این ابزار به شما یک تصویر کامل از SEO نمی دهد.

اگر می خواهید وب سایت شما در گوگل رتبه بهتری داشته باشد، باید اطمینان حاصل کنید که برای تمام جنبه های SEO بهینه شده است. اطمینان حاصل کنید که هیچ مشکلی بر رتبه بندی شما تاثیر نمی گذارد.

هنگامی که حسابرسی کامل شد، شما یک نمای از سلامت SEO وب سایت خود را دریافت خواهید کرد.

5. برنامه وب پیش‌رونده (PWA)

ممیزی PWA در Lighthouse تایید می کند که آیا برنامه وب شما از قابلیت های وب مدرن برای ارائه یک تجربه مطلوب کاربر استفاده می کند.

گزارش حسابرسی همچنین پیشنهاداتی را برای بهبود عملکرد کلی PWA شما ارائه می دهد. از جمله مسائل خاصی که باید مورد توجه قرار گیرد.

چگونه از Google Lighthouse استفاده کنیم

اکنون که می دانید Google Lighthouse چیست و چگونه کار می کند، بیایید به روش های مختلفی که می توانید از آن برای حسابرسی صفحات خود استفاده کنید نگاه کنید.

استفاده از Lighthouse با Chrome DevTools

در مرورگر Chrome، می توانید ممیزی Google Lighthouse را با Chrome DevTools اجرا کنید.

صفحه ای را که می خواهید بررسی کنید باز کنید.

سپس روی هر نقطه از صفحه راست کلیک کنید و "Inspect" را انتخاب کنید.

"Lighthouse" را از نوار ابزار پانل انتخاب کنید. (اگر نمی توانید گزینه Lighthouse را پیدا کنید، روی دو فلش در انتهای نوار ابزار کلیک کنید. ان را در انجا خواهید دید.)

از اینجا، شما می توانید یک، بیشتر یا همه دسته ها را انتخاب کنید، بسته به اینکه کدام جنبه های وب سایت خود را می خواهید تجزیه و تحلیل کنید. و روی "Analyze page load" کلیک کنید.

سپس ابزار یک گزارش برای شما تولید خواهد کرد. شما نمرات حسابرسی خود را برای هر دسته در بالا پیدا خواهید کرد.

شما می توانید بر روی یک دسته خاص برای کسب اطلاعات بیشتر کلیک کنید. در این مثال، ما روی Performance audit کلیک کردیم.

توجه داشته باشید: شما متوجه خواهید شد که Lighthouse زمانی که شما یک performance audit را با DevTools اجرا می کنید عملکردتان را برای شش معیار سرعت (به جای پنج) اندازه گیری می کند‌.

این معیار اضافی Time to Interactive (TTI) است. که محاسبه زمان لازم برای یک صفحه برای تبدیل شدن به طور کامل تعاملی برای کاربران است.

این معیار یکی از معیارهای منسوخ شده است. مشخص نیست که چرا هنوز هم برای زمانی که شما ممیزی Lighthouse را در DevTools اجرا می کنید، حساب می شود.

استفاده از Lighthouse با افزونه Chrome

Lighthouse دارای یک افزونه Chrome است که می تواند ممیزی ها را برای شما انجام دهد.

در مرورگر Chrome، افزونه Lighthouse Chrome را نصب کنید.

صفحه ای که می خواهید تست کنید را ببینید.

سپس منوی افزونه Chrome را باز کنید و "Lighthouse" را انتخاب کنید.

سپس بر روی ایکون چرخ دنده کلیک کنید.

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

سپس حسابرسی را با کلیک کردن بر روی دکمه "Generate report" شروع کنید.

Lighthouse یک گزارش برای شما در یک تب جدید تولید کند.

استفاده از Lighthouse در PageSpeed Insights

Lighthouse نیز از طریق ابزار Google PageSpeed Insights در دسترس است.

ابزار را باز کنید. URL صفحه خود را وارد کنید و روی "Analyze" کلیک کنید.

این ابزار گزارش هایی را برای همه دسته ها به جز PWA تولید می کند. بینش PageSpeed حسابرسی PWA را انجام نمی دهد.

استفاده از Google Lighthouse از طریق Node Module

شما همچنین می توانید از یک ماژول Node JavaScript برای اجرای ممیزی Lighthouse استفاده کنید.

Node فعلی را بر روی سیستم خود نصب کنید.

سپس خط فرمان زیر را برای نصب Lighthouse اجرا کنید:

npm install -g lighthouse

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

lighthouse <url>

(شما باید "URL" را با آدرس وب صفحه ای که می خواهید ازمایش کنید جایگزین کنید.)

سؤالات متداول

تفاوت Lighthouse با PageSpeed Insights

Lighthouse با PageSpeed Insights متفاوت است زیرا Lighthouse فقط از داده های آزمایشگاهی برای اندازه گیری عملکرد صفحات شما استفاده می کند. در حالی که PageSpeed از داده های آزمایشگاهی و میدانی با هم استفاده می کند.

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

چرا نمرات من هر بار که تست می دهم متفاوت است؟

نمراتی که در Lighthouse می بینید می تواند هر بار که آزمون را اجرا می کنید متفاوت باشد.

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

آیا گزارش های Ligthouse شامل معیارهای اصلی وب سایت است؟

بله. ممیزی عملکرد در Lighthouse وب سایت شما را برای معیارهای اصلی وب Vitals  تجزیه و تحلیل می کند.