網(wǎng)站建設(shè)定制移動(dòng)端與計(jì)算機(jī)端網(wǎng)頁UI區(qū)別
- 編輯：admin -計(jì)算機(jī)端和移動(dòng)端輸出的區(qū)域尺寸不同，這同樣是一個(gè)很大的區(qū)別，目前主流顯示器的尺寸通常在19—24寸，而主流手機(jī)的尺寸則僅僅為5—7寸。這個(gè)不同造成的結(jié)果是在計(jì)算機(jī)端網(wǎng)頁UI中，可以盡量多地把內(nèi)容放進(jìn)首頁，而盡量避免更多的層級(jí)，一般類的網(wǎng)站，基本只有3級(jí)目錄，而這個(gè)3級(jí)目錄是建立在第一級(jí)所產(chǎn)生的子目錄足夠多的情況下。而在手機(jī)端網(wǎng)頁UI中，就需要更多的層級(jí)，因?yàn)椴豢赡茉诘谝粋€(gè)頁面里放入無限多的內(nèi)容，因此必須給用戶一個(gè)更加清晰的操作流程，讓用戶可以更容易知道當(dāng)前的位置，并且很容易到
移動(dòng)端網(wǎng)頁UI與計(jì)算機(jī)端網(wǎng)頁UI，由于操作的媒介不同，手指與鼠標(biāo)，這是一個(gè)很大的區(qū)別，從而造成了如下幾點(diǎn)不同。
1、界面不同
移動(dòng)平臺(tái)的界面設(shè)計(jì)保留了Web的核心部分，更加簡(jiǎn)潔，常用的功能按鈕更易于查找。移動(dòng)端UI是將PC端的一些內(nèi)容進(jìn)行重組，目的是突出移動(dòng)用戶的特點(diǎn)，優(yōu)先突出用戶所需要的一些信息。
2、位置不同
對(duì)于鼠標(biāo)，可以說按鈕在屏幕中的任何位置，對(duì)于操作的影響都不是很大，用戶可以輕松地拖動(dòng)鼠標(biāo)到任何想去的位置，點(diǎn)擊任何需要的按鈕。因此，可以看到大部分的網(wǎng)頁，為了保證網(wǎng)頁界面整體的美感，一般都將按鈕放置在邊緣的一個(gè)狹小空間內(nèi)。
而對(duì)于手機(jī)端網(wǎng)頁UI，需要考慮的是手機(jī)的使用環(huán)境，雖然當(dāng)前手機(jī)屏幕尺寸越來越大，但用戶更加希望單手就能操作手機(jī)，因此，為使用者設(shè)計(jì)的按鈕，通常更多地在屏幕下方，或左右手大拇指能控制到的區(qū)域內(nèi)。
3、操作習(xí)慣不同
對(duì)于鼠標(biāo)，通常會(huì)有單擊、雙擊和右鍵這幾種操作，因此在計(jì)算機(jī)端網(wǎng)頁UI中，可以設(shè)計(jì)右鍵菜單和雙擊動(dòng)作等。而對(duì)于手機(jī)端網(wǎng)頁UI，通常會(huì)設(shè)計(jì)點(diǎn)擊、長(zhǎng)按、滑動(dòng)甚至多點(diǎn)觸控，因此可以設(shè)計(jì)長(zhǎng)按呼出菜單、滑動(dòng)翻頁或切換，雙指的放大縮小以及雙指的旋轉(zhuǎn)等。
很明顯，設(shè)計(jì)者不能把以上這兩種操作習(xí)慣混用，試想一下如果手機(jī)應(yīng)用中出現(xiàn)右鍵菜單，或者網(wǎng)頁中出現(xiàn)多點(diǎn)觸控操作，那么瀏覽者會(huì)有怎樣的體驗(yàn)。
4、按鈕狀態(tài)不同
對(duì)于計(jì)算機(jī)端網(wǎng)頁UI中的按鈕，通常有默認(rèn)狀態(tài)、鼠標(biāo)經(jīng)過狀態(tài)、鼠標(biāo)點(diǎn)擊狀態(tài)和不可用狀態(tài)。而對(duì)于手機(jī)端網(wǎng)頁UI中的按鈕，通常只有默認(rèn)狀態(tài)、點(diǎn)擊狀態(tài)和不可用狀態(tài)。
因此，在計(jì)算機(jī)端網(wǎng)頁UI中，按鈕可以與環(huán)境以及背景更加和諧地融為一體，不必?fù)?dān)心用戶找不到按鈕，因?yàn)楫?dāng)用戶找不到的時(shí)候，會(huì)用鼠標(biāo)在屏幕上滑動(dòng)，這時(shí)按鈕的鼠標(biāo)經(jīng)過狀態(tài)就派上用場(chǎng)了。而在手機(jī)端網(wǎng)頁UI中，按鈕需要更加明確，指向性更強(qiáng)，讓用戶知道什么地方有按鈕，因?yàn)橐坏┯脩酎c(diǎn)擊，觸發(fā)按鈕的事件就發(fā)生了。
計(jì)算機(jī)端和移動(dòng)端輸出的區(qū)域尺寸不同，這同樣是一個(gè)很大的區(qū)別，目前主流顯示器的尺寸通常在19—24寸，而主流手機(jī)的尺寸則僅僅為5—7寸。這個(gè)不同造成的結(jié)果是在計(jì)算機(jī)端網(wǎng)頁UI中，可以盡量多地把內(nèi)容放進(jìn)首頁，而盡量避免更多的層級(jí)，一般類的網(wǎng)站，基本只有3級(jí)目錄，而這個(gè)3級(jí)目錄是建立在第一級(jí)所產(chǎn)生的子目錄足夠多的情況下。而在手機(jī)端網(wǎng)頁UI中，就需要更多的層級(jí)，因?yàn)椴豢赡茉诘谝粋€(gè)頁面里放入無限多的內(nèi)容，因此必須給用戶一個(gè)更加清晰的操作流程，讓用戶可以更容易知道當(dāng)前的位置，并且很容易到達(dá)自己想去的頁面。因?yàn)閙ap在手機(jī)端網(wǎng)頁UI中的重要性，要比計(jì)算機(jī)端網(wǎng)頁UI更大。
5、信息布局不同
移動(dòng)端所有的模塊都是從上至下展開，也成為瀑布流。好處是頁面內(nèi)容較多時(shí)，可以通過手指向下滾動(dòng)實(shí)現(xiàn)翻頁操作，布局方式逐漸趨于統(tǒng)一。
而PC端的布局方式因?yàn)榭臻g充足，相比移動(dòng)端單一的“瀑布流”布局來說，就顯得比較多種多樣了，例如常用的T型布局、口型布局和POP布局方式等。
