如何為平板打造完美的網站頁面

據調研公司Gartner預測，平板的銷量每週都在增加，到2016年，全世界平板的銷量將達到6.65億台。 隨著以蘋果iPad為代表的平板電腦風暴越演越烈，相信行動裝置取代個人電腦的霸主地位，成為接入網路的首選設備只是時間問題。

Adobe最近發佈的數位行銷報告顯示，使用平板電腦流覽網站的使用者比普通PC訪客的每筆交易金額高出20%。 這些資料意味著對於電子商務企業來說，設計對平板電腦友好的網站非常重要。

iPad的橫空出世讓原本死寂沉沉的平板市場重新煥發生機，可整整兩年時間過去了，很多網站還是沒有專門針對平板電腦進行優化，甚至很多新建的網站在平板電腦上無法正常使用。 而且這當中不只是那些不起眼的小網站，就連大名鼎鼎的Google Docs的使用者體驗也是相當糟糕，不信的話就在iPad上面試試Google Docs，你會發現除了流覽什麼都不能幹，尤其是當你需要編輯文檔的時候。

問題出在了哪裡

諸如細節是魔鬼、細節決定成敗等等的話我們都耳熟能詳。 其實導致上面的問題也很簡單：有些網站的連結和可點擊的圖片實在是有點小。 Web可用性方面的世界頂尖專家Jakob Nielsen一針見血的指出了問題的癥結所在，這些問題在Kindle Fire一樣的中等大小的平板上面尤為凸顯。 為15寸筆記本電腦或者22寸顯示器設計的網站並不適合iPad的10寸螢幕，整個螢幕會顯得過於擁擠而無處下手，使用者需要經常通過按兩下放大，這絕對不是個愉快的體驗。

平板與筆記本、桌上型電腦的五大重要差異

大體上說來，設計適合平板的網站與適合桌上型電腦/筆記本的網站存在如下五大差異：

尺寸


相對於筆記本和桌上型電腦而言，平板電腦的尺寸一般較小。 螢幕解析度


平板電腦螢幕解析度可謂是千差萬別（從Kindle Fire的600×1024到新一代iPadd的2048 ×1536)，而且因為平板電腦的螢幕方向可以旋轉，所以平板電腦的網站需要在水準和垂直方向都能正常流覽。 相容性


使用過平板的人都知道，Abobe Flash與平板的相容性是個大問題。 但是像Silverlight這樣的外掛程式，以及一些計算任務較重的JavaScript Web程式也會導致麻煩。 觸摸介面


這是個大問題。 觸摸介面是平板電腦和傳統PC最大的區別，為了方便使用者操作，就需要更大的可點擊元素和更少的導航元素。 記憶體和CPU限制


我們都知道平板板電腦已經進入四核時代，所以平板的性能缺陷往往很容易被忽略。 事實上平板電腦的記憶體和CPU性能依然遠遠落後于傳統PC，所以多媒體元件過多的網站對於平板電腦來說依然是個不小的挑戰。

理解使用者體驗

網站機構Domain7的創始人Shawn Neumann說，設計網站最重要的一點就是要理解使用者體驗，並制定策略來滿足使用者的需求。 桌上型電腦是用來搞研究的和完成任務的，智慧手機是用來臨時打發時間的，平板則是用來在家裡好好享受時間的。

「有時候採取回應的辦法是最為有效的」，Neumann建議道。 回應式的網站是流動的，可以根據不同的螢幕尺寸和顯示解析度進行調整。 所以理論上來說，同一個網站可以同時在大螢幕和小螢幕的設備上流覽，但實際的結果往往是差強人意。 如何克服解析度變化這一問題，難度也是不小，專門為大顯示器設計的網站在小螢幕上的顯示效果往往並不怎麼好，所以，一個網站並不是放之四海而皆準的。

究竟如何解決這一問題，大家眾說紛紜，有建議說創建一個移動友好型的網站，也有說根據使用者使用的設備來進行自訂。 設計移動友好型的網站難度不小，特別是是要運行不同的內容管理體系，此外同時維護兩個網站難度也不小而且代價很高，而且使用者在平板上不能使用網站的完整版本也會令他們相當搓火。 總之不管最終選擇哪種方案，都會增加額外的開發工作和額外的費用。

使用工具軟體

當然有時候也可以走捷徑：使用像Pressly或者OnSwipe一類的軟體。 使用這一類軟體，標準的網站頁面就像是被施了魔法一樣，適合平板流覽的頁面立刻就會完美地呈現在使用者面前。

以上這種方案是OnSwipe的CEO兼聯合創始人Jason Baptiste希望看到的，他說：

「人們將逐步從「點擊時代」進入「觸屏/掃屏」時代，平板的網站介面將更加集中，而且要求的是不同的設計方式。 有些人認為只要設計一次網站頁面然後到處使用，就可以一勞永逸了，我認為這根本站不住腳。 在平板上我們要注重的是觸感，所以設計的時候也應當以觸感為重點。 」

適合平板的網站頁面

那麼什麼樣的網站頁面才是適合平板電腦的？ 我認為需要做到以下幾點：簡潔乾淨的使用者介面，再加上大而顯眼的導航和控制元素，空間排布合理，儘量減少互動性外掛程式的使用，最好還要創建靈活的、能適應多種螢幕尺寸的框架；再考慮使用協力廠商服務， 針對平板或者其他類似的設備自動對網站頁面進行轉換。

其實平板電腦網站的設計者可以多學習Flipboard和 Pulse等個人化的內容聚合服務，它們設計的網站頁面在小型設備上的展示效果相當不錯，所以可以對它們加以研究並借鑒它們的設計方法與風格。

為平板打造完美的網站頁面的重要性已經一目了然：要麼將網站設計得更「平板化」，要不就等著流失使用者、收益損失的情況出現吧。 將網站轉換成平板電腦友好的環境宜早不宜遲，動作慢了，你就會和競爭對手形成差距。 如果你想利用平板電腦風暴所帶來的好處，並且創建一個對平板電腦友好的網站，趕緊行動吧！ 網站設計者們！

Via VB

來源：HTTP://leiphone.com/danice-0514-design-for-tablet.html