Khi chạy lại trang web, khả năng xem của quảng cáo tăng hơn 75%, tỷ lệ thoát giảm 50% và số lượt xem trang tăng 27%.
Khi Google công bố sáng kiến Các chỉ số quan trọng về trang web, nhà xuất bản ở Đức, Netznet, đã nhanh chóng nhận ra tiềm năng của các chỉ số mới này trong việc mang lại trải nghiệm chất lượng cao trên trang và cải thiện khả năng kiếm tiền dựa trên quảng cáo. Họ bắt đầu chạy lại trang web của mình, áp dụng các phương pháp hay nhất và phổ biến giúp nâng cao hiệu suất, đồng thời tối ưu hoá thẻ quảng cáo và vị trí đặt quảng cáo. Việc cam kết mang đến trải nghiệm người dùng chất lượng cao và các trang tải nhanh đã chứng minh đó là một cách để tối ưu hoá mức độ tương tác và doanh thu từ quảng cáo, với số lượt xem trang tăng 27%, khả năng xem quảng cáo tăng hơn 75% và doanh thu từ quảng cáo tăng 18%.
27%
Mức tăng số lượt xem trang
18%
Mức tăng doanh thu từ quảng cáo
75%
Khả năng xem quảng cáo
Thách thức
Giống như nhiều nhà xuất bản tin tức khác, Netflix gặp khó khăn trong việc tìm được điểm cân bằng hợp lý giữa việc tối ưu hoá trải nghiệm người dùng và tốc độ trang trong khi vẫn duy trì được doanh thu cao từ quảng cáo. Những thách thức chính mà họ gặp phải là:
- Điểm số tổng hợp về mức thay đổi bố cục (CLS) cao do sự thay đổi bố cục do quảng cáo kích hoạt, đặc biệt là từ các vùng nhiều kích thước và biểu ngữ trên cùng.
- Thời gian hiển thị nội dung lớn nhất (LCP) xuất hiện muộn do quảng cáo là thời gian hiển thị lớn nhất hoặc bằng cách lấy băng thông từ việc tải hình ảnh chính.
- Thời gian phản hồi lần tương tác đầu tiên (FID) cao do JavaScript bên thứ ba cần cho hoạt động quảng cáo, đặt giá thầu dựa vào tiêu đề và các mục đích khác.
- Những ảnh hưởng phụ đối với Các chỉ số quan trọng về trang web khi hộp thoại đồng ý do nhà cung cấp bên thứ ba kiểm soát. Tính năng này cũng góp phần vào việc thay đổi bố cục và có thể được phát hiện là nội dung hiển thị lớn nhất muộn nhất.
Tối ưu hoá trang web tin tức cho Các chỉ số quan trọng về trang web
Khi bắt đầu nghiên cứu các chỉ số quan trọng chính của trang web, Netzw Wet nhanh chóng nhận ra rằng việc tối ưu hoá Các chỉ số quan trọng về trang web không ảnh hưởng tiêu cực đến quảng cáo, nhưng có thể dùng như một cơ hội để cải thiện khả năng xem của quảng cáo. Do đó, đội ngũ NetzWet đã tối ưu hoá Các chỉ số quan trọng về trang web để tăng khả năng xem của quảng cáo lên trên 75% nhằm thu hút quảng cáo có giá trị cao (mức trung bình trên toàn cầu đối với quảng cáo hiển thị dưới 50%).
Tối ưu hoá CLS
Quảng cáo thường tải muộn (đôi khi chủ ý là tải từng phần) và kích thước thực của quảng cáo thường không được biết trước do vị trí đặt quảng cáo nhiều kích thước và linh hoạt.
Vấn đề này có thể được chia thành hai quảng cáo trong màn hình đầu tiên và dưới màn hình đầu tiên.
Quảng cáo trong màn hình đầu tiên có thể khiến bố cục tăng đột biến do tải muộn và không xác định được kích thước. Việc chặn không gian lớn nhất mà họ có thể cần có thể dẫn đến trải nghiệm người dùng kém, trong khi việc yêu cầu nhà quảng cáo cung cấp kích thước cố định có thể làm giảm thu nhập từ quảng cáo. NetzWet đã giải quyết vấn đề này bằng cách làm cho quảng cáo ở trên cùng cố định và loại bỏ một số kích thước biểu ngữ lớn hơn được phép. Quảng cáo ở lớp phủ tránh kích hoạt chuyển đổi bố cục cho các quảng cáo có kích thước khác nhau. Mặc dù việc giảm kích thước đủ điều kiện có ảnh hưởng đến doanh số bán quảng cáo, nhưng khả năng xem tốt hơn sẽ dễ dàng bù đắp cho điều này.
Dữ liệu trong quá khứ và hoạt động thử nghiệm A/B đã giúp Netz mô phỏng tìm thấy kích thước và vị trí phù hợp cho các thiết bị và kích thước màn hình khác nhau, cũng như các quy tắc truyền thông CSS được dùng để đặt trước không gian.
Quảng cáo dưới màn hình đầu tiên cung cấp khả năng để cải thiện đáng kể:
- Một biểu ngữ không nhìn thấy được nhưng được tải sẽ tạo ra khả năng xem quảng cáo kém và khiến trải nghiệm trên trang kém đi.
- Một biểu ngữ được tải tại thời điểm người dùng cuộn qua có thể đưa ra thêm các lượt nhảy nội dung.
Để duy trì trải nghiệm tốt trên trang và khả năng xem quảng cáo cao, Netflix đã triển khai tính năng tải từng phần và dành riêng không gian cho kích thước của mẫu số chung nhỏ nhất. Trong vùng nhiều kích thước, các biểu ngữ được yêu cầu ở kích thước 300x250 đến 300x600, dành riêng chiều cao 250px. Việc này giúp loại bỏ sự thay đổi về bố cục đối với các kích thước nhỏ hơn và giảm mạnh đối với các biểu ngữ lớn hơn. Đây không phải phương pháp tối ưu, nhưng là bước khởi đầu và là lựa chọn hợp lý.
Để tối ưu hoá hơn nữa, Netflix đã sử dụng Intersection Observer và Network thông tin API để kiểm soát vị trí đặt quảng cáo và giảm sự thay đổi về bố cục. Các vị trí quảng cáo và chiến lược tải từng phần khác nhau được sử dụng tuỳ thuộc vào vị trí cuộn và chất lượng kết nối mạng, đồng thời quảng cáo có thể thay đổi từ nhiều kích thước thành kích thước cố định. Mục tiêu của thuật toán này luôn là tối đa hoá khả năng xem của quảng cáo trong khi giảm thiểu sự thay đổi về bố cục. Các trình duyệt không hỗ trợ API NetworkInfo sẽ sử dụng giá trị proxy dựa trên sự kết hợp giữa loại mạng phát sinh từ IP và thiết bị. Chiến lược tải thích ứng này đặc biệt làm giảm CLS đối với những người dùng có kết nối Internet chậm.
Tối ưu hoá FID
Độ trễ đầu vào đầu tiên có thể là một vấn đề đối với các nhà xuất bản tin tức, vì quảng cáo thường đi kèm với nhiều thư viện JavaScript khác. Và dường như có một tác động tiêu cực khi xem xét dữ liệu phòng thí nghiệm như Lighthouse. Tuy nhiên, khi xem xét dữ liệu thực địa trong Niên giám web năm 2020, nhiều trang web đã phản hồi đủ nhanh. Một phần là do JavaScript quảng cáo tải muộn (sau lần nhập đầu tiên), lưu vào bộ nhớ đệm hiệu quả (ví dụ: xử lý lưu mã vào bộ nhớ đệm của mã v8) hoặc được các nhà cung cấp quảng cáo tối ưu hoá hiệu quả. Các trình theo dõi khả năng xem của nhà cung cấp đảm bảo tránh được các tác vụ kéo dài. Vì vậy, ngay cả khi tổng thời gian chạy là dài, Tổng thời gian chặn (TBT) và FID sẽ không bị ảnh hưởng. Mặc dù FID không phải là vấn đề lớn đối với NetzWet, nhưng vẫn còn có một số biện pháp tối ưu hoá cần thực hiện:
- Giảm bớt tập lệnh và nhà cung cấp quảng cáo, tập trung vào một ngăn xếp nếu có thể.
- Đang tải tất cả tập lệnh có tính năng trì hoãn hoặc không đồng bộ.
- Sử dụng gói web hoặc các công nghệ tương tự để tách cây và tách nhóm.
- Sử dụng các quy tắc CSS đơn giản giống như BEM.
- Tránh các tác vụ chạy trong thời gian dài và sử dụng mẫu không hoạt động cho đến khi khẩn cấp.
- Làm việc với RequestAnimationFrame ở bất cứ nơi nào bố cục bị ảnh hưởng.
Tối ưu hoá LCP
Thời gian hiển thị nội dung lớn nhất có thể chịu ảnh hưởng của quảng cáo theo 2 cách: xác định rõ ràng một quảng cáo là thời gian hiển thị quảng cáo lớn nhất và gián tiếp do việc tắc nghẽn băng thông mạng hoặc ảnh hưởng đến đường dẫn quan trọng để nội dung hiển thị lớn nhất thực sự (ví dụ: hình ảnh chính) không tải đủ nhanh.
NetzWet đã xoá những quảng cáo hình chữ nhật trung bình khỏi những vùng quảng cáo hàng đầu trong khi tối ưu hoá cho CLS. Điều này mang lại một lợi ích khác là quảng cáo không trở thành yếu tố lớn nhất.
NetzWet tuân theo một chính sách nghiêm ngặt để ưu tiên nội dung hơn quảng cáo. Netz Workspace ưu tiên các hình ảnh và phông chữ chính được dùng trong màn hình đầu tiên và tối ưu hoá đường dẫn quan trọng để được ưu tiên hơn các tập lệnh và quảng cáo. Việc ưu tiên này giúp LCP không bị quảng cáo ảnh hưởng.
Bên cạnh những hoạt động tối ưu hoá này, NetzWet còn thực hiện theo các phương pháp hay nhất khác:
- Phân tách CSS cho đường dẫn hiển thị quan trọng và đặt đường dẫn này ở đầu.
- Tải sẵn các phông chữ, tập lệnh và hình ảnh quan trọng nhất.
- Tránh tải từng phần hình ảnh trong màn hình đầu tiên.
- Đã dùng
font-display="swap".
Sự đồng ý theo GDPR và Các chỉ số quan trọng về trang web
Hộp thoại đồng ý thường có tác động tiêu cực đến Các chỉ số quan trọng về trang web. Giống như quảng cáo, hộp thoại đồng ý có thể tác động đến Các chỉ số quan trọng về trang web theo hai cách:
- Rõ ràng nếu nó được phát hiện là nội dung hiển thị lớn nhất hoặc gây ra sự thay đổi bố cục.
- Một cách ngầm ẩn, bằng cách đánh cắp băng thông từ nội dung hiển thị lớn nhất thực tế, chặn đường dẫn quan trọng đến nội dung hiển thị lớn nhất hoặc trì hoãn quảng cáo cho đến khi có được sự đồng ý, từ đó có thể kích hoạt sự thay đổi về bố cục.
Netzw Wet làm việc với một nhà cung cấp dịch vụ đồng ý bên thứ ba cũng đã triển khai các tính năng tối ưu hoá. Đầu tiên NetzWet phải đảm bảo tránh được những sai lầm đơn giản:
- Các tập lệnh yêu cầu đồng ý được tải không đồng bộ để không chặn các tài nguyên quan trọng.
- Sự đồng ý được định dạng sao cho các phần tử lớn không đủ điều kiện trở thành phần tử lớn nhất trong LCP.
- Lớp phủ lấy sự đồng ý sử dụng
position: fixedđể tránh thay đổi. - Mặc dù quảng cáo chỉ hiển thị sau khi người dùng đồng ý, nhưng vẫn giữ nguyên khoảng trắng đầy đủ trước để tránh thay đổi bố cục khi quảng cáo tải.
- Việc đảm bảo cách hiển thị và định vị của hộp thoại đồng ý không làm thay đổi bố cục. Một vấn đề được phát hiện và khắc phục ở đây là tuỳ chọn khoá cuộn của nhà cung cấp dịch vụ, tuỳ chọn này vô hiệu hoá tính năng cuộn trong khi trạng thái đồng ý hiển thị bằng cách di chuyển nội dung chính của bài viết khi cuộn, làm thay đổi bố cục.
Sau khi nghiên cứu này được tiến hành, vẫn còn có sự khác biệt lớn giữa CLS (Điểm số tổng hợp về mức thay đổi bố cục) tại hiện trường và trong phòng thí nghiệm. Mặc dù CLS trong phòng thí nghiệm gần bằng 0, nhưng các giá trị thực địa lại cao hơn đáng kể so với ngưỡng. Sau khi điều tra, nguyên nhân là do thay đổi bố cục trong iframe đồng ý, hiện chỉ được ghi lại chính xác trong dữ liệu trường. NetzWet tiếp tục làm việc với nhà cung cấp dịch vụ đồng ý bên thứ ba để cải thiện vấn đề này.
Mô hình gói thuê bao tin tức và Các chỉ số quan trọng về trang web
Các nhà xuất bản tin tức đang chuyển sang mô hình gói thuê bao để tài trợ cho hoạt động báo chí. Mô hình này phù hợp với Các chỉ số quan trọng về trang web vì mọi người sẽ không đăng ký những trang web có trải nghiệm người dùng kém. Ngoài ra, người đăng ký sẽ không muốn nhìn thấy quảng cáo trong nội dung trả phí, nhưng việc ẩn quảng cáo có thể khiến bố cục thay đổi. Trang web cần kiểm tra xem người dùng có quyền xem nội dung và có hiển thị quảng cáo hay không. Việc kiểm tra có thể làm tăng độ trễ, khiến nội dung thay đổi hoặc trải nghiệm người dùng kém.
NetzWet đang sử dụng mô hình mà trong đó nội dung luôn miễn phí nhưng người đăng ký sẽ không nhìn thấy quảng cáo. Họ đã nghiên cứu nhiều cách để truy vấn và lưu trữ quyền nhằm giảm độ trễ và sự thay đổi về bố cục.
Truy vấn ban đầu về quyền luôn gây ra độ trễ, do đó, nếu việc truy vấn quyền mất quá nhiều thời gian, thì trang web sẽ cho thấy trạng thái gần đây nhất được lưu vào bộ nhớ đệm. Đối với người đăng ký mới, điều này đồng nghĩa với rủi ro nhỏ khi người dùng trả tiền nhìn thấy quảng cáo một lần. Người dùng vừa kết thúc gói thuê bao có thể thấy một lượt tải không có quảng cáo trước khi cập nhật quyền được lưu trữ trên thiết bị. Sau khi đã xác định các quyền, chúng sẽ được lưu trữ cục bộ bằng API LocalStorage, để tránh độ trễ bổ sung và thay đổi bố cục trong quá trình điều hướng sau này.
Kết quả tối ưu hoá
Kết quả tối ưu hoá của NetzWet phải nói lên tất cả. Điểm số PageSpeed Insights của họ vượt trội so với các nhà xuất bản tin tức trên toàn thế giới:
Các hoạt động tối ưu hoá đã giúp cải thiện trải nghiệm trên trang, nhưng vẫn chú trọng đến doanh nghiệp và trải nghiệm quảng cáo nâng cao, khả năng xem quảng cáo và doanh thu. Sau khi chạy lại trang được tối ưu hoá, Netflix nhận thấy CPM tăng 20-30%, với khả năng xem quảng cáo trên 75%. Tuy nhiên, Netzchét giả định mức tăng doanh thu tổng thể sẽ còn cao hơn nữa. Lưu lượng truy cập tăng kể từ khi chạy lại ứng dụng, có thể là do mức độ tương tác của người dùng cao hơn và tỷ lệ thoát thấp hơn do trải nghiệm người dùng được cải thiện. Rất khó để định lượng và đặt ra những tác động này khi triển khai lại, do lưu lượng truy cập biến động tự nhiên và cũng có những tác động từ đại dịch toàn cầu. Những tác động gián tiếp này là một trong những lý do khiến NetzWet luôn xem xét tất cả các con số khi xem xét trang web của họ chứ không chỉ CPM, vì điều này có thể gây hiểu lầm. Các chỉ số quan trọng về trang web và chỉ số về trải nghiệm người dùng, kết hợp với tất cả chỉ số liên quan đến quảng cáo, mang lại bức tranh thực tế.
Hướng về tương lai
NetzWet tin rằng trong tương lai không có cookie của bên thứ ba, việc nhắm mục tiêu theo ngữ cảnh thông qua nội dung, kết hợp với trải nghiệm người dùng tốt và trải nghiệm trên trang (bao gồm cả khả năng xem quảng cáo) là chìa khoá để thành công với vai trò là nhà xuất bản tin tức.
Do đó, Netz Workspace không chỉ dừng lại ở Các chỉ số quan trọng về trang web mà còn vượt trội hơn bằng cách triển khai nhiều chức năng hiện đại dành cho web như Ứng dụng web tiến bộ (PWA), nội dung ngoại tuyến, chế độ tối, API Chia sẻ web và Hoạt động đáng tin cậy trên web (TWA) bằng cách sử dụng Digital Merchandise API (API Hàng hoá kỹ thuật số) mới.