Caia

Một trang web mới sử dụng WordPress

Công ty cổ phần Công nghệ & Truyền thông CAIA

Web Marketing hiệu quả thật

ico-call

Gọi ngay cho chúng tôi 0246 2938 929

  • Trang chủ
  • Giới thiệu
  • Dịch vụ
    • SEO tổng thể
    • Thiết kế Web chuẩn SEO
    • Quảng cáo Google Adwords
    • Quảng cáo Facebook
    • Báo giá HOSTING – VPS
    • Báo giá tên miền và SSL
  • Marketing 360
    • Kiến thức Seo
    • Kiến thức Marketing
    • Online Marketing
    • Thiết kế website
  • Kho giao diện
  • Khách hàng
  • Tin tức
  • Liên hệ

Bài viết nổi bật

Trang chủ / Bài viết nổi bật / Hiểu đúng về Page Speed Insights và vai trò của nó cho SEO

Hiểu đúng về Page Speed Insights và vai trò của nó cho SEO

Trong lần cập nhật tháng 6/2021, Google chính thức đưa các chỉ số về trải nghiệm người dùng Web, Core Web Vitals, vào đánh giá thứ hạng Website. Và các Marketer có thể đo lường được chỉ số trải nghiệm người dùng Web thông qua công cụ của Google, là Google Page Speed Insights. Trong bài viết này, Caia xin chia sẻ hiểu biết của mình Page Speed dưới góc độ của một người vừa có kinh nghiệm về SEO, vừa có kinh nghiệm về lập trình Website.

Mục lục

  • 1. Page Speed là gì và ý nghĩa các chỉ số?
    • a. Chỉ số của toàn bộ các trang thuộc Website
    • b. Chỉ số của trang có url điền vào ô kiểm tra
    • c. Các gợi ý tối ưu tốc độ cho trang tương ứng với url bạn điền vào
  • 3. Những hiểu lầm phổ biến về Page Speed
    • a. Điểm cao hơn đồng nghĩa trải nghiệm người dùng tốt hơn
    • b. Tối ưu để điểm cao hơn, chứ không hướng tới trải nghiệm người dùng tốt hơn
    • c. Nhầm lẫn chỉ số của trang với chỉ số thống kê tổng thể của toàn bộ các trang của Website
    • d. Các đề xuất tối ưu của Page Speed đều nhất thiết phải đạt
  • 4. Cách đo tốc độ một trang của Website thực tế từ trình duyệt
  • 5. Nguyên lý tối ưu tốc độ Website phổ biến
  • 6. Thực nghiệm đo lường cụ thể tối ưu tốc độ Website
  • 7. Lựa chọn tối ưu của Caia

1. Page Speed là gì và ý nghĩa các chỉ số?

Google Page Speed Insights (PSI) là một công cụ của Google, cung cấp các chỉ số liên quan tới tốc độ và trải nghiệm người dùng với một trang Web cụ thể. Và Page Speed là các chỉ số về tốc độ và trải nghiệm người dùng mà công cụ trên cung cấp.

Tuy PSI cung cấp rất nhiều chỉ số, nhưng ở đây chúng ta chỉ quan tâm tới các chỉ số Core Web Vitals mà Google đề cập trong cập nhật thuật toán 6/2021 (1,2), gồm 3 chỉ số:

– LCP (Largest Contentful Paint): Là thời gian để trình duyệt hiển thị phần tử nội dung lớn nhất trong khung nhìn, tính từ khi người dùng yêu cầu URL. Phần tử lớn nhất thường là hình ảnh hoặc video hoặc có thể là phần tử văn bản cấp khối lớn. Chỉ số này rất quan trọng vì nó cho người đọc biết rằng URL đang thực sự tải.

– FID (First Input Delay): Là thời gian phản hồi lần tương tác đầu tiên, tính từ khi người dùng tương tác lần đầu với trang của bạn (khi họ nhấp vào một đường liên kết, nhấn vào một nút, v.v.) đến thời điểm mà trình duyệt thực sự có thể phản hồi với hành động tương tác đó. Kết quả đo này được lấy từ bất kỳ phần tử nào có thể phản hồi khi người dùng nhấp vào lần đầu. Chỉ số này rất quan trọng trên những trang mà người dùng cần phải thực hiện một thao tác nào đó, bởi vì chỉ số này cho biết thời điểm mà trang bắt đầu tương tác được với người dùng.

– CLS (Cumulative Layout Shift): Là điểm số tổng hợp về mức thay đổi bố cục, được đo lường tổng của tất cả điểm số riêng lẻ về thay đổi bố cục cho mọi lần thay đổi bố cục không mong muốn xảy ra trong toàn bộ thời gian hoạt động của trang. Điểm số có giá trị từ 0 trở lên, trong đó: 0 có nghĩa là trang không thay đổi bố cục và giá trị càng lớn có nghĩa là bố cục thay đổi càng nhiều. Điểm số này rất quan trọng vì trình trạng các phần tử trang thay đổi trong khi người dùng đang cố gắng tương tác với trang là một trải nghiệm không tốt.

Khi bạn điền 1 url website vào PSI, và tiến hành chạy phân tích, thì PSI hiện kết quả ra làm 3 nhóm:

a. Chỉ số của toàn bộ các trang thuộc Website
1. Page Speed là gì và ý nghĩa các chỉ số? 1

Đánh giá chỉ số của Website, bạn nên nhìn ở chỉ số này, thay vì chỉ nhìn vào chỉ số của Url được điền.

b. Chỉ số của trang có url điền vào ô kiểm tra
1. Page Speed là gì và ý nghĩa các chỉ số? 21. Page Speed là gì và ý nghĩa các chỉ số? 3

Chú ý, các chỉ số của Url hiện tại chịu phụ thuộc vào tốc độ Internet, tải hiện tại của máy chủ. Nên mỗi lần chạy có thể sẽ ra kết quả khác nhau, bởi vậy bạn nên chạy thử 2-3 lần rồi hãy nhận định kết quả.

c. Các gợi ý tối ưu tốc độ cho trang tương ứng với url bạn điền vào

c. Các gợi ý tối ưu tốc độ cho trang tương ứng với url bạn điền vào 1

 

3. Những hiểu lầm phổ biến về Page Speed

Với cập nhật 06/2021 của Google, thì việc tối ưu các chỉ số Page Speed lại càng trở lên quan trọng, khiến nhiều bên muốn tìm cách để Website của mình có chỉ số Page Speed tốt nhất có thể. Tuy vậy, nếu không hiểu đúng thì cách làm này chưa chắc đã có lợi mà thậm trí có hại với Website. Dưới đây, chúng tôi chia sẻ lại một số hiểu nhầm hay gặp.

a. Điểm cao hơn đồng nghĩa trải nghiệm người dùng tốt hơn

Sau nhiều thử nghiệm, có đo lường cụ thể, Caia nhận thấy rằng với cùng 1 Url, điểm Page Speed cao hơn không đồng nghĩa với trải nghiệm người dùng tốt hơn, thậm trí cũng không đồng nghĩa với tốc độ lướt Web nhanh hơn. Chúng tôi cũng chia sẻ lại thực nghiệm của mình với số liệu cụ thể ở mục 6 bài viết này.

b. Tối ưu để điểm cao hơn, chứ không hướng tới trải nghiệm người dùng tốt hơn

Mục đích của cập nhật mới của Google là muốn khuyến khích các SEOer hãy chú ý thêm cả trải nghiệm người dùng Website, và họ định nghĩa ra những chỉ số cụ thể để định hướng cho SEOer tối ưu. Còn thực tế thì Google đo lường trải nghiệm người dùng thật dựa trên dữ liệu lướt Web từ trình duyệt Chrome gửi về chứ không phải từ dữ liệu của PSI gửi về.

Ở mục 4, chúng tôi sẽ giới thiệu cách mà một lập trình viên đánh giá tốc độ thực của Website, dựa trên số liêu đo lường trực tiếp từ trình duyệt.

c. Nhầm lẫn chỉ số của trang với chỉ số thống kê tổng thể của toàn bộ các trang của Website

Khi bạn hiểu ý nghĩa của các phần kết quả do PSI trả về, thì bạn sẽ thấy mục tiêu chỉ số của toàn Website quan trọng hơn rất nhiều việc tối ưu điểm, hay chỉ số của 1 Url cụ thể trên Website đó.

Nhưng phần lớn, mọi người lại chỉ để ý tới chỉ số điểm Page Speed của cái Url đang phân tích, tìm cách để có 80 hay 90 điểm, vậy bạn không quan tâm tới các Url khác của Website à?

Điểm số của 1 Url không thể đại diện cho đánh giá tốc độ của 1 Website vốn có hàng trăm Url. Vì vậy, hãy tập trung tối ưu 3 chỉ số Core Web Vital (LCP, FID, CLS) của toàn bộ Website thay vì chỉ tối ưu điểm ở mỗi trang chủ thôi.

d. Các đề xuất tối ưu của Page Speed đều nhất thiết phải đạt

Tại giao diện phân tích trả về, PSI có gợi ý những chỉnh sửa “có thể” giúp tốc độ web cao hơn, và điểm Page Speed của Url đó cao hơn. Nhưng đây chỉ là gợi ý, nó không đồng nghĩa với việc Website của bạn nhất thiết phải đáp ứng tất cả các gợi ý đó, và cũng không đồng nghĩa rằng nếu bạn đáp ứng hết các yếu tố kĩ thuật đó, thì trải nghiệm người dùng sẽ tăng lên.

Chính bản thân PSI cũng nói trước ở phần gợi ý rằng, đó chỉ là các gợi ý có thể sẽ giúp tốc độ cao hơn, chứ không đảm bảo là đáp ứng hết các gợi ý đó thì tốc độ sẽ cao lên. Bởi thực tế là, có những “gợi ý” tốn rất nhiều công sức để triển khai, trong khi hiệu quả thì lại chẳng đáng là bao, thậm trí có khi phản tác dụng.

4. Cách đo tốc độ một trang của Website thực tế từ trình duyệt

Với một người am hiểu về lập trình Website, thì họ dựa và các thông số đo lường thực tế của trình duyệt (Chrome, Firefox) để đánh giá và so sánh kết quả tối ưu tốc độ.

Với Firefox và Chrome, bạn mở Url cần kiểm tra > ấn F12 > Network + All + Disable cache > sau đó ấn Ctrl+F5 vài lần để nhìn các chỉ số đo lường về load Web, các chỉ số này có thể thay đổi mỗi lần bạn ấn Ctrl+F5.

4. Cách đo tốc độ một trang của Website thực tế từ trình duyệt 1

D­ưới đây là ý nghĩa các chỉ số mà trình duyệt trả về khi mở 1 Url, bạn chú ý các phần được tô vàng:

  • Requests: Là số lần trình duyệt phải request lên Internet để lấy các dữ liệu (file html, hình ảnh, css, js, …) giúp hiển thị được url.
  • Transferred: Là dung lượng dữ liệu được tải về để hiển thị Url, hiện 2 chỉ số (1.31Mb/814Kb), vì dữ liệu được truyền trên Internet được nén trước khi gửi, 1.31Mb là dung lượng dữ liệu nhận về sau giải nén, và 841Kb là  dung lượng dữ liệu thực tế truyền về qua Internet.
  • Finished: Là thời gian để kết thúc toàn bộ quá trình tải về và dựng nội dung trên trình duyệt sau khi bạn gửi yêu cầu mở Url. Sau khi trang được tải xong hết, nếu bạn có thao tác gì với Website thì sẽ tiếp tục có dữ liệu mới được tải về, và chỉ số Finished này sẽ lại tăng lên sau thao tác đó.
  • DOMContentLoaded: Là thời gian để trang html chính của Url được tải về, và được trình duyệt phân tích xong.
  • Load: Là thời gian để giao diện đã load đầy đủ các khung hình, text và hình ảnh, và đã sẵn sàng nhận tương tác của người đọc (3).
Trong tất cả các chỉ số này, thì chỉ số Load là ảnh hưởng trực quan nhất tới trải nghiệm tốc độ Website của người đùng, các chỉ số khác cơ bản người dùng không cảm nhận được. Nên trong các tối ưu, sẽ tập trung để tối ưu chỉ số Load này.

5. Nguyên lý tối ưu tốc độ Website phổ biến

Mục tiêu: Giảm thời gian Load nhưng không làm giảm trải nghiệm người dùng.

Phương pháp tối ưu: là các phương pháp tối ưu lập trình, và tối ưu máy chủ nhằm giảm Requests, Transferred và DOMContentLoaded nhưng không làm giảm trải nghiệm người dùng là ok. Việc giảm Requests, Transferred và DOMContentLoaded đều gián tiếp giảm chỉ số Load. Sẵn sàng chấp nhận chỉ số Finished tăng lên.

6. Thực nghiệm đo lường cụ thể tối ưu tốc độ Website

Để thực nghiệm đo lường cụ thể, chúng tôi đã tạo ra 5 biến thể khác nhau của trang chủ website https://caia.vn, mỗi biến thể áp dụng các mức tối ưu khác nhau (trang chủ Caia vốn từ đầu không cài đặt Google Tag Manager, nên chúng tôi ko đề cập script này ở đây):

Site Áp dụng những tối ưu
caia.vn/t/begin/ Không áp dụng tối ưu HTML, CSS và JS nào
caia.vn/t/opti/ Áp dụng tối ưu Minify HTML, Inline Main Css, lazyload Img, và chuyển JS xuống footer
caia.vn/t/opti-delay/ Áp dụng tối ưu Minify HTML, Inline Main Css, lazyload Img, chuyển JS xuống footer, và delay 2s các JS ngoại trừ LazyimgJs, GA, FB Pixel.
caia.vn/t/opti-delay-fb/ Áp dụng tối ưu Minify HTML, Inline Main Css, lazyload Img, chuyển JS xuống footer, và delay 2s các JS ngoại trừ LazyimgJs, GA.
caia.vn/t/opti-delay-all/ Áp dụng tối ưu Minify HTML, Inline Main Css, lazyload Img, chuyển JS xuống footer, và delay 2s với tất cả các JS.

 

Và dưới đây là đo lường từng thông số về tốc độ và trải nghiệm người dùng ở 5 trang nói trên sử dụng Firefox, lấy chỉ số của Mobile Site (vì tối ưu Page Speed cho Mobile khó hơn PC):

Site Mobile Điểm Page Speed FCP LCP CLS Requests Transferred Finished DOMDocumentLoad Load
begin 52 3.0s 5.8s 0.186 110 3.12MB/1.87MB 4.74s 606ms 2.44s
opti 54 1.1s 5.6s 0.242 65 1.08MB/588KB 2.77s 446ms 1.71s
opti-delay 75 1s 4.8s 0.233 61 1.09MB/576KB 3.86s 328ms 1.41s
opti-delay-fb 78 1s 4.4s 0.137 61 1.10MB/588KB 4.70s 372ms 1.15s
opti-delay-all 97 1.1s 2s 0.048 10 595KB/176KB 5.02s 341ms 0.76s

 

Nhìn vào bảng thống kê các chỉ số này, với opti-delay-all, áp dụng tất cả các tối ưu tốc độ và delay 2s toàn bộ các script, thì điểm Page Speed (đạt 97) và thời gian Load site (0.76s) đạt chỉ số rất ấn tượng, nhưng chúng ta cùng xem cái giá phải trả cho các chỉ số đẹp đó là gì:

  • Tất cả các đo lường truy cập của GA, FB bị chậm 2s.
  • GA và FB không đếm truy cập của các User mở site có thời gian dưới 2s.
  • Trình duyệt báo Website đạt trạng thái load (tức sẵn sàng nhận tương tác) trước khi các ảnh ở khung nhìn đầu tiên được load, vì sau 2s đầu thì ảnh mới được load. Bạn xem hình ảnh so sánh dưới đây.
Mobile Site /opti-delay-all/ Mobile Site còn lại
6. Thực nghiệm đo lường cụ thể tối ưu tốc độ Website 1 Ở trạng thái Load xong (đã sẵn sàng nhận tương tác), các hình ảnh chưa được load, do script LazyImgJs bị delay 2s. Và sau 2s thì các hình ảnh mới được load. 6. Thực nghiệm đo lường cụ thể tối ưu tốc độ Website 2

Ở trạng thái Load xong, các hình ảnh ở khung nhìn đầu tiên đã được load đầy đủ.

7. Lựa chọn tối ưu của Caia

Dưới góc độ trải nghiệm người dùng, và Marketer thì cái giá phải trả cho điểm PageSpeed (97) và thời gian load xong (0.76s) là quá lớn, như vậy chúng tôi không lựa chọn dạng tối ưu cho điểm số tốt nhất là opti-delay-all và chúng tôi sẽ lựa chọn 1 trong 2 tối ưu sau để tối ưu Web của mình:

  • Chọn opti-delay: Nếu Marketer quan trọng cả FB Pixel và GA.
  • Chọn opti-delay-fb: Nếu Marketer chỉ quan trọng GA, và việc FB Pixel chậm, thiếu với truy cập dưới 2s không vấn đề gì.

Qua những chia sẻ, và thống kê thực tế trên đây, Caia hi vọng bạn sẽ hiểu đúng hơn về các chỉ số Page Speed và có lựa chọn đúng đắn hơn đối với Website của mình.

Tham khảo:

  • https://developers.google.com/search/docs/advanced/experience/page-experience
  • https://support.google.com/webmasters/answer/9205520?hl=vi
  • https://www.sitepoint.com/performance-auditing-a-firefox-developer-tools-deep-dive/
Chia sẻ

Nguyễn Minh Tuấn

Hiểu đúng về Page Speed Insights và vai trò của nó cho SEO

TuanNM (Nguyễn Minh Tuấn), hiện là CEO & Co-Founder của CAIA. Với trên 10 năm nghiên cứu về Search Engine và các nền tảng xây dựng Website. Ở đây mình sẽ chia sẻ những bài viết kiến thức về SEO, tối ưu website có tính chuyên môn cao, thiên nhiều về kỹ thuật.

Bài viết liên quan

  • Lợi thế của website được thiết kế bởi CAIA

  • 5 Lợi ích quan trọng của dịch vụ SEO tổng thể

  • 5 sự hiểu nhầm hoang tưởng về SEO

  • 5 điều cần tránh trong khi làm SEO

  • Chọn tên miền theo từ khóa hay theo thương hiệu

Ý kiến của bạn Hủy

Bài viết đọc nhiều

SEO và Google Adwords nên chọn 1 hay cả 2 ?

SEO và Google Adwords nên chọn 1 hay cả 2 ?

Hướng dẫn cách đưa website lên top google nhanh nhất

Hướng dẫn cách đưa website lên top google nhanh nhất

Từ khóa SEO là gì? Tầm quan trọng và cách chọn hiệu quả?

Từ khóa SEO là gì? Tầm quan trọng và cách chọn hiệu quả?

5 Lợi ích quan trọng của dịch vụ SEO tổng thể

5 Lợi ích quan trọng của dịch vụ SEO tổng thể

Liên hệ với CAIA

Công ty cổ phần Công nghệ và Truyền thông CAIA được thành lập từ năm 2012 với một sứ mệnh chung duy nhất đó là: “Cung cấp giải pháp Web Marketing HIỆU QUẢ THẬT giành cho doanh nghiệp vừa và nhỏ”.

  • Đăng ký kinh doanh: Số 317, ngõ 281 Trần Khát Chân, Phường Thanh Nhàn, Quận Hai Bà Trưng, Thành phố Hà Nội, Việt Nam
  • Văn phòng giao dịch: Tầng 7, Số 391 Trường Chinh, Phường Khương Trung, Quận Thanh Xuân, Hà Nội
  • Mã số doanh nghiệp: 0106031431 do Sở Kế hoạch & Đầu Tư TP Hà Nội cấp lần đầu ngày 12/11/2012.
  • Điện thoại: 0246 2938 929
  • Email: sales@caia.vn

   

Chính sách
  • Điều khoản và điệu kiện
  • Chính sách chung
  • Chinh sách bảo mật
Đăng Ký Tư Vấn

Đăng ký tư vấn SEO

© Designed by caia.vn. All Rights Reserved.

  • Trang chủ
  • Giới thiệu
  • Dịch vụ
    • SEO tổng thể
    • Thiết kế Web chuẩn SEO
    • Quảng cáo Google Adwords
    • Quảng cáo Facebook
    • Báo giá HOSTING – VPS
    • Báo giá tên miền và SSL
  • Marketing 360
    • Kiến thức Seo
    • Kiến thức Marketing
    • Online Marketing
    • Thiết kế website
  • Kho giao diện
  • Khách hàng
  • Tin tức
  • Liên hệ
↑