Google Lighthouse là công cụ mã nguồn mở giúp kiểm tra, cải thiện chất lượng website hàng đầu được phát triển bởi Google. Để sử dụng Lighthouse một cách hiệu quả, người dùng phải nắm được tiêu chí đánh giá cùng quy trình ứng dụng đa dạng các nền tảng.
Vậy Google Lighthouse là gì? Cùng Tech-One tìm hiểu cách dùng Lighthouse tối ưu website trong bài viết này nhé!
Google Lighthouse là gì? Cách thức hoạt động như thế nào?
Google Lighthouse được sử dụng trong việc phân tích, đo lường, kiểm tra hiệu suất và cải thiện chất lượng trang web. Công cụ Lighthouse có thể sử dụng được đối với mọi loại trang web khác nhau, không phân biệt website công khai hay yêu cầu xác thực.
Google Lighthouse giúp các nhà quản trị website có thể kiểm tra trang web của mình một cách toàn diện thông qua một loạt các tiêu chí khác nhau. Ngoài việc cung cấp các tính năng phân tích, đánh giá, Google Lighthouse còn đưa ra những lời khuyên hữu ích dành cho mỗi trang web, giúp cải thiện và nâng cao chất lượng.
Google Lighthouse mang lại lợi ích gì?
Lợi ích lớn nhất của Google Lighthouse là góp phần xây dựng, cải thiện hiệu suất trang web thông qua việc đưa ra hướng dẫn khắc phục sự cố dành cho nhà quản trị. Từ đó đưa website lên thứ hạng tốt hơn trên Google.
Ngoài ra, còn có một số lợi ích khác khiến cho Google Lighthouse trở thành một thành phần không thể thiếu trong quy trình kiểm tra website. Cụ thể như sau:
- Trong quá trình kiểm tra, Lighthouse sẽ xác định và cung cấp cho người dùng những vấn đề cần khắc phục để cải thiện hiệu suất trang web. Các báo cáo sẽ được trỏ đến phân đoạn cụ thể hay những dòng mã cần được cải thiện.
- Các tính năng kiểm tra hiệu suất website của Lighthouse được đảm bảo chính xác và được Google cập nhật, làm mới liên tục
- Dễ dàng, đơn giản và thuận tiện. Lighthouse sẽ giúp bạn kiểm tra trang web chỉ trong tích tắc.
>>>Đọc thêm: Cách sử dụng công cụ Google Analytics từ A-Z dễ hiểu cho người bắt đầu.
Phân biệt sự khác nhau giữa PageSpeed Insights và Google Lighthouse
Ngoài Google Lighthouse, Google PageSpeed Insight cũng là một công cụ đưa ra những đánh giá nhằm tối ưu hóa hiệu suất cho trang web của bạn. Vậy phân biệt Google PageSpeed Insight và Google Lighthouse như thế nào?
Hai công cụ này được phân biệt bởi những báo cáo mà chính chúng kiểm tra và trả lại. Công cụ PageSpeed Insight chỉ trả về báo cáo hiệu suất của trang web mà bạn đang quản trị. Trong khi đó, Lighthouse lại có khả năng trả về cho nhà quản trị nhiều báo cáo hơn, phân loại theo các tiêu chí khác nhau.
Dựa vào điểm khác biệt trên, Google Lighthouse vẫn là công cụ tối ưu nhất trong việc đánh giá toàn diện trang web của các nhà quản trị.
Nếu bạn cũng đang tìm hiểu về cách tối ưu tốc độ load cho website thì đừng bỏ qua bài viết Google Pagespeed Insights là gì? Quan trọng như thế nào trong SEO? tại đây nhé!
Hướng dẫn sử dụng Google Lighthouse trên các nền tảng
Google Lighthouse có thể ứng dụng trên nhiều nền tảng. Tuy nhiên tại mỗi nền tảng lại có cách sử dụng khác nhau. Tech-One sẽ hướng dẫn các bạn sử dụng một cách đơn giản nhất.
Sử dụng Lighthouse bằng Chrome DevTools
Để sử dụng Google Lighthouse để kiểm tra, đo lường trang web bằng Chrome DevTools, nhà quản trị cần thực hiện một số bước sau:
- Bước 1: Sử dụng trình duyệt Google Chrome để truy cập trang web mà bạn muốn tiến hành kiểm tra.
- Bước 2: Để mở Developer Tools sử dụng tổ hợp phím Ctrl – Shift – T hoặc nhấn vào phím F12. Tiếp tục chọn tab Audits.
- Bước 3: Để hiển thị danh sách các danh mục Audits, hãy chọn Perform an audit DevTools.
- Bước 4: Bạn muốn phân tích mục nào thì đánh dấu tick. Nếu muốn báo cáo hoàn chỉnh thì hãy chọn tất cả các mục hiển thị.
- Bước 5: Bấm chọn nút Run audit. Kết quả phân tích sẽ được tự động hiển thị sau 60 đến 90 giây chờ đợi.
Dùng Lighthouse bằng Node Command line tool
Sử dụng công cụ Google Lighthouse bằng Node Command line tool, thông qua các thao tác như sau:
- Bước 1: Tải trình duyệt Google Chrome dành cho Desktop.
- Bước 2: Cài đặt Long – Term Support của Node phiên bản mới nhất.
- Bước 3: Sử dụng lệnh “npm install -g lighthouse” để cài đặt Lighthouse.
- Bước 4: Tiếp tục sử dụng lệnh “lighthouse <url” để tạo Audits.
- Bước 5: Sau khi đã hiển thị tùy chọn Audit, gõ “lighthouse -help” để sử dụng công cụ.
Lighthouse Extension
Các bước để sử dụng Lighthouse Extension:
- Bước 1: Tìm Lighthouse Chrome Extension trên Chrome Webstore. Sau đó chọn Add to Chrome để hoàn thành việc cài đặt Google Lighthouse vào máy.
- Bước 2: Truy cập vào trang web mà bạn đang muốn kiểm tra.
- Bước 3: Trên góc phải của thanh Chrome Address bar, hãy chọn Extension Lighthouse. Trong trường hợp không có ký hiệu Extension Lighthouse, chỉ cần vào menu của Chrome để hoàn thiện quá trình kích hoạt Extension.
- Bước 4: Click vào Generate report để kích hoạt Lighthouse kiểm tra website. Sau đó kết quả sẽ được trả lại một cách nhanh chóng.
Chia sẻ cách xem báo cáo Lighthouse trực tuyến
Google Lighthouse hỗ trợ tính năng chia sẻ và xem báo cáo trực tuyến bằng hai dạng khác nhau. Người sử dụng có thể lựa chọn phương tiện phù hợp với mình nhất.
JSON
Để phục vụ cho tính năng chia sẻ báo cáo, công cụ Lighthouse Viewer cần sử dụng JSON output. Tùy thuộc vào Workflow mà bạn đang sử dụng để thực hiện theo các hướng sau đây:
- Trường hợp bạn sử dụng Lighthouse trong Chrome DevTools, chỉ cần chọn nút Download Report để tải báo cáo và thực hiện chia sẻ.
- Còn nếu bạn sử dụng Lighthouse Google trong Command line, hãy chạy code “lighthouse -output json -output-path <path/for/output.json>”.
- Khi dùng bản Lighthouse Extension, chúng ta chỉ cần click vào Export và chọn Save as JSON.
Để xem được các dữ liệu phân tích, chúng ta thực hiện thao tác mở Lighthouse Viewer trong Google Chrome. Để báo cáo được hiển thị, tiếp dục kéo file JSON và trang Viewer.
Ngoài ra, bạn có thể sử dụng cách click chuột vào bất cứ vị trí nào trên trang. Một cửa sổ mới sẽ hiện ra và bạn hãy chọn file JSON mà mình muốn xem.
GitHub Gists
Khi muốn xem báo cáo thống kê, phân tích trang web dưới dạng GitHub Gists bí mật, chúng ta cần làm các bước như hướng dẫn sau:
- Bước 1: Click Export và chọn Open In Viewer để mở báo cáo trong trang Viewer.
- Bước 2: Tiếp tục chọn Share trong Viewer. Khi đó màn hình sẽ hiển thị cửa sổ và yêu cầu truy cập vào Github để xem, đồng thời lưu trữ dữ liệu.
- Bước 3: Thực hiện tạo tác copy – paste từ file JSON output vào Gist. Mục đích là để có được file báo cáo Gist từ phiên bản CLI của Google Lighthouse.
- Bước 4: Sử dụng đoạn mã “?gist=<ID>” vào trong URL của Viewer để xem được báo cáo Gist. Lưu ý <ID> là ID của Gist.
Các chỉ số đo lường trong Lighthouse
Khi sử dụng Google Lighthouse, nhà quản trị có thể kiểm tra và đánh giá website thông qua các chỉ số đo lường dưới đây.
Hiệu suất website – Performance
Chỉ số hiệu suất của trang web phụ thuộc vào nhiều yếu tố khác nhau bao gồm cả back-end đến front-end. Để nhận được đánh giá cao của Google Lighthouse, nhà quản trị cần chú ý một số yếu tố như: Optimize Images, minify Css/Js và tăng tốc độ web thông qua lazy loading.
Điều quan trọng nhất vẫn là cải thiện trải nghiệm của người dùng. Để đạt điểm hiệu suất trang web cao hơn mà phải hy sinh các yếu tố nâng cao trải nghiệm thì đây là điều không cần thiết. Các nhà quản trị web cần lưu ý mức đánh giá được chấp nhận ở mục performance lighthouse là 75 điểm.
Khả năng truy cập – Accessibility
Accessibility là gì? Chỉ số này cho thấy việc tối ưu khả năng truy cập của trang web, đánh giá theo khung điểm cụ thể để người sử dụng biết cần phải cải thiện những gì. Trong khi thực hiện sẽ kiểm tra các nút và các liên kết, xác nhận mô tả đã đầy đủ chưa, hình ảnh chính xác với thuộc tính hay không.
Best Practices – Tiêu chuẩn bắt buộc
Best practices lighthouse tập trung vào các khía cạnh bảo mật và tiêu chuẩn phát triển web. Đồng thời phân tích phiên bản đang áp dụng là HTTPS hay HTTP. Những lỗ hổng trong JavaScript cũng sẽ được phát hiện thông qua quá trình kiểm tra nguồn.
SEO – Tối ưu hóa khả năng SEO
Công cụ Google Lighthouse sẽ chạy thử nghiệm để phân tích điểm số của trang web một cách liên tục. Từ đó giúp nhà quản bị biết được cơ hội trang web được Index và hiển thị trong SERP cao hay thấp.
Progressive Web App – Tiêu chuẩn cần cải thiện trong tương lai
Progressive web app là gì? Đây là một trong những kỹ thuật mang đến cho người dùng trải nghiệm tốt hơn trên các trang web của bạn. Ngoài việc tăng đường UX, nó còn cung cấp nhiều tính năng như:
- Khả năng hoạt động ngoại tuyến.
- Đẩy thông báo, cập nhật lỗi cho người sử dụng.
- Độ lưu trữ cục bộ tài nguyên.
Nhờ vào các tiêu chuẩn này, nhà quản trị sẽ biết được những lỗi trong progressive web app lighthouse và tiến hành cải thiện.
Tính năng mới trong Google Lighthouse v9.6.7
Google Lighthouse V9.6.7 là phiên bản mới nhất của Google, với các tính năng mới cải tiến hơn so với các phiên bản trước đó. Một số thông tin của Google Lighthouse V9.6.7 đáng chú ý như sau:
- Kết quả nhanh chóng, độ chính xác cao với sai số nhỏ.
- Giao diện hoàn toàn mới, đơn giản và thân thiện.
- Tương thích với đa dạng cấu hình.
- Bổ sung thêm các Audits mới.
Trên đây là thông tin chi tiết về Google Lighthouse. Hy vọng từ những chia sẻ này, các bạn sẽ hiểu rõ hơn Google Lighthouse là gì và cách dùng Lighthouse hiệu quả. Nếu bạn đang tìm hiểu về marketing kỹ thuật số nói chung và SEO nói riêng, truy cập ngay Blog của Tech-One để đọc thêm nhiều thông tin hữu ích nhé!
Khám phá thêm nhiều tính năng hữu ích của Google qua bài viết sau đây:
