跳至主要內容
×

如何設定行動網站?先確認現有架構與手機呈現需求

設定行動網站,先確認現有網站是單一網站,還是桌機版與手機版各有網址,再決定是否需要不同內容,或只需讓同一份內容適應螢幕。若需求主要是調整呈現,可優先評估響應式設計;若必須保留兩套版本,則要處理版本判斷、重新導向與頁面對應。以下以材料中的架構說明整理選擇方式,不把歷史文章當成現行搜尋規則。

先盤點現有網站,不急著另建手機版

開始前,先把問題分成三項,避免只因手機顯示不佳,就直接增加另一個網站:

  • 網址:手機與桌機是否使用相同網址?是否已有以 m 或 mobile 區分的版本?
  • 呈現:需要的是同一內容重新排版,還是依裝置提供不同的 HTML?
  • 維護:能否修改原網站?若保留兩套版本,是否願意持續管理兩邊的頁面關係?

Warrior Forum 的一名發文者就描述:舊網站以 FrontPage 製作,後來另建 WordPress 手機版,卻遇到手機版出現在桌機搜尋結果、顯示不理想的情況。他認為當初應改造主站,但因即將退休而不想重做。這是個案,不代表新增手機版必然造成同樣問題,也不能由他的判斷直接確定故障原因。

三種架構的差別,在內容交付與維護方式

Semrush 於 2022 年的文章整理了三種設定方式,可用來理解選型差異:

  • 響應式設計:使用相同網址與 HTML,由 CSS 依裝置調整呈現。文章列出的優點包括方便分享連結、減少維護,以及不必為切換手機版而重新導向。
  • 動態提供內容:網址相同,但伺服器依裝置傳送不同 HTML。要注意版本判斷;文章提醒,手機可能收到桌機版本,影響使用體驗。
  • 分離式網址:桌機與手機各有網址,由伺服器判斷裝置並導向對應版本。文章指出,這種方式較費管理時間,重新導向也可能拖慢載入。

因此,若只是讓相同內容適應不同螢幕,可先評估響應式;若原站限制使兩套版本必須保留,就不能只檢查手機版外觀,還要檢查兩個版本如何交付。

已有兩套網址,先釐清對應再改標籤

同一篇 2022 年文章對分離式網址的說明是:手機頁以 rel=”canonical” 指向對應桌機頁,桌機頁以 rel=”alternate” 指向對應手機頁。這是該文當時的技術建議,不是本篇已核實的現行官方規則,也不是要求所有網站一律套用。

若遇到前述論壇個案,應先釐清哪些頁面互相對應、目前標籤指向何處,以及裝置導向是否送出預期版本。材料沒有提供該站的檢查結果或成功修復紀錄,因此不能承諾刪除某個標籤,就能讓桌機版重新出現在搜尋結果。

行動網站設定的網路各方意見

目前訪客大多使用桌機,還需要考慮行動呈現嗎?

仍值得評估,不能只憑現有桌機流量就排除手機需求。awoo 於 2015 年的文章指出,不適合行動裝置的網站可能原本就較少手機流量,因此現有比例未必能完整反映潛在需求。這是評估時應考慮的可能性,不代表每個網站都有相同的手機受眾,也不必然要求另建手機版。

行動網站的圖片一定要每百字放一張嗎?

不一定。2017 年的文章作者把每百字至少一張圖片當作自己部落格的原則,並非所有網站都適用的標準。選用圖片時,也可考慮檔案大小與載入時間;同文提到壓縮圖片有助於減少佔用空間及載入時間,但實際效果仍取決於圖片與處理方式。

舊網站若使用 Flash,行動版該怎麼處理?

可評估以 HTML5 取代 Flash 內容。2026 年的文章認為,HTML5 在效能、安全性和行動裝置相容性方面較佳,也能不依賴外掛嵌入多媒體。這項建議適用於仍有 Flash 內容的網站;實際替換方式則取決於原有內容,材料沒有提供個別網站的轉換步驟。

參考資料

  1. Canonical questionwww.warriorforum.com — 本文論述的參考來源。
  2. The Complete Guide to Mobile SEO: 9 Tips & Best Practiceswww.semrush.com · 2022-11-29T14:36:00Z — 本文論述的參考來源。
  3. 10 Ways to Optimize Your Site for Mobile Searchneilpatel.com · 2017-08-02T23:40:17+00:00 — 討論:行動網站的圖片一定要每百字放一張嗎?
  4. Google針對行動版搜尋結果更新問與答(4月21日)www.awoo.ai · 2015-05-06T04:02:14+00:00 — 討論:目前訪客大多使用桌機,還需要考慮行動呈現嗎?
  5. A Complete Guide to Mobile SEOneilpatel.com · 2026-04-06T19:00:00+00:00 — 討論:舊網站若使用 Flash,行動版該怎麼處理?
把問題繼續聊下去

一起討論 0 則留言

你遇到什麼狀況?留下問題或實作經驗,一起找到下一步。

目前還沒有留言,歡迎開始第一個討論。

留下你的想法

← 繼續找答案
聊聊你的需求

從你的品牌開始聊。

告訴我你的網站,以及你希望達成的目標。

用 LINE 聊聊 tony@procrustes.info