“Google Lighthouse là gì?”, “Sử dụng công cụ Google Lighthouse có giúp ích gì cho website hay không?” là câu hỏi được rất nhiều người dùng quan tâm. Hôm nay, hãy cùng chúng tôi tìm hiểu chi tiết về công vụ này ở bài viết dưới đây.
Google Lighthouse là gì? Hướng dẫn sử dụng Google Lighthouse
Mục lục nội dung
Google Lighthouse là gì?
Lighthouse là công cụ mã nguồn tự động. Chúng được Google phát triển để đo lường, phân tích, cải thiện chất lượng và tối ưu website. Có thể nói công cụ này là toàn diện nhất của Google. Lighthouse sẽ kiểm tra toàn bộ các tiêu chí để web của bạn hoạt động ổn định và hiệu quả bao gồm: khả năng truy cập, hiệu suất, SEO, web app cùng nhiều yếu tố khác,…
Ngoài những nghiên cứu và phân tích, Lighthouse còn đưa ra những lời khuyên rát giá trị giúp bạn cải tổ web của mình .
Cách sử dụng Lighthouse
Để sử dụng Lighthouse có 3 cách thức chính bao gồm:
Chạy Lighthouse trong Chrome DevTools
Để có được báo cáo giải trình nghiên cứu và phân tích website, bạn làm theo những bước sau :
- Bước 1 : Bạn vào web của mình và kiểm tra bằngtrình duyệt Chrome.
- Bước 2 : ChọnF12( hoặc tổng hợpCtrl-Shift-L) mởDeveloper Tools. Sau đó chọnAudits.
- Bước 3 : Lựa chọnPerform an Audit DevTools để hiển thị listAudit categories.
- Bước 4 : Đánh tick vào những mục bạn muốn nghiên cứu và phân tích
Đánh tick vào các mục bạn muốn phân tích
- Bước 5 : Click vào Run Audit, đợi từ 60-100 giây để Lighthouse hiển thị nghiên cứu và phân tích những thông tin nghiên cứu và phân tích về web .
Click vào Run Audit, để phân tích các thông tin phân tích về web
Cài đặt và chạy Node command line tool
Trước tiên, bạn cần đặt Node module theo những bước sau :
- Bước 1 : Download Google Chrome for Desktop .
- Bước 2 : Cài đặt bản Long-Term Supportmới nhất của Node.
Cài đặt bản Long-Term Support mới nhất của Node
- Bước 3 : Tiến hành càiLighthousebằng lệnh “npm install -g lighthouse” .
- Bước 4 : Tạo Audit bằng lệnh “lighthouse
- Bước 5 : Hiển thị tùy chọn Audit “lighthouse –help” .
Chạy Lighthouse bằng Chrome Extension
Theo cách này bạn sử dụng Lighthouse cần làm theo những thao tác sau :
- Bước 1 : Vào Chrome webstore, tìmLighthouse Chrome Extension-> Add to Chrome để cài tiện íchLighthousevào máy của bạn .
- Bước 2 : Bạn truy vấn vào web bạn muốn Audit .
- Bước 3 : Chọn vào ký hiệuExtension Lighthouseở góc phải thanhChrome Address bar. Nếu chúng không hiện ra, bạn cần vào menu của Chrome để kích hoạtExtension.
- Bước 4 : ChọnGenerate report. Lúc nàyLighthousesẽ kiểm tra website của bạn và sau đó sẽ bào hiệu quả .
Chọn Generate report
Kết luận: Cách 1 sử dụng Chrome DevTools vẫn nhanh chóng và hiệu quả nhất. Còn nếu cần cài đặt thì cách 3 sử dụng Chrome Extension là tối ưu nhất.
👉👉👉 Xem thêm về: Khóa học Digital Marketing FPT
Cách chia sẻ và xem báo cáo trực tuyến
Bạn có thể trực tiếp vào Lighthouse Viewer để xem các báo cáo, phân tích website của bạn trực tuyến. Ngoài ra, các cách thông dụng khác như:
Chia sẻ báo cáo bằng JSON
Lighthouse Viewer cần có JSON output để chia sẻ các báo cáo, các thống kê, số liệu phân tích về web. Các hướng dẫn để lấy JSON output phụ thuộc vào Lighthouse workflow bạn đang sử dụng:
- Nếu dùng trongChrome Devtools
, bạn chỉ cần chọn
Download Report để tải báo cáo giải trình về .
- Nếu dùngCommand line, bạn cần chạy lệnh sau :“lighthouse –output json –output-path
” . - Nếu dùngLighthouse Extensionthì sau khi nhận báo cáo giải trình, bạn chọnExport->Save as JSON.
Khi muốn xem dữ liệu phân tích, bạn mở Lighthouse Viewer trong Google Chrome. Sau đó, kéo file JSON vào trang Viewer để hiển thị báo cáo.
Chia sẻ báo cáo dưới dạng GitHub Gists
Ngoài báo cáo giải trình trên JSON, bạn cũng hoàn toàn có thể xem báo cáo giải trình nghiên cứu và phân tích, thống kê website dưới dạng GitHub Gists bí hiểm. Các bước cần làm gồm có :
- Bước 1 : Sau khi nhận được báo cáo giải trình, chọnExport->Open In Viewer. Sau đó, báo cáo giải trình sẽ được mở trongViewer, đường linktại đây.
- Bước 2 :Trong Viewerkhi chọnShare, màn hình hiển thị sẽ hiệncửa sổvà nhu yếutruy cập GitHubđể xem và lưu tài liệu của bạn .
- Bước 3 : Để có file báo cáo giải trình, Gits từ bảnCLIcủa Lighthouse, bạn cần tạo file qua thao tác copy “ từ file JSON output vào Gist ” .
Bước 4: Để xem được báo cáo dạng Gist, bạn cần thêm đoạn mã “?gist=
” vào URL của Viewer. Trong đó, này là ID của Gist..
Các tiêu chuẩn audits của Lighthouse
Khi kiểm tra những website đang, bạn có thể thực hiện qua localhost hoặc private server rất nhanh chóng. Các yếu tố tiêu chuẩn này bao gồm:
Google Lighthouse – Performance là gì?
Performance ( hay hiệu suất của website ) phụ thuộc vào vào rất nhiều yếu tố. Để được Lighthouse nhìn nhận cao, bạn cần tăng vận tốc web, Optimize images, minify CSS / Js, … Song, tăng thưởng thức người dùng là yếu tố quan trọng nhất .
Performance được Lighthouse đánh giá có độ chính xác cao
Google Lighthouse – Progressive Web App
Progressive Web App đang trở thành một trong những tiêu chuẩn bắt buộc của tương lai. Bởi vậy, dù hiện tại nếu bạn chưa có nguồn lực, hoàn toàn có thể bỏ lỡ quy trình này. Tuy nhiên, một số mục bắt buộc cần làm như :
- Sử dụng HTTPS cho web .
- Chuyển hướng traffic HTTP qua HTTPS
- Nội dung tương thích và gói gọn trong tầm nhìn của website .
- Cần có thẻ “”và tương hỗ biến hóaWidthvàScale
- Gặp lỗi Javascript sẽ trả về nội dung không thiếu .
👉👉👉Tìm hiểu thêm về: Khóa học SEO chuyên sâu – Trung tâm đào tạo SEO FPT Skillking
Lighthouse thêm Progressive Web App vào việc khảo sát
Google Lighthouse – Accessibility
Đây là tính năng sẽ giúp bạn biết web của mình đã được tối ưu truy vấn thế nào. Ngoài ra, chúng sẽ cho bạn biết web đang có yếu tố cần cải tổ như : độ tương phản kém, cỡ chữ nhỏ …
Lighthouse giúp đánh giá điểm của Accessibility
Google Lighthouse – Best Practices
Best Practices yêu cầu một số tiêu chuẩn để website có thể đạt được chất lượng tốt. Vẫn sử dụng thang điểm 100, khi đạt mốc này, website của bạn sẽ có ưu thế rất lớn.
Tiêu chuẩn đánh giá của Lighthouse đối với Best Practices
Google Lighthouse – Đánh giá SEO
Đây là mục yêu cầu bạn tối ưu tốt về SEO với các yếu tố chính về thẻ meta description, từ khóa trên tiêu đề, giản lược code, internal link và external link,…
Google Lighthouse – Đánh giá SEO
Các tính năng mới nhất của Google Lighthouse 3.0
Lighthouse 3.0 là phiên bản mới nhất của Google. Công cụ này giúp bạn kiểm tra, nghiên cứu và phân tích, nhanh và cho những sai số ít hơn rất nhiều. Bên cạnh đó, chúng luôn được update những tính năng mới. Dưới đây là một số ít thông tin đáng chú ý quan tâm về công cụ Lighthouse 3.0 :
- Cho hiệu quả kiểm tra nhanh hơn, độ đúng mực cao hơn, sai số nhỏ .
- Giao diện mới, đơn thuần, thân thiện .
- Phiên bản Node của Lighthouse 3.0 có thích hợp thông số kỹ thuật phong phú, tương tự như CLI .
Kết quả sau khi báo cáo có thể xuất ra file CSV tiện lợi.
- Bổ sung Audit mới : First Contentful Paint( báo cáo giải trình thời hạn người dùng thấy phản hồi tiên phong từ web ), thay thế sửa chữa file Gif bằng video, có thêm Animated content, …
Các tính năng mới nhất của Google Lighthouse 3.0
Trên đây là toàn bộ thông tin về Google Lighthouse mà FPT Skillking tổng hợp và chia sẻ với bạn. Mong rằng qua bài viết, các bạn sẽ áp dụng và xây dựng, tối ưu hiệu quả hơn cho website của mình. Đừng quên truy cập website của Skillking để cập nhật những kiến thức hữu ích nhất về SEO và Digital Marketing.
Source: https://mindovermetal.org
Category: Wiki công nghệ
