如果讓網站主動分散讀者注意力成為一項奧運運動,新聞出版業每次都會名列前茅。

我造訪《紐約時報》想看四個標題,結果卻遇到422個網路請求和49MB的資料量。頁面花了兩分鐘才穩定下來。然後你就會明白為什麼每個理性的科技人都會在家人系統上安裝廣告阻擋器。

這種情況在頂尖出版商中普遍存在。

要真正理解49MB網頁的現象,我們先回顧幾十年前。這個頁面載入的大小,已經超過了Windows 95(28張軟碟片)的容量。當年主宰世界的作業系統,現在竟然能被一個現代網頁完整裝下。2006年,iPod風靡一時,數位音樂珍貴。標準高品質192 kbps的MP3歌曲約4至5MB。這個單一頁面相當於約10到12首完整歌曲的大小。我基本上是下載了一整張專輯的資料,只為了閱讀幾段文字。根據國際電信聯盟,當時全球平均寬頻網速約1.5 Mbps。你的瀏覽器會持續載入這個龐然大物好幾分鐘,足夠你離開去泡杯咖啡。

硬體在過去20年有如此進步,現代框架與廣告技術堆疊是否反而因抽象化與架構不良,抵銷了這些進步?

新聞網站非常喜歡追蹤用戶。

以上述例子為例,瀏覽單篇文章的網路瀑布圖顯示,客戶端瀏覽器中正進行著龐大且無規範的程式化廣告競價。在用戶還沒讀完標題前,瀏覽器已被迫處理數十個同時向Rubicon Project(fastlane.json)和Amazon Ad Systems等交易所發送的競價請求。雖然這些請求是非同步的,但其載荷對瀏覽器主執行緒極具敵意。為了支援這些,瀏覽器必須下載、解析並編譯數MB的JavaScript。作為出版商,你不該在呈現新聞內容前,先耗費計算資源來計算廣告收益。

許多違規者的共通點是:無情的監控節奏。

除了程式化競價的龐大負擔外,行為監控的頻率令人驚訝。用戶監控與不斷發送POST信標到第一方追蹤端點(a.et.nytimes.com/track)同時進行。背景中隱形的像素點與重定向到doubleclick.net和casalemedia,幫助串連用戶在不同廣告網絡間的跨站身份。

當你在手機上開啟網站,就像參與高頻金融交易市場。手機背後的熱度?筆電風扇突然轉動?這些都是這些微小腳本的綜合作用,還有電池消耗。

諷刺的是,這套監控系統同時初始化於purr.nytimes.com/tcf的請求,我只能推測這是歐洲IAB透明度與同意框架。他們把同意框架端點命名為purr,一隻貓咪在你口袋裡呼嚕呼嚕地翻找。

出版商並非邪惡,但他們很絕望。陷入程式化廣告技術的死亡螺旋,他們用短期CPM收益交換長期讀者留存。現代廣告產業正逐漸將創作者與廣告主分離。他們武器化使用者介面,因為他們認為必須如此。

可見度與停留時間是當今重要指標。每個敵意的使用者體驗決策都源自這一事實。你在頁面上停留越久,出版商能收取的CPM越高。你的挫折感成了商品。難怪工程師與設計師會做出優化這點的決策。你,讀者,被迫多次互動、等待、點擊、滾動。這不僅是錯誤方向,更是刻意設計的對抗性體驗。

軟體對讀者的尊重不足。出版商被拍賣系統的誘因挾持,該系統不僅鼓勵,還獎勵黑暗模式。

幾乎所有現代新聞網站都犯有某種反用戶模式。根據NNgroup定義,互動成本是用戶為達成目標所需付出的心理與身體努力總和。在現實世界中,敵意建築指的是有刺的公園長椅,防止人們睡覺。在數位世界,我們可稱之為為了提取指標而犧牲人類認知負荷的系統。以下介紹一些已成主流的用戶敵意設計。

以GDPR為例,這些優缺點自推出以來在科技圈廣泛討論。

用戶必須進行視覺篩選,找到低對比度的關閉圖示,完成額外操作才能看到他們想讀的5KB文字。以下是《經濟時報》標準頁面載入的拆解。

《經濟時報》:想像這樣的頁面上線。還有人在乎最終產品對用戶的呈現嗎?

用戶會同時遇到兩個Google登入提示。一個是置中自訂模態,完全遮蔽文字;另一個是右上角滑入的標準Google提示。這嚴重違反序列化引導,讓首次用戶困惑。

檢視螢幕空間,有頂部橫幅廣告、左右兩側摩天大樓廣告和內嵌廣告區塊。文章內容約佔螢幕空間15%。出版商反轉了內容與介面比例。

讀者還沒讀一句話,必須先找到並點擊中間模態的「X」、再關閉右上模態,並滾動過巨大的頂部橫幅。強迫用戶做數位整理,製造不必要障礙。

用戶讀到第二段時,文字突然跳動250像素,失去閱讀位置。原因是廣告網絡完成競價,插入iframe於視窗上方。Google的核心網頁指標中,這稱為累積佈局偏移(CLS)。高CLS常與高放棄率直接相關。

考慮到CLS問題、侵入式模態與阻塞渲染腳本,理論上都會降低頁面分數,Google也會因此SEO懲罰。但奇怪的是,Google自己的廣告產品也助長了這種現象。

域名權威與媒體聲譽確保這些網站持續出現在搜尋結果頂端。Google搜尋部門懲罰這些行為,廣告部門卻販售武器。

出版商喜歡嵌入自動播放影片,這並不受歡迎。論壇、Reddit、Hacker News和Twitter上都有相關討論。

更糟的是,當你滾動頁面,影片不會離開視窗,而是縮小並固定在右下角繼續播放。持續干擾你,且「X」關閉按鈕極小,點擊範圍狹窄,違反費茲定律。

NDTV首頁自動播放影片已成常態。

測量指標的人會吹噓影片前貼廣告擁有最高CPM。

若市場研究團隊堅持要影片,應使用IntersectionObserver API。用戶滾動過影片時,暫停播放,尊重用戶不互動的選擇。

在行動裝置上,垂直空間極為珍貴。平均手機視窗約800像素高。許多新聞網站使用黏性標頭(含標誌與漢堡選單),佔80至100像素。再加上黏性分享列與瀏覽器URL列與導航按鈕,內容空間更少。

[廣告與模態:89%] 對比 [內容:11%] 《衛報》此頁面內容僅佔視窗11%,且未計入手機瀏覽器導航列。

用戶實際閱讀視窗成為手機中央狹窄縫隙,產生視覺窒息感。用戶被迫多滾動3倍,增加互動成本。

還有誤觸稅。廣告點擊區旁的「X」按鈕是廣告營運團隊計算過的風險,誘發誤點。這些關閉按鈕本可更大,尤其在手機上,但卻不做。這是功能,不是錯誤。

我從小閱讀《Dainik Jagran》,曾是印度最受歡迎的印地語日報之一。這是他們今天的網站。內容區域被兩個z-index戰爭模組遮蔽。許多網站積極干擾讀者,強迫他們下載「應用程式」。我不明白這種強迫下載app的迷思從何而來。

現代新聞網站另一怪象是文章中途截斷,顯示「閱讀更多」或「繼續閱讀」按鈕。點擊事件告訴出版商哪些文章吸引人,並讓他們有機會在頁面下方載入更多廣告。

除非用戶積極操作,標頭就是累贅。標頭應該在向下滾動時隱藏,向上滾動時顯示,讓內容有呼吸空間。

若需廣告刷新,應使用與滾動深度綁定的延遲加載廣告(例如用戶滾動超過50vh時刷新),而非中斷閱讀體驗。

回到CLS,閱讀時大腦會記憶文字空間位置。佈局意外移動會破壞用戶空間記憶,增加認知負荷,打斷閱讀流暢。

出版商必須為非同步內容保留空間。將廣告區塊與圖片包裹在具有固定寬高比或最小高度的容器中。若廣告尺寸為300x250中矩形,容器可硬編碼尺寸。廣告載入時,DOM不會移動。若廣告未填滿,使用ResizeObserver在視窗外折疊容器,但避免用戶開始閱讀後推動文字。

Google應該有機制區分完全付費牆的新聞文章於搜尋結果中。

text.npr.org是NPR的輕量文字版,無冗餘、無追蹤與無模態。

這些存在證明用戶渴望無花俏、內容為主的網站。在國內外事件頻繁、網路入侵生活的時代,我們應該有更好的媒介,讓商業與用戶需求達成平衡。

良好的使用者體驗備受期待,一旦做好,感覺自然直覺。現今新聞介面假設讀者是敵人,要被困住並貨幣化。選擇盈利出版物與快速易用體驗不該是非此即彼。我保證這些出版商的工程師也痛恨現況,但他們被短期CPM優先的商業模式束縛。我們必須停止讓第三方行銷腳本主導網站架構。

《時報》沒有單一工程師決定讓閱讀變得痛苦。這架構是千百個局部理性、整體災難的誘因決策累積而成。

他們建立了一套將你注意力視為可提取資源的系統。你能做的最激進事,就是拒絕被提取。關閉分頁。使用RSS。讓跳出率自己說話。這些指標是虛榮,直到足夠多人停止被吸引,才會成為危機。

這系統對建造者來說運作完美。問題是,它對你有用嗎?