Core Web Vitals: Chúng là gì & Cách cải thiện

​​​​​Core Web Vitals là gì?

Core Web Vitals của Google là tập hợp các chỉ số cho biết mức độ thân thiện với người dùng của một website dựa trên thời gian tải, sự ổn định hình ảnh và khả năng tương tác.

Các chỉ số Core Web Vitals của Google bao gồm:

• Largest Contentful Paint (LCP)Là chỉ số đo thời gian để phần nội dung lớn nhất trên trang được tải xong
• Cumulative Layout Shift (CLS)Là chỉ số đo mức độ thay đổi bố cục trang một cách bất ngờ trong quá trình tải, như hình ảnh hoặc nút bấm dịch chuyển.
• Interaction to Next Paint (INP)Là chỉ số đo thời gian từ khi người dùng bắt đầu tương tác đến khi cập nhật hình ảnh tiếp theo hiển thị.

Trang hoạt động tốt theo các chỉ số này sẽ mang lại trải nghiệm người dùng tốt hơn.

Trong bài viết này, chúng tôi sẽ giải thích mối quan hệ giữa Core Web Vitals và SEO, các ngưỡng khuyến nghị cho từng chỉ số, và cách kiểm tra hiệu suất trang web của bạn.

Sau đó, chúng tôi sẽ hướng dẫn bạn cách cải thiện điểm số.

Mẹo chuyên nghiệp

Bạn có thể kiểm tra Core Web Vitals của trang với công cụ SEO checker và nhận các gợi ý giúp cải thiện trải nghiệm người dùng.

Tại sao Core Web Vitals quan trọng?

Hiệu suất Core Web Vitals tốt đảm bảo trải nghiệm người dùng mượt mà, nhanh chóng và ổn định, đồng thời cải thiện SEO của bạn.

Người dùng có xu hướng ở lại (và có thể chuyển đổi thành khách hàng) trên trang hoạt động tốt và phản hồi nhanh. Đó là lý do các trang tải nhanh thường có tỷ lệ Bounce Rate thấp hơn.

Google cũng xem xét Core Web Vitals trong các yếu tố xếp hạng.

Vì vậy, tối ưu các chỉ số này có thể cải thiện hiệu suất trang trong bảng xếp hạng tìm kiếm và tăng traffic cho trang của bạn.

Ngưỡng khuyến nghị cho các chỉ số Core Web Vitals là gì?

Hãy xem Google khuyến nghị ngưỡng nào cho từng chỉ số:

Largest Contentful Paint

LCP phản ánh tốc độ người dùng có thể thấy nội dung trên trang, được đo bằng giây.

LCP tốt là 2,5 giây hoặc nhanh hơn. Điều này có nghĩa hình ảnh chính, video hoặc khối văn bản lớn tải gần như ngay lập tức khi người dùng truy cập trang.

LCP từ 2,6 đến 4 giây nghĩa là tốc độ trang cần cải thiện.

LCP trên 4 giây là kém, vì có thể khiến khách truy cập khó chịu và dễ rời trang.

Đọc thêm: Largest Contentful Paint (LCP): Nó là gì & Cách cải thiện

Cumulative Layout Shift

CLS cho biết mức độ các phần tử trên trang di chuyển bất ngờ trong khi trang đang tải. Chỉ số này được biểu thị dưới dạng điểm số.

Điểm CLS tốt là 0.1 hoặc thấp hơn, nghĩa là bố cục trang của bạn rất ổn định. Điều này giúp người dùng dễ dàng xem nội dung mà không bị gián đoạn.

Điểm CLS từ 0.1 đến 0.25 cho thấy sự ổn định hình ảnh của trang cần được cải thiện. Có sự dịch chuyển đủ lớn để người dùng nhận thấy.

Điểm CLS kém là trên 0.25, nghĩa là các phần tử trên trang di chuyển nhiều. Người dùng có thể thấy các nhảy lớn như văn bản hoặc nút bấm di chuyển bất ngờ, gây gián đoạn trải nghiệm.

Đọc thêm: CLS là gì? Cách đo và lý do cần đo

Interaction to Next Paint (INP)

INP là chỉ số Core Web Vitals mới nhất thay thế First Input Delay (FID) từ ngày 12 tháng 3 năm 2024. Nó thể hiện tốc độ phản hồi của trang với các tương tác và được đo bằng mili giây.

Cần lưu ý rằng INP đánh giá tốc độ phản hồi của trang trong suốt toàn bộ thời gian người dùng tương tác với trang đó.

FID chỉ đo thời gian phản hồi cho tương tác đầu tiên của người dùng với bất kỳ phần tử nào trên trang.

Vì vậy, nếu người dùng trên trang phóng to bản đồ, nhấn nút và mở accordion, INP tính thời gian từ lúc bắt đầu đến khi thay đổi hình ảnh xuất hiện cho tất cả các tương tác đóvà dựa trên tương tác mất thời gian lâu nhất để cung cấp cái nhìn chính xác hơn về độ phản hồi tổng thể của trang.

INP tốt là 200 mili giây hoặc thấp hơn.

INP từ 200 đến 500 mili giây cho thấy tính tương tác của trang cần cải thiện.

INP trên 500 mili giây phản ánh trải nghiệm tương tác kém cho người dùng. Điều này có nghĩa là có độ trễ và chậm trễ rõ ràng khi phản hồi hành động của người dùng.

Cách kiểm tra hiệu suất Core Web Vitals của trang bạn

Dưới đây là cách bạn có thể chạy kiểm tra Core Web Vitals với bốn công cụ khác nhau:

1. Semrush Site Audit

Công cụ Semrush Site Audit thực hiện kiểm tra kỹ thuật toàn diện cho trang của bạn và làm nổi bật các vấn đề có thể ảnh hưởng đến sức khỏe trang.

Để đo hiệu suất Core Web Vitals của bạn, mở Site Audit, nhập domain của bạn vào thanh tìm kiếm, và nhấn “Start Audit”Start Audit.”

Tiếp theo, bạn sẽ được yêu cầu tùy chỉnh cài đặt kiểm tra.

Ví dụ, nhấn vào phần “Crawler settings” để chọn công cụ sẽ phân tích phiên bản mobile hay desktop của trang.

Khi xong, nhấn “Start Site Audit.”

Khi kiểm tra hoàn tất, bạn sẽ thấy báo cáo “Overview” như hình dưới.

Dưới mục “Thematic Reports,” bạn sẽ thấy phần “Core Web Vitals”. Nhấn “View details” để xem đánh giá chi tiết.

Bạn sẽ thấy trạng thái các trang cùng với dữ liệu về hiệu suất lịch sử của chúng.

Kéo xuống phần “Metrics” để xem điểm LCP và CLS, cùng danh sách các đề xuất cải thiện.

Bạn cũng sẽ thấy một chỉ số gọi là Total Blocking Time (TBT), có thể dùng để đánh giá INP.

Nhấp vào một vấn đề trong cột “Top Improvements” để tìm hiểu cách khắc phục. Và chọn số ở cột “Affected Pages” tương ứng để xem danh sách đầy đủ các trang gặp vấn đề.

2. Chrome User Experience Report

Chrome User Experience Report (CrUX) là bộ dữ liệu công khai cung cấp cái nhìn về cách người dùng Chrome thực tế tương tác với các trang web.

Một trong những cách dễ nhất để truy cập CrUX là qua CrUX Dashboard dành cho Looker Studio.

Khi mở công cụ, nhập URL trang bạn muốn phân tích vào thanh tìm kiếm. Sau đó, nhấn “Go.”

Bạn sẽ thấy kết quả cho Core Web Vitals. Nhưng bạn cũng có thể xem thêm dữ liệu khác nếu muốn.

Trên bảng điều khiển, bạn sẽ thấy tóm tắt hiệu suất các trang cho từng Core Web Vital, cả trên thiết bị di động và desktop.

Hãy xem tóm tắt LCP làm ví dụ.

Bạn có thể thấy 85,51% trải nghiệm trên desktop được đánh giá tốt, và 63,1% trải nghiệm trên mobile cũng tốt.

Để phân tích chi tiết hơn, chọn báo cáo riêng cho chỉ số bạn muốn xem từ menu bên trái.

Ví dụ, hãy xem báo cáo “Largest Contentful Paint”.

Ở đây, bạn sẽ thấy phân tích chi tiết LCP của trang theo tháng.

Điều này giúp bạn hiểu cách chỉ số thay đổi theo thời gian, từ đó xác định các giai đoạn cải thiện hoặc suy giảm.

Lưu ý dữ liệu này thể hiện hiệu suất trên tất cả thiết bị. Bạn có thể chọn xem điểm chỉ dành cho mobile hoặc desktop bằng cách nhấn bộ lọc “Device” ở góc trên bên phải và chọn loại thiết bị.

3. Google PageSpeed Insights

Google PageSpeed Insights (PSI) là công cụ miễn phí đánh giá hiệu suất của một trang web trên cả thiết bị di động và desktop.

Nó cũng đưa ra các gợi ý giúp trang của bạn tải nhanh và dễ sử dụng hơn.

Để đo hiệu suất Core Web Vitals của một trang, mở PageSpeed Insights, nhập URL bạn muốn kiểm tra, rồi nhấn “Analyze.”

Khi báo cáo sẵn sàng, bạn sẽ thấy phân tích chi tiết hiệu suất qua nhiều chỉ số.

Có một điểm “Performance” từ 0 đến 100 dựa trên các chỉ số sau:

• First Contentful Paint
• Speed Index
• Largest Contentful Paint
• Total Blocking Time
• Cumulative Layout Shift

Kết quả Core Web Vitals của bạn sẽ trông như thế này:

Kéo xuống phần “Diagnostics” để xem danh sách các việc bạn có thể làm để cải thiện hiệu suất trang web của mình.

PSI cũng cung cấp cái nhìn về khả năng truy cập, hiệu suất SEO và việc tuân thủ các best practices của trang web bạn. Bạn chỉ cần kéo xuống để xem kết quả đó.

4. Báo cáo Core Web Vitals trong Google Search Console

Báo cáo “Core Web Vitals” trong Google Search Console (GSC) sử dụng dữ liệu thực tế để cho bạn hình dung chính xác cách người dùng trải nghiệm trang web của bạn.

Và GSC nhóm các trang trên site của bạn có vấn đề tương tự lại với nhau, giúp bạn dễ dàng nhận diện và xử lý các vấn đề chung trên toàn bộ trang.

Để sử dụng báo cáo này, đăng nhập vào GSCvà chọn “Core Web Vitals” trong menu.

Tại đây, bạn sẽ thấy tổng quan về số URL mà Google đánh giá là “Poor,” “Needs Improvement,” và “Good.”

Báo cáo có sẵn cho cả thiết bị di động và máy tính để bàn.

Để xem chi tiết hơn về hiệu suất trang, nhấp vào “Open Report” trong bất kỳ biểu đồ nào.

Sau khi mở báo cáo, bạn sẽ thấy biểu đồ thanh thể hiện số trang không đạt ngưỡng Core Web Vitals.

Để xem các vấn đề tồn tại và số trang bị ảnh hưởng cho từng vấn đề, kéo xuống phần “Why URLs aren't considered good.”

Nhấp vào một vấn đề để xem chi tiết hơn.

Bạn cần nhớ rằng báo cáo Core Web Vitals không nhằm giúp bạn kiểm tra trạng thái của một trang cụ thể. Thay vào đó, nó giúp bạn đánh giá sức khỏe tổng thể của trang web.

Cách cải thiện hiệu suất Core Web Vitals

Cải thiện điểm Core Web Vitals không hề khó khăn.

Hãy cùng xem qua một số bước bạn có thể tự làm hoặc nhờ developer hỗ trợ.

Cải thiện LCP

Nâng cao LCP có thể thực hiện bằng các thay đổi nhỏ hoặc lớn.

Một cách đơn giản nhất là tối ưu hình ảnh bằng cách nén và sử dụng định dạng ảnh thân thiện với web như WebP — vốn nhỏ hơn tới 34% về kích thước so với các định dạng truyền thống.

Bạn cũng có thể bật caching trang. Điều này cho phép trang được lưu trên server sau lần tải đầu tiên, giúp tải nhanh hơn trong những lần sau.

Một cách khác để cải thiện điểm LCP là nâng cấp hosting web.

Shared hosting (khi nhiều trang web cùng dùng chung một server) có thể chậm hơn vì mọi người chia sẻ tài nguyên như bộ nhớ và sức mạnh xử lý. Do đó, trang của bạn có thể bị chậm khi các trang khác tăng traffic đột biến.

Để khắc phục, bạn có thể nâng cấp lên gói hosting tốt hơn hoặc loại hosting khác như dedicated hosting (khi trang của bạn có server riêng) hoặc cloud hosting (khi nhiều server được dùng để đảm bảo hiệu suất ổn định hơn).

Cải thiện CLS

Các vấn đề với CLS thường xảy ra khi các phần tử như hình ảnh, banner hoặc quảng cáo không có kích thước đẩy nội dung khác xuống hoặc sang bên khi chúng tải.

Một trong những cách đơn giản nhất để cải thiện điểm CLS của bạn là thêm thuộc tính kích thước chiều rộng và chiều cao cho hình ảnh và video.

Bằng cách này, trình duyệt sẽ dành sẵn không gian cho các phần tử như hình ảnh hoặc video khi trang đang tải. Nhờ đó, mọi thứ vừa vặn và không bị di chuyển khi người dùng xem trang.

Ngoài ra, bạn có thể sử dụng aspect ratio boxes trong mã CSS của bạn. Lựa chọn thiết kế đáp ứng này hoạt động bằng cách tạo một vùng chứa cho nội dung giữ tỉ lệ chiều rộng và chiều cao không đổi trên mọi màn hình.

Loại font bạn sử dụng cũng có thể ảnh hưởng đến điểm CLS.

Tốt nhất là tránh dùng web fonts vì chúng cần được tải xuống trước khi trình duyệt có thể hiển thị. Hãy dùng các hệ thống font có sẵn trên hầu hết thiết bị như Arial, Helvetica và Verdana.

Nếu bạn dùng web fonts cho mục đích thương hiệu hoặc thiết kế, hãy giới hạn số lượng font và số nơi chúng xuất hiện.

Ví dụ, bạn có thể chọn chỉ một web font để dùng cho các tiêu đề và phần đặc biệt.

Cải thiện INP

Một trong những yếu tố chính làm giảm Interaction to Next Paint là nếu trang của bạn có nhiều script lớn hoặc quá nhiều mã JavaScript đang chạy.

JavaScript là ngôn ngữ lập trình dùng để tạo các tính năng động trên website như

menu, form và hiệu ứng hoạt hình. Nhưng mã JavaScript phức tạp hoặc quá nhiều có thể làm chậm phản hồi của website với hành động người dùng.

Nhà phát triển của bạn có thể cải thiện INP bằng cách giảm thiểu JavaScript và các mã không cần thiết khác.

Cũng nên chia nhỏ các tác vụ dài mà trình duyệt thực hiện ngầm làm cản trở tương tác người dùng.

Bằng cách chia các tác vụ này thành các đoạn ngắn hơn (nhà phát triển có thể làm điều này bằng cách trì hoãn thực thi mã), trình duyệt sẽ xử lý tương tác người dùng nhanh hơn.

Bạn có thể xác định các tác vụ dài trên trang bằng công cụ Site Audit .

Trong báo cáo “Core Web Vitals” của bạn, cuộn xuống phần “Analyzed Pages.” Và nhấp vào mũi tên thả xuống bên cạnh URL có điểm TBT thấp.

Kéo xuống phần TBT của báo cáo để xem danh sách các tác vụ dài nhất đang cản trở hiệu suất của trang đó.

Bạn cũng có thể nhận được các gợi ý sửa cụ thể bằng cách nhấp vào nút “How to Improve”.

Hãy chuyển thông tin này cho nhà phát triển để họ bắt đầu cải thiện hiệu suất INP cho bạn.

Đọc thêm: Các vấn đề phổ biến nhất của Core Web Vitals và cách khắc phục

Mẹo ưu tiên sửa lỗi Core Web Vitals

Chìa khóa để giải quyết thành công mọi vấn đề về Core Web Vitals là ưu tiên chúng. Nhờ đó, bạn có thể cải thiện dần hiệu suất trang mà không bị quá tải.

Dưới đây là một số gợi ý để bạn tham khảo khi xác định bước tiếp theo:

• Xem xét mức độ dễ dàng khi triển khai: Đôi khi, một vấn đề có thể sửa nhanh hơn vấn đề khác. Ví dụ, tối ưu hình ảnh để cải thiện LCP có thể đơn giản hơn việc điều chỉnh bố cục phức tạp để cải thiện CLS.
• Hãy nhớ mục đích của website bạn: Nếu bạn có một trang nhiều nội dung như blog hoặc trang tin tức, cải thiện LCP trước có thể mang lại tác động lớn hơn vì người dùng sẽ đánh giá cao nội dung tải nhanh nhất. Nhưng nếu bạn có một trang thương mại điện tử phụ thuộc nhiều vào tương tác người dùng, ưu tiên CLS trước có lẽ hợp lý hơn.
• Xem xét dữ liệu: Nếu một số trang tệ hơn hẳn các trang khác, bạn nên bắt đầu từ những trang đó. Bạn có thể dùng Site Audit để hỗ trợ. Trong báo cáo “Core Web Vitals”, kéo xuống phần “Analyzed Pages” để xem danh sách URL với trạng thái “Poor” và “To Improve”.

Nâng cao trải nghiệm người dùng trên trang của bạn

Hiệu suất Core Web Vitals của trang đóng vai trò lớn trong trải nghiệm người dùng.

Điểm số tốt có thể giúp giảm Bounce Rate, tăng tương tác và thậm chí nâng cao chuyển đổi. Chưa kể đến thứ hạng tìm kiếm cũng sẽ tốt hơn.

Và có nhiều công cụ giúp bạn đi đúng hướng.

Chẳng hạn như công cụ free SEO Checkercủa chúng tôi. Công cụ này cung cấp nhiều thông tin hơn chỉ số Core Web Vitals của bạn.