以下內容由Mockplus（摹客）團隊翻譯整理，僅供學習交流，Mockplus是更快更簡單的原型設計工具。
在2016年，全球的移動網際網路使用率首次超過臺式電腦。根據谷歌英國地區研究:
“如今，65％的英國成年人都使用智慧手機作為他們上網的主要裝置。”
人們搜尋資訊，購買商品，訂閱服務都是使用移動裝置。使用者偏好的轉變導致使用者對產品的期望也大大增加。如今，大多數使用者對於糟糕的手機效能幾乎沒有耐心 - 如果他們不能立即獲取他們想要的東西，他們就會轉投其他產品的懷抱（這對於一款應用來說簡直是重擊）。
設計一款移動網站應用，如何才能抓住使用者的心？首先，設計師應該規避設計中一些常見的錯誤，提高執行速度。在這裡，我將會提供一些解決頁面載入緩慢，登入牆使用者體驗差和支付過程耗時久這些常見問題的方法，以供參考。
頁面載入緩慢
由於目前的技術支援實現更快的體驗，使用者的等待意願開始下降。
“其中三分之二的行動網路使用者表示，載入頁面所需的速度對他們的整體體驗影響最大。”
Google在全球範圍內對90萬個移動網站進行了測試，發現完全載入移動網頁所需的平均時間為22秒。與此同時：
如果載入時間超過3秒，53％的使用者將離開移動網站。
解決方法
1. 試著找出造成載入緩慢的原因
如果載入緩慢是你網站的常見情況，請嘗試找出具體原因並解決問題。通常，頁面載入時間受以下影響：
視覺元素（影象和動畫）。高清影象和流暢的動畫只能在不影響載入時間的情況下建立良好的使用者體驗。因此，這可能是造成網站載入緩慢的原因之一。建議閱讀“影象優化”相關知識瞭解更多優化細節。
自定義字型。與網站上其他資源一樣，下載自定義字型會耗費一定的載入時間(如果字型位於第三方服務上，則需要更多時間)。
商業邏輯。程式編寫不夠規範。
網站基礎設施。網站所使用的硬體，如伺服器的效能、寬度速度以及伺服器的硬體配置都會影響載入速度。
2.測試你的網站
如何測試網站的效能？這裡推薦兩個工具給大家。第一個是Google’s Test MySite，該網站會根據網站效能的現狀，提供有關如何加速和改進網站的可操作報告。
WebPagetest 是另一個測試和優化網站效能的工具，它允許你對全球多個地方的真實使用者使用的真實瀏覽器 (如IE瀏覽器和谷歌瀏覽器) 的連線速度進行一個免費的測試。
3. 使用載入佔點陣圖
如果你不能提高網站實際的執行速度，至少試著營造一種載入速度很快的感覺--使用者對於網站速度快慢的感覺通常比實際的載入速度更重要。
載入佔點陣圖是在載入內容時顯示的頁面版本。佔點陣圖會使使用者感覺網站速度的執行起來比實際情況更快。
設計師不妨在Codepen Example中檢視佔點陣圖效果。它的設計者就是利用壓力緩衝器的原理，使用佔點陣圖給使用者營造出一種錯覺: 網站正在執行，並且內容在快速載入中。
登入牆設定
在使用者使用應用程式之前，一般會有一個強制性註冊的登入牆。登入牆是使用者在初次使用下放棄應用的主要原因。對於品牌認知度較低或價值主張不明確的應用而言，使用應用的使用者數量尤其重要。因此，建議推遲註冊 – 提供使用者嘗試應用該項服務，他們會更樂意完成此步驟。
解決方法
1.使用電子郵件地址或電話號碼作為使用者ID
如果你讓使用者建立一個獨特的使用者名稱，他們很可能會遇到以下這些麻煩:
由於使用者名稱必須是唯一的，因此使用者可能需要花費幾分鐘才能得到正確的名稱，因為首選使用者名稱已被其他使用者使用。
使用者可能會以使用者名稱註冊，但過了一段時間後，他們就會完全忘記。根據Janrain+Blue的研究，92%的使用者如果忘記了使用者名稱就會放棄使用。
因此，允許使用者通過電子郵件或電話號碼作進行註冊，讓註冊更加簡單輕鬆。
2. 使密碼驗證成為無摩擦的體驗
使用者經常忘記他們的賬號密碼，當他們不得不經歷密碼重置這個過程時，他們會感到非常惱火。
這時候設計師應該怎麼做？簡化認證體驗，減少放棄風險。使用第三方登入（使用Facebook / Twitter登入）：
Flipboard允許使用者通過社交網路帳戶登入，
或指紋觸控/臉部識別登入：
iPhone應用程式的Chase銀行提供了一鍵式登入選項。
3. 提供其他登入方式
根據使用者提供的相關資訊來提供其他登入方式。例如，如果你擁有使用者的手機號碼，則可以在手機上輸入一次性密碼。
漫長的支付過程
越來越多的移動使用者不僅使用移動裝置搜尋商品，甚至會在手機上完成支付過程。這意味著我們需要為小螢幕裝置設計購物體驗，並讓它儘可能舒適。但說起來容易往往做起來難，在移動裝置上填寫結賬表單可能很痛苦。因此，繁瑣的支付過程是導致使用者放棄支付的主要原因。這並不奇怪，根據Google資料表明：
“50％的使用者因為不愉快的移動端支付體驗而放棄了交易”
解決方法
1.不要強迫使用者建立賬號
據Baymard研究所稱，強迫使用者建立賬號是消費者放棄購買的最大原因之一。正確的做法是支援使用者無需註冊進行購買。因此，應用不僅需要為消費者提供了“快捷支付”選項，而且要讓該選項足夠清晰可見 (Baymard研究所還發現，88%的移動端支援訪客支付，這些選項往往由於不夠明顯而容易地被使用者忽略)。
易趣提供了兩種選擇 -'登入支付'和'訪客支付'
2. 記住使用者的詳細資訊
不要要求使用者輸入他們之前提供的任何資訊。收集過使用者資料之後，可以再將其用於使用者的其他新交易中。這些資料可能是收貨地址和支付資訊，一定要確保使用者在需要的時候可以進行修改。
3. 利用地理位置資料
與其向使用者詢問送貨地址，不如將其當前位置作為配送貨物的預設選項。但在設計時需確保使用者在需要的時候，可以輕鬆地更改收貨地址。
當使用者點選“分享我的位置”按鈕時，表格中的資訊將會自動填入當前地址。
4. 使用Apple Pay或Google Pay支付
談到付款問題，設計者應該儘可能提供使用者多種選擇，這樣使用者就可以選擇他們喜歡的方法進行支付。提供多種支付選項的應用程式，如Apple Pay和Android Pay，可以讓使用者在付款時從填寫額外表單的痛苦中解脫出來，並能提供給他們更大的安全感。
5. 設計“快速購買”選項
設定自“快速購買”這個選項可能對老使用者更有幫助。當使用者點選“快速購買”按鈕時，網站應該自動將使用者重定向到購買資訊頁面進行確認。所有常用的支付方式和收貨地址都應該直接從之前的訂單中進行提取。
6. 支援使用其他裝置繼續購買
雖然使用移動裝置完成購買的人數正在增長，但有相當多的使用者使用手機只是為了瀏覽，更喜歡在臺式電腦上完成購買。設計者應該設定“儲存以待後用”或“將購物車傳送至郵箱”的選項來幫助使用者完成支付。
閱讀本文（本文最初發表於 babich.biz）之後，你們有更多關於改善移動網站效能的建議嗎？ 歡迎在下面的評論區中進行分享！
原文作者：Nick Babich
原文連結：https://uxplanet.org/mobile-web-when-speed-matters-d371a961cf46