如何讓我們的網站像手機一樣簡單

仲介交易 HTTP://www.aliyun.com/zixun/aggregation/6858.html">SEO診斷 淘寶客 雲主機 技術大廳

目前，最流行的手機也就當屬蘋果4代了，為什麼會這麼火呢?使用者體驗，這也是蘋果公司一直強調的工作重點並產品長久不衰的因素。 那我們的網站呢?下面就以剖析手機介面元素和手機硬體、介面元素和軟體要求之間的關係，尋找一下設計思路，我們的網站又該怎麼做使用者體驗呢?

1. 內容：指的是整個介面中包含的所有資訊，介面上內容來源於流程圖中限定每個介面完成的功能。 內容受手機螢幕影響。 a)螢幕：手機上每個介面顯示的內容有限，最好每個介面完成單個任務，並保證使用者能很流暢地操作，儘量避免字元輸入。

2.交互：具體表現在使用者如何選擇主功能，如何選擇子功能，如何退出軟體等等。 交互設計就是在既定的內容框架下，根據使用者的使用習慣去安排介面上內容的顯示順序、顯示方式和介面操作方式(靜態)。 交互主要受手機操作方式和處理能力影響。 a) 手機操作方式：觸控式螢幕比物體按鍵動作更方便，例如觸控式螢幕的手機選擇某個功能時，只選點擊該功能即可，而物理按鍵的手機需要按手機上下鍵，再按手機確認鍵。 b)處理能力：手機處理能力強，軟體運行的更快，軟體和使用者之間的資訊交互就更快。

3.色彩：指的介面上採用的色系及顯示精度。 介面色彩設計由主要受螢幕、軟體大小和適配性影響。 a)螢幕：螢幕的解析度高，色彩區分更為明晰，細節更豐富，視覺效果更好。 b)軟體大小：軟體大小有限制，例如JAR包必須在400K以下，介面設計就不能使用過多的圖片，優先考慮程式自繪。 現有介面設計主要採用圖片橫向填充，如使用2*25圖元的圖片，橫向填充成240*25的背景圖。 c)適配性：為了保證軟體的可適配性，介面設計儘量使用單向色彩漸變效果，如2*25的圖片只有上下漸變效果。 另外，參照手機QQ等軟體和近期程式實現的情況上來看，設計上儘量少用圓角和半透明效果。

4. 排版：指的是介面上的整體佈局，包括圖片和文字的大小，圖片和文字在介面中的位置。 介面排版主要受操作方式、螢幕和適配性影響。 a)手機操作方式：觸控式螢幕可以使介面設計更為靈活，不拘泥于現有的介面設計這樣上下或者左右排版。 b)螢幕：螢幕大，介面排版可以寬鬆些，比如標題列可以大些。 c)適配性：儘量避免使用捲軸，最好是介面上的內容一屏能完全顯示，如主介面上的子功能控制在7個以內。

5.動態效果：指介面切換的變化過程。 動態效果受手機操作方式、處理能力和軟體大小的影響。 a)手機操作方式：多點觸摸時，會增加動態效果。 b)處理能力：手機處理能力強，可以增加複雜的動態效果。 漸變效果要花費不少時間去編寫，這部分設計和程式設計上都有點難度。 c)軟體大小：動態效果會增加程式負擔，還有可能增加圖片數目，勢必增加軟體大小。 如果有動態效果，也要放在使用者經常使用的介面上。

綜合以上論述，當主流手機操作方式改變時，介面的交互、介面排版和動態效果就可以相應地調整;軟體的大小可以增加時，介面色彩和動態效果也可能相應的調整。 那麼我們的網站呢?請大家一起思考下我們的網站的設計是否適合蘋果的產品一樣簡易操作呢?

原文作者：羽翼seo團隊成員--呆呆，原文位址：HTTP://www.sem0571.com，歡迎大家拍磚，seo高級交流群54626945一起交流溝通!