網路架站

手機版網站該把內容砍短嗎?重排優先序比刪除更有效

多數人以為,手機流量佔比一過半,版面就該砍到只剩重點;其實使用者要的從來不是資訊變少,而是資訊被排到他當下用得上的順序。這個誤解幾乎每次企業內部討論改版時都會出現,後台報表跳出手機流量已經過半,會議室裡下一句話幾乎都是「那手機版要精簡一點」。

問題是,「精簡」在實務上很少停在版面調整,常常一路滑向砍文案、砍功能、砍段落。電腦版原本三段的說明砍成一句,選單裡的次要功能整批藏起來,長篇的規格說明直接刪掉只留一張圖。這些決定的出發點,都是手機流量佔比這一組數字。

流量佔比說的是使用者用什麼裝置造訪這個網站,推論出來的卻是使用者需要多少資訊,這是兩個完全不同維度的東西,被硬生生劃上等號。先把這個推理斷點看清楚,再一關一關拆手機版真正該重排的是什麼,又不該砍掉什麼。

手機流量過半說的是裝置維度,內容該砍到最簡是需求維度,兩者被硬劃等號但沒有必然因果
手機流量過半只證明大家習慣用手機造訪,不能證明他們在手機上想看的東西比較少。

手機流量過半不代表版面該砍到最簡

從 Statcounter 的裝置流量統計來看,只算純智慧型手機的話,不同季度落在五成出頭到六成之間;如果把平板一起算進去,比例還會再往上推一截。不論用哪一種算法,手機流量已經過半這件事本身是真的,這點沒有疑問。

真正該檢視的是接下來那一步,企業看到這個數字之後,拿它去支撐了什麼決策。最常見的用法,是把它當成手機版該精簡的理由,版位有限、螢幕小,所以文案要短、功能要少、段落要精。這套邏輯聽起來合理,實際上做起來,精簡很少停在排版變簡單,而是直接變成內容變少,像是段落被砍到剩一句,次要功能整批藏起來,規格表直接不見。

問題出在這裡,裝置佔比是一件事,使用者需要多少資訊是另一件事,兩者之間沒有必然的因果關係。手機流量過半,只能證明大家習慣用手機造訪這個網站,不能證明他們在手機上想看到的東西比較少。

流量佔比高反映的是使用情境,不是資訊需求量本身

流量佔比高,實際反映的是使用者在什麼情境下打開這個網站,通勤路上滑一眼比價,店門口先查營業時間,等車的空檔翻一下規格。這些都是情境的描述,不是資訊量的描述。同一個使用者,情境從辦公桌換成月台,並不會因此少想知道一件事。

W3C 在《Mobile Web Best Practices 1.0》裡明訂的 One Web 原則,講的正是這件事。不論使用者用什麼裝置存取,內容供應者都應該盡量讓相同的資訊與服務可以取得,但這不代表所有裝置都要用完全相同的方式、呈現完全相同份量的內容,裝置限制、頻寬、行動網路狀況都會影響呈現方式,但目標仍然是同一件事。同一份文件也列了具體條款:內容要適合行動情境使用,要把內容限制在使用者當下實際要求的範圍內,而不是預先幫使用者刪減,構成頁面核心意義的材料要排在其他材料之前。這幾條合起來,意思是行動情境真正該做的是排序與篩選,不是預先斷定使用者只需要少量資訊。

Google 官方文件《行動版內容優先索引系統的最佳做法》講得更直接,行動版網站應該和電腦版含有同樣的內容,如果行動版提供的內容比電腦版少,就該考慮更新,補到跟電腦版等量。這份文件同時警告,如果刻意讓行動版內容比電腦版少,啟用行動版內容優先索引之後可以預期流量會下降,因為 Google 沒辦法從頁面上獲得跟電腦版一樣多的資訊。這兩份文件都不是為了配合手機流量過半這個現象才放寬標準的,它們定案的時間點,一份是二十年前的規範,一份是搜尋引擎行之有年的官方立場,講的始終是同一個原則,內容對等,呈現方式才因裝置而異。

砍掉的資訊不會消失,使用者只是換一個地方找

一味簡化實際發生時,資訊需求本身並不會因為版面變簡單就跟著消失。使用者原本想找的答案還在那裡,只是他被迫換一個管道去找,離開這個網站找同類型的其他選擇,或者乾脆放棄整個流程,不繼續往下走。精簡版面看起來是零成本的決定,實際上是把成本轉嫁給使用者,而使用者的反應通常是離開,不是耐著性子繼續找。

Google 與 Ipsos 合作的 Micro-Moments 消費者行為研究發現,有 29% 的智慧型手機使用者表示,如果一個網站或應用程式沒能滿足他們當下的需求,例如找不到資訊、或載入太慢,就會立即切換到另一個網站或應用程式。在這群會切換的使用者裡,67% 是因為要完成想做的事,中間的步驟太多,70% 是因為頁面載入太久。同一份研究也提到,不少消費者只願意等待很短的載入時間,超過那個門檻就會轉身離開。資訊不夠或找不到不是使用者會將就的小事,是會讓使用者直接轉身離開的原因。

資訊被藏起來與資訊被刪除,對使用者是同一種結果

把內容整段刪掉,跟把內容藏進使用者找不到的地方,兩者對使用者造成的實際後果其實一樣,他都拿不到那個資訊,只是這兩件事常常沒被看成同一種結果。很多網站自認為沒有刪內容,只是把它收進次頁或分頁,但如果使用者根本沒發現那個入口存在,效果就跟內容從沒出現過完全相同。

Baymard Institute 這家長期做大規模行動裝置易用性測試的機構,在 2020 年發布的研究指出,26% 的行動網站把部分商品頁內容,像是規格、評論、問答,放進次頁裡收起來。測試觀察到,一部分使用者完全沒注意到通往次頁的連結,誤以為主頁面顯示的就是全部內容,因而在對商品有疑問卻找不到答案時直接放棄;另一部分使用者就算找到次頁,也常在按返回鍵時被導回商品清單頁而不是商品主頁,整個人迷失方向。這份研究的結論很直白,把內容收進次頁,看似解決了畫面擁擠的問題,實際上製造了一群完全看不到重要內容的使用者,比起內容擁擠,這是更嚴重的問題。

內容被整段刪除,和被藏進沒有清楚入口的次頁,最後都讓使用者拿不到那則資訊
把內容收進使用者找不到的地方,效果就跟內容從沒出現過完全相同。

內容對等不等於版面照抄,正確做法是漸進揭露

反對內容減量,不等於主張手機版要跟電腦版排版一模一樣。把電腦版的多欄版面、落落長的段落原封不動塞進手機版,一樣是失敗的做法,只是失敗的方向相反,這次換成首屏被塞爆,使用者滑到累。資訊的量要對等保留,呈現方式本來就該因應裝置重新設計,正確的技術手段是漸進揭露,不是刪除,也不是照搬。

一味簡化把內容砍掉逼使用者離開,優先序重排則把核心排到首屏、其餘用帶清楚入口的收合區塊保留
不是「不是刪除就是照搬」,而是資訊量對等保留、把核心排到首屏,其餘用有清楚入口的收合區塊漸進揭露。

Google 在前一節引用的同一份文件裡,緊接著給出具體建議,內容對等不代表版面要照抄,可以為行動裝置設計不同的版面,讓使用者獲得更好的體驗,例如把內容移到適當的折疊頁面或分頁,前提是內容都和電腦版網站相同。這句話直接點出核心立場,對等的是內容量,重新設計的是呈現方式。

Nielsen Norman Group 創辦人 Jakob Nielsen 在他 2006 年發表的經典文章〈Progressive Disclosure〉裡指出,漸進揭露解決的是一個真實的兩難。使用者一方面想要功能齊全、資訊夠深,一方面又沒有時間先搞懂一大堆選項才能挑出自己要的那幾個,做法是先只顯示最重要的少數選項,其餘選項等使用者主動要求才展開。這篇文章同時指出,做對漸進揭露必須滿足兩個條件:第一,首屏與次屏怎麼分要分對,使用者頻繁需要的東西全部要留在首屏,不能讓使用者太常需要跳去次屏才能完成任務;第二,從首屏跳到次屏的路徑必須清楚明顯,連結或按鈕要有清楚的資訊氣味,讓使用者看到就知道點下去會出現什麼,而不是一個看起來像裝飾的按鈕。這兩個條件沒做到,漸進揭露就會退化成上一節講的資訊被藏起來。

沒有清楚入口的收合區塊照樣讓使用者漏看

Baymard 針對同一批測試,提出的具體解法是用垂直收合區塊取代次頁,把內容留在同一個頁面,用可收合的區塊呈現,預設收合,點開才展開。這個做法要生效,有兩個實作細節不能省。

第一,所有主要區塊都要用同一種收合設計,商品說明、評論、問答、規格、運送資訊,不能有的用收合、有的又丟到次頁,混用會讓使用者搞不懂頁面邏輯。第二,每個收合區塊的標題要具體,看得出裡面裝什麼,動態內容例如評論或問答,標題還要帶上目前的數量,像是使用者評論後面加括號標出則數,讓使用者不用點開就知道值不值得點開。少了這兩個細節,收合區塊只是換了個名字的次頁,一樣會被使用者漏看。

優先序重排的判準是使用者當下要完成的任務

內容要保留、呈現要重排,重排的依據從來不是設計師主觀覺得畫面好不好看,而是使用者在手機這個情境下,當下最急著要完成的動作是什麼。判斷優先序時該問的是這個使用者現在打開這個頁面,最想拿到的答案或最想做的動作是什麼,而不是怎麼排看起來最工整。

W3C《Mobile Web Best Practices 1.0》裡構成頁面核心意義的材料要排在其他材料之前的條款,搭配另一條要求在放太多連結與要求使用者點擊太多次才找得到內容這兩個極端之間取得平衡的條款,合起來提供了判斷優先序的具體依循框架。用法是先問這則資訊是不是構成這個頁面核心意義的一部分,再考慮呈現在第一層還是收進次層。連結不是愈少愈好,過度精簡導致使用者要多次點擊才拿得到資訊,一樣是失敗的設計;反過來塞入過多連結也一樣有害,兩害相權取其輕,不是無腦地愈少愈好。

這個判準跟使用者伸手能不能點到,是兩個獨立問題。前者是決定資訊順序,後者是操作物理限制。

手機友善的判準是任務完成度而非版面精簡程度

判斷一個手機版做得好不好,該問的不是內容精簡到什麼程度,而是使用者這次要完成的任務,有沒有順利完成。這個判準跟流量佔比完全脫鉤,不論手機流量佔比是五成還是九成,判準都不會變,因為流量佔比從來不是決定內容該留多少的依據。

想像一間提供預約服務的店家網站,把地址與營業時間收進使用者沒發現的收合區塊或次頁裡,訪客滑過店家介紹與評論,想確認怎麼過去、什麼時候能上門,卻怎麼也點不到那則資訊,滑了幾輪之後直接離開,沒有再找下去。問題不是版面不夠精簡,是那則資訊被排到了使用者拿不到的位置。

手機流量佔比還會繼續往上走,但這件事本身,從來都不是決定內容該留多少的理由。真正該盯著看的,是使用者帶著哪個任務打開頁面,那個任務最後有沒有走完。把資訊按這個順序排好,把該收合的地方做出清楚的入口,版面自然會跟著情境變輕,不必靠刪東西去換一個乾淨的畫面。

常見問答

本區問答由 AI 依文章內容自動整理,僅供快速參考,正式內容仍以全文為準。

手機流量佔比過半,就代表內容該砍到最簡嗎?

不代表,手機流量過半只能證明使用者習慣用手機造訪網站,不能證明他們想看到的資訊比較少;流量佔比反映的是使用情境,不是資訊需求量,兩者是不同維度,沒有必然因果關係。

行動版網站的內容可以比電腦版少嗎?

不建議,行動版網站應該和電腦版含有同樣的內容,如果行動版內容比電腦版少就該補齊,否則啟用行動版內容優先索引後可以預期流量會下降,因為抓不到跟電腦版一樣多的資訊。

手機上找不到資訊,使用者會怎麼做?

很可能直接切換離開,研究發現 29% 的智慧型手機使用者表示網站沒能滿足當下需求就會立即切換到另一個網站或應用程式,其中 67% 是因為步驟太多、70% 是因為載入太久。

內容藏進次頁跟刪掉,對使用者有差別嗎?

沒有差別,兩者對使用者造成的實際後果一樣,都是拿不到那個資訊;研究發現使用者常常沒發現通往次頁的入口,效果就跟內容從沒出現過完全相同,反而製造出一群看不到重要內容的使用者。

判斷手機版設計做得好不好,該看什麼標準?

該看使用者這次要完成的任務有沒有順利完成,跟版面精簡到什麼程度無關,也跟手機流量佔比高低完全脫鉤,流量佔比從來不是決定內容該留多少的依據。

資料來源
  1. Mobile Web Best Practices 1.0 — W3C
  2. Mobile-first indexing best practices — Google
  3. Mobile UX: Avoid Subpages on Product Pages — Baymard Institute
  4. Progressive Disclosure — Nielsen Norman Group